{"record":{"id":"cd4e47561f78aab4","repo":"yewstack/yew","slug":"failed-to-remove-child-element","errorCode":null,"errorMessage":"failed to remove child element","messagePattern":"failed to remove child element","errorType":"panic","errorClass":null,"httpStatus":null,"severity":"error","filePath":"packages/yew/src/dom_bundle/fragment.rs","lineNumber":155,"sourceCode":"\n    /// Deeply clones all nodes.\n    pub fn deep_clone(&self) -> Self {\n        let nodes = self\n            .iter()\n            .map(|m| m.clone_node_with_deep(true).expect(\"failed to clone node.\"))\n            .collect::<VecDeque<_>>();\n\n        // the cloned nodes are disconnected from the real dom, so next_child is `None`\n        Self(nodes, None)\n    }\n\n    // detaches current fragment.\n    pub fn detach(self, _root: &BSubtree, parent: &Element, parent_to_detach: bool) {\n        if !parent_to_detach {\n            for node in self.iter() {\n                parent\n                    .remove_child(node)\n                    .expect(\"failed to remove child element\");\n            }\n        }\n    }\n\n    /// Shift current Fragment into a different position in the dom.\n    pub fn shift(&self, next_parent: &Element, slot: DomSlot) -> DomSlot {\n        for node in self.iter() {\n            slot.insert(next_parent, node);\n        }\n\n        self.front().cloned().map(DomSlot::at).unwrap_or(slot)\n    }\n\n    /// Return the node that comes after all the nodes in this fragment\n    pub fn sibling_at_end(&self) -> Option<&Node> {\n        self.1.as_ref()\n    }\n}","sourceCodeStart":137,"sourceCodeEnd":173,"githubUrl":"https://github.com/yewstack/yew/blob/0e4a05472fac4e5fce1befe60fa4a1e43a36b6a3/packages/yew/src/dom_bundle/fragment.rs#L137-L173","documentation":"When a fragment unmounts, Yew removes every node it recorded as owning via parent.removeChild(node); removeChild returns NotFoundError when the node is no longer a child of that parent, and this expect turns that into a panic. Concretely, something modified the DOM underneath Yew: external code removed, replaced, or moved nodes inside the Yew-managed root without going through the virtual DOM, so Yew's bookkeeping no longer matches the live tree.","triggerScenarios":"Calling set_inner_html(\"\"), remove(), replace_with(), or append_child() on nodes Yew created (e.g. via a NodeRef cast to HtmlElement) so that at detach time Yew's recorded children are not attached to the recorded parent; third-party scripts or browser extensions rewriting regions of the page containing the app; teardown after a failed hydration already disturbed the tree.","commonSituations":"Clearing a container with innerHTML = '' before or instead of re-rendering; jQuery-style DOM manipulation inside the app root; ad/analytics scripts rewriting DOM; manually moving a Yew subtree to a different parent.","solutions":["Audit every direct DOM write inside the Yew root: set_inner_html, remove, replace_with, append_child on managed nodes - and remove them","Drive content changes through state + re-render instead of manual DOM edits","Keep third-party scripts and extensions away from the app root, or confine them to elements Yew does not manage","Where interop is unavoidable, let Yew render an empty wrapper and mutate only the inside of that wrapper from outside"],"exampleFix":"// before: destroying DOM Yew owns -> later detach panics with NotFoundError\nif let Some(el) = node_ref.cast::<web_sys::HtmlElement>() {\n    el.set_inner_html(\"\");\n}\n\n// after: clear via state; Yew re-renders and unmounts cleanly\nset_items(Vec::new());","handlingStrategy":"validation","validationCode":"// Before mutating any node from outside Yew, confirm Yew did not create it:\nfn is_safe_to_touch(el: &web_sys::Element, app_root: &str) -> bool {\n    // Nodes inside the app root are managed by Yew - leave them alone\n    el.closest(app_root).is_none()\n}","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Never call set_inner_html/remove/replace_with on nodes Yew rendered; change state and re-render instead","Confine third-party scripts to elements outside the Yew root or inside an empty wrapper Yew does not reconcile","Use NodeRef only to read properties and attach listeners, not to restructure the tree","Call AppHandle::destroy before externally rewriting the app root"],"tags":["dom","external-mutation","unmount","lifecycle"],"backgroundTag":"removechild-not-found-error","analyzedSha":"0e4a05472fac4e5fce1befe60fa4a1e43a36b6a3","analyzedAt":"2026-08-22T21:16:31.212Z","schemaVersion":2},"datasetVersion":"2026-08-23T01:17:44.959Z"}