Fix nested astro-island hydration race condition (#7197)
This commit is contained in:
parent
64b2b65410
commit
d72cfa7cad
3 changed files with 14 additions and 3 deletions
5
.changeset/light-sheep-hunt.md
Normal file
5
.changeset/light-sheep-hunt.md
Normal file
|
@ -0,0 +1,5 @@
|
||||||
|
---
|
||||||
|
'astro': patch
|
||||||
|
---
|
||||||
|
|
||||||
|
Fix nested astro-island hydration race condition
|
|
@ -53,7 +53,8 @@ declare const Astro: {
|
||||||
// Wait with a mutation observer
|
// Wait with a mutation observer
|
||||||
new MutationObserver((_, mo) => {
|
new MutationObserver((_, mo) => {
|
||||||
mo.disconnect();
|
mo.disconnect();
|
||||||
this.childrenConnectedCallback();
|
// Wait until the next macrotask to ensure children are really rendered
|
||||||
|
setTimeout(() => this.childrenConnectedCallback(), 0);
|
||||||
}).observe(this, { childList: true });
|
}).observe(this, { childList: true });
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -98,7 +99,11 @@ declare const Astro: {
|
||||||
hydrate = () => {
|
hydrate = () => {
|
||||||
if (
|
if (
|
||||||
!this.hydrator ||
|
!this.hydrator ||
|
||||||
(this.parentElement && this.parentElement.closest('astro-island[ssr]'))
|
// Make sure the island is mounted on the DOM before hydrating. It could be unmounted
|
||||||
|
// when the parent island hydrates and re-creates this island.
|
||||||
|
!this.isConnected ||
|
||||||
|
// Wait for parent island to hydrate first so we hydrate top-down.
|
||||||
|
this.parentElement?.closest('astro-island[ssr]')
|
||||||
) {
|
) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
@ -129,7 +134,7 @@ declare const Astro: {
|
||||||
window.dispatchEvent(new CustomEvent('astro:hydrate'));
|
window.dispatchEvent(new CustomEvent('astro:hydrate'));
|
||||||
};
|
};
|
||||||
attributeChangedCallback() {
|
attributeChangedCallback() {
|
||||||
if (this.hydrator) this.hydrate();
|
this.hydrate();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
|
|
@ -69,6 +69,7 @@ export default async function prebuild(...args) {
|
||||||
sourcefile: filepath,
|
sourcefile: filepath,
|
||||||
},
|
},
|
||||||
format: 'iife',
|
format: 'iife',
|
||||||
|
target: ['es2018'],
|
||||||
minify,
|
minify,
|
||||||
bundle: true,
|
bundle: true,
|
||||||
write: false,
|
write: false,
|
||||||
|
|
Loading…
Reference in a new issue