{"record":{"id":"2c9b4898bcdfc346","repo":"slint-ui/slint","slug":"wasm-interpreter-could-not-retrieve-existing-html","errorCode":null,"errorMessage":"wasm-interpreter: Could not retrieve existing HTML Canvas element '{}'","messagePattern":"wasm-interpreter: Could not retrieve existing HTML Canvas element '(.+?)'","errorType":"panic","errorClass":null,"httpStatus":null,"severity":"critical","filePath":"api/wasm-interpreter/src/lib.rs","lineNumber":392,"sourceCode":"pub fn init() -> Result<(), JsValue> {\n    #[cfg(feature = \"console_error_panic_hook\")]\n    console_error_panic_hook::set_once();\n    let backend = i_slint_backend_winit::Backend::builder()\n        .with_spawn_event_loop(true)\n        .with_window_attributes_hook(|mut attrs| {\n            NEXT_CANVAS_ID.with(|next_id| {\n                if let Some(canvas_id) = next_id.borrow_mut().take() {\n                    use i_slint_backend_winit::winit::platform::web::WindowAttributesExtWebSys;\n\n                    use wasm_bindgen::JsCast;\n\n                    let html_canvas = web_sys::window()\n                        .expect(\"wasm-interpreter: Could not retrieve DOM window\")\n                        .document()\n                        .expect(\"wasm-interpreter: Could not retrieve DOM document\")\n                        .get_element_by_id(&canvas_id)\n                        .unwrap_or_else(|| {\n                            panic!(\n                                \"wasm-interpreter: Could not retrieve existing HTML Canvas element '{}'\",\n                                canvas_id\n                            )\n                        })\n                        .dyn_into::<web_sys::HtmlCanvasElement>()\n                        .unwrap_or_else(|_| {\n                            panic!(\n                                \"winit backend: Specified DOM element '{}' is not a HTML Canvas\",\n                                canvas_id\n                            )\n                        });\n                    attrs = attrs\n                        .with_canvas(Some(html_canvas))\n                        // Don't activate the window by default, as that will cause the page to scroll,\n                        // ignoring any existing anchors.\n                        .with_active(false);\n                    attrs\n                } else {","sourceCodeStart":374,"sourceCodeEnd":410,"githubUrl":"https://github.com/slint-ui/slint/blob/bb937076de3f7919766c1f25e2e969367cf77e9a/api/wasm-interpreter/src/lib.rs#L374-L410","documentation":"During WASM interpreter initialization, the runtime looks up the DOM element whose id was given as the canvas and fails when `document.getElementById` returns nothing. The library requires a pre-existing HTML canvas element to attach rendering to. Without it the UI cannot be mounted, so init panics.","triggerScenarios":"Calling `init` with a canvas_id that no element in the current document uses, or calling before the DOM element is added to the page.","commonSituations":"Typo or mismatch between the `<canvas id=...>` in index.html and the string passed to init; SPA frameworks removing/re-rendering the canvas before init runs; running the wasm module on a page without the expected markup.","solutions":["Ensure the HTML contains `<canvas id=\"canvas_id\">` with exactly the id passed to init","Call init after the DOM is ready (defer script, `DOMContentLoaded`, or render-after-mount hooks)","Verify the canvas isn't removed/replaced by framework re-rendering before init","Check the browser console that the script runs against the intended document (not an iframe without the canvas)"],"exampleFix":"// before\n<canvas id=\"my-canvas\"></canvas>\ninit(\"canva\").await;\n// after\ninit(\"my-canvas\").await; // id matches the HTML element","handlingStrategy":"validation","validationCode":"const el = document.getElementById(canvasId);\nif (!el) throw new Error(`Canvas '${canvasId}' not found before init()`);","typeGuard":"const isCanvas = (el: Element | null): el is HTMLCanvasElement => el instanceof HTMLCanvasElement;","tryCatchPattern":"try { await init(canvasId); } catch (e) { if (String(e).includes('HTML Canvas element')) console.error(`Add <canvas id=\"${canvasId}\"> to the page`); else throw e; }","preventionTips":["Match init's canvas id exactly with the HTML element id","Initialize after DOMContentLoaded or framework mount","Keep the canvas outside of re-rendered DOM subtrees"],"tags":["wasm","dom","canvas","init"],"backgroundTag":"entity-not-found","analyzedSha":"bb937076de3f7919766c1f25e2e969367cf77e9a","analyzedAt":"2026-09-16T01:37:20.251Z","contentChangedAt":"2026-09-16T01:37:20.251Z","schemaVersion":2},"datasetVersion":"2026-09-23T08:17:48.524Z"}