fix: clean up injected styles to prevent background persisting after errors

AbdullahShafqat-OG · AbdullahShafqat-OG · commit bd55f28fe2e7 · 2026-04-07T23:41:50.000+03:00
diff --git a/packages/repl/src/lib/workers/bundler/index.ts b/packages/repl/src/lib/workers/bundler/index.ts
@@ -376,11 +376,13 @@ async function get_bundle(
 						}
 					);
 					// add the CSS via injecting a style tag
+					const style_id = result.css.code.match(/\.svelte-([a-z0-9]+)/)?.[0]?.slice(1) ?? ('svelte-' + name.replace(/[^a-zA-Z0-9]/g, '_'));
 					result.js.code +=
 						'\n\n' +
 						`
 					import { styles as $$_styles } from '${VIRTUAL}/${STYLES}';
 					const $$__style = document.createElement('style');
+					$$__style.id = ${JSON.stringify(style_id)};
 					$$__style.textContent = ${JSON.stringify(result.css.code)};
 					document.head.append($$__style);
 					$$_styles.push($$__style);

Original file line number	Diff line number	Diff line change
`@@ -376,11 +376,13 @@ async function get_bundle(`
`376`	`376`	`}`
`377`	`377`	`);`
`378`	`378`	`// add the CSS via injecting a style tag`
	`379`	`+ const style_id = result.css.code.match(/\.svelte-([a-z0-9]+)/)?.[0]?.slice(1) ?? ('svelte-' + name.replace(/[^a-zA-Z0-9]/g, '_'));`
`379`	`380`	`result.js.code +=`
`380`	`381`	`'\n\n' +`
`381`	`382`	`
`382`	`383`	`import { styles as $$_styles } from '${VIRTUAL}/${STYLES}';`
`383`	`384`	`const $$__style = document.createElement('style');`
	`385`	`+ $$__style.id = ${JSON.stringify(style_id)};`
`384`	`386`	`$$__style.textContent = ${JSON.stringify(result.css.code)};`
`385`	`387`	`document.head.append($$__style);`
`386`	`388`	`$$_styles.push($$__style);`