Cannot read property 'parentNode' of null when using Suspense in 3.1.0-beta.6
Version
3.1.0-beta.6
Reproduction link
Steps to reproduce
Add a component with async setup throwing an error:
export default defineComponent({
async setup() {
throw(new Error('Oops'))
return { msg: 'comp' }
}
})
Then use this component in a Suspense with error handling:
<template>
<div v-if="errorMessage">{{ errorMessage }}</div>
<Suspense>
<div>
<Comp></Comp>
</div>
</Suspense>
</template>
<script>
import { defineComponent, ref, onErrorCaptured } from 'vue';
import Comp from './Comp.vue';
export default defineComponent({
components: { Comp },
setup() {
const errorMessage = ref(null);
onErrorCaptured(e => {
errorMessage.value = e.message;
return false;
});
return { errorMessage }
}
})
</script>
Note the wrapping div
around the async component.
What is expected?
It should display the error message without logging an error in the console
What is actually happening?
This throws:
Uncaught (in promise) TypeError: Cannot read property 'parentNode' of null
at parentNode (VM76 runtime-dom.esm-browser.js:8711)
at patchBlockChildren (VM76 runtime-dom.esm-browser.js:6124)
at patchElement (VM76 runtime-dom.esm-browser.js:6092)
at processElement (VM76 runtime-dom.esm-browser.js:5919)
at patch (VM76 runtime-dom.esm-browser.js:5836)
at patchSuspense (VM76 runtime-dom.esm-browser.js:2672)
at Object.process (VM76 runtime-dom.esm-browser.js:2632)
at patch (VM76 runtime-dom.esm-browser.js:5845)
at patchBlockChildren (VM76 runtime-dom.esm-browser.js:6128)
at processFragment (VM76 runtime-dom.esm-browser.js:6189)
This works fine until beta.5 and works as well if removing the wrapping div element