[ci] format
This commit is contained in:
parent
c9d8b10a85
commit
e02c72f445
8 changed files with 61 additions and 59 deletions
|
@ -94,4 +94,3 @@ test.describe('Nested Frameworks in Solid', () => {
|
||||||
await expect(count, 'count incremented by 1').toHaveText('1');
|
await expect(count, 'count incremented by 1').toHaveText('1');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -1,11 +1,11 @@
|
||||||
const HYDRATE_KEY = `astro:hydrate`;
|
const HYDRATE_KEY = `astro:hydrate`;
|
||||||
function debounce<T extends (...args: any[]) => any>(cb: T, wait = 20) {
|
function debounce<T extends (...args: any[]) => any>(cb: T, wait = 20) {
|
||||||
let h = 0;
|
let h = 0;
|
||||||
let callable = (...args: any) => {
|
let callable = (...args: any) => {
|
||||||
clearTimeout(h);
|
clearTimeout(h);
|
||||||
h = setTimeout(() => cb(...args), wait) as unknown as number;
|
h = setTimeout(() => cb(...args), wait) as unknown as number;
|
||||||
};
|
};
|
||||||
return callable as T;
|
return callable as T;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const notify = debounce(() => {
|
export const notify = debounce(() => {
|
||||||
|
@ -14,7 +14,8 @@ export const notify = debounce(() => {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
export const listen = (cb: (...args: any[]) => any) => window.addEventListener(HYDRATE_KEY, cb, { once: true });
|
export const listen = (cb: (...args: any[]) => any) =>
|
||||||
|
window.addEventListener(HYDRATE_KEY, cb, { once: true });
|
||||||
|
|
||||||
if (!(window as any)[HYDRATE_KEY]) {
|
if (!(window as any)[HYDRATE_KEY]) {
|
||||||
if ('MutationObserver' in window) {
|
if ('MutationObserver' in window) {
|
||||||
|
|
|
@ -14,7 +14,7 @@ export default async function onIdle(
|
||||||
let hydrate: Awaited<ReturnType<GetHydrateCallback>>;
|
let hydrate: Awaited<ReturnType<GetHydrateCallback>>;
|
||||||
|
|
||||||
async function idle() {
|
async function idle() {
|
||||||
listen(idle)
|
listen(idle);
|
||||||
const cb = async () => {
|
const cb = async () => {
|
||||||
const roots = document.querySelectorAll(`astro-root[ssr][uid="${astroId}"]`);
|
const roots = document.querySelectorAll(`astro-root[ssr][uid="${astroId}"]`);
|
||||||
if (roots.length === 0) return;
|
if (roots.length === 0) return;
|
||||||
|
|
|
@ -13,7 +13,7 @@ export default async function onMedia(
|
||||||
let hydrate: Awaited<ReturnType<GetHydrateCallback>>;
|
let hydrate: Awaited<ReturnType<GetHydrateCallback>>;
|
||||||
|
|
||||||
async function media() {
|
async function media() {
|
||||||
listen(media)
|
listen(media);
|
||||||
const cb = async () => {
|
const cb = async () => {
|
||||||
const roots = document.querySelectorAll(`astro-root[ssr][uid="${astroId}"]`);
|
const roots = document.querySelectorAll(`astro-root[ssr][uid="${astroId}"]`);
|
||||||
if (roots.length === 0) return;
|
if (roots.length === 0) return;
|
||||||
|
|
|
@ -16,7 +16,7 @@ export default async function onVisible(
|
||||||
let hydrate: Awaited<ReturnType<GetHydrateCallback>>;
|
let hydrate: Awaited<ReturnType<GetHydrateCallback>>;
|
||||||
|
|
||||||
async function visible() {
|
async function visible() {
|
||||||
listen(visible)
|
listen(visible);
|
||||||
const roots = document.querySelectorAll(`astro-root[ssr][uid="${astroId}"]`);
|
const roots = document.querySelectorAll(`astro-root[ssr][uid="${astroId}"]`);
|
||||||
const cb = async () => {
|
const cb = async () => {
|
||||||
if (roots.length === 0) return;
|
if (roots.length === 0) return;
|
||||||
|
|
|
@ -7,4 +7,4 @@ export default (element) => (Component, props, children) => {
|
||||||
h(Component, props, children != null ? h(StaticHtml, { value: children }) : children),
|
h(Component, props, children != null ? h(StaticHtml, { value: children }) : children),
|
||||||
element
|
element
|
||||||
);
|
);
|
||||||
}
|
};
|
||||||
|
|
|
@ -1,36 +1,37 @@
|
||||||
import { sharedConfig } from 'solid-js';
|
import { sharedConfig } from 'solid-js';
|
||||||
import { hydrate, render, createComponent } from 'solid-js/web';
|
import { hydrate, render, createComponent } from 'solid-js/web';
|
||||||
|
|
||||||
export default (element) => (Component, props, childHTML, { client }) => {
|
export default (element) =>
|
||||||
// Prepare global object expected by Solid's hydration logic
|
(Component, props, childHTML, { client }) => {
|
||||||
if (!window._$HY) {
|
// Prepare global object expected by Solid's hydration logic
|
||||||
window._$HY = { events: [], completed: new WeakSet(), r: {} };
|
if (!window._$HY) {
|
||||||
}
|
window._$HY = { events: [], completed: new WeakSet(), r: {} };
|
||||||
if (!element.hasAttribute('ssr')) return;
|
}
|
||||||
|
if (!element.hasAttribute('ssr')) return;
|
||||||
|
|
||||||
const fn = client === 'only' ? render : hydrate;
|
const fn = client === 'only' ? render : hydrate;
|
||||||
|
|
||||||
// Perform actual hydration
|
|
||||||
let children;
|
|
||||||
fn(
|
|
||||||
() =>
|
|
||||||
createComponent(Component, {
|
|
||||||
...props,
|
|
||||||
get children() {
|
|
||||||
if (childHTML != null) {
|
|
||||||
// hydrating
|
|
||||||
if (sharedConfig.context) {
|
|
||||||
children = element.querySelector('astro-fragment');
|
|
||||||
}
|
|
||||||
|
|
||||||
if (children == null) {
|
// Perform actual hydration
|
||||||
children = document.createElement('astro-fragment');
|
let children;
|
||||||
children.innerHTML = childHTML;
|
fn(
|
||||||
|
() =>
|
||||||
|
createComponent(Component, {
|
||||||
|
...props,
|
||||||
|
get children() {
|
||||||
|
if (childHTML != null) {
|
||||||
|
// hydrating
|
||||||
|
if (sharedConfig.context) {
|
||||||
|
children = element.querySelector('astro-fragment');
|
||||||
|
}
|
||||||
|
|
||||||
|
if (children == null) {
|
||||||
|
children = document.createElement('astro-fragment');
|
||||||
|
children.innerHTML = childHTML;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
return children;
|
||||||
return children;
|
},
|
||||||
},
|
}),
|
||||||
}),
|
element
|
||||||
element
|
);
|
||||||
);
|
};
|
||||||
};
|
|
||||||
|
|
|
@ -1,21 +1,22 @@
|
||||||
import { h, createSSRApp, createApp } from 'vue';
|
import { h, createSSRApp, createApp } from 'vue';
|
||||||
import StaticHtml from './static-html.js';
|
import StaticHtml from './static-html.js';
|
||||||
|
|
||||||
export default (element) => (Component, props, children, { client }) => {
|
export default (element) =>
|
||||||
delete props['class'];
|
(Component, props, children, { client }) => {
|
||||||
if (!element.hasAttribute('ssr')) return;
|
delete props['class'];
|
||||||
|
if (!element.hasAttribute('ssr')) return;
|
||||||
|
|
||||||
// Expose name on host component for Vue devtools
|
// Expose name on host component for Vue devtools
|
||||||
const name = Component.name ? `${Component.name} Host` : undefined;
|
const name = Component.name ? `${Component.name} Host` : undefined;
|
||||||
const slots = {};
|
const slots = {};
|
||||||
if (children != null) {
|
if (children != null) {
|
||||||
slots.default = () => h(StaticHtml, { value: children });
|
slots.default = () => h(StaticHtml, { value: children });
|
||||||
}
|
}
|
||||||
if (client === 'only') {
|
if (client === 'only') {
|
||||||
const app = createApp({ name, render: () => h(Component, props, slots) });
|
const app = createApp({ name, render: () => h(Component, props, slots) });
|
||||||
app.mount(element, false);
|
app.mount(element, false);
|
||||||
} else {
|
} else {
|
||||||
const app = createSSRApp({ name, render: () => h(Component, props, slots) });
|
const app = createSSRApp({ name, render: () => h(Component, props, slots) });
|
||||||
app.mount(element, true);
|
app.mount(element, true);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
Loading…
Reference in a new issue