diff --git a/src/generators/dom/index.js b/src/generators/dom/index.js index 23adc72f02..260cce52be 100644 --- a/src/generators/dom/index.js +++ b/src/generators/dom/index.js @@ -117,13 +117,11 @@ export default function dom ( parsed, source, options ) { if ( generator.css && options.css !== false ) { builders.main.addBlock( deindent` - var ${generator.alias( 'added_css' )} = false; function ${generator.alias( 'add_css' )} () { var style = ${generator.helper( 'createElement' )}( 'style' ); + style.id = ${JSON.stringify( generator.cssId + '-style' )}; style.textContent = ${JSON.stringify( generator.css )}; ${generator.helper( 'appendNode' )}( style, document.head ); - - ${generator.alias( 'added_css' )} = true; } ` ); } @@ -135,7 +133,7 @@ export default function dom ( parsed, source, options ) { builders.init.addLine( `this._torndown = false;` ); if ( parsed.css && options.css !== false ) { - builders.init.addLine( `if ( !${generator.alias( 'added_css' )} ) ${generator.alias( 'add_css' )}();` ); + builders.init.addLine( `if ( !document.getElementById( ${JSON.stringify( generator.cssId + '-style' )} ) ) ${generator.alias( 'add_css' )}();` ); } if ( generator.hasComponents || generator.hasIntroTransitions ) { diff --git a/test/js/samples/collapses-text-around-comments/expected.js b/test/js/samples/collapses-text-around-comments/expected.js index 418bda27b4..faa7e9d36a 100644 --- a/test/js/samples/collapses-text-around-comments/expected.js +++ b/test/js/samples/collapses-text-around-comments/expected.js @@ -8,13 +8,11 @@ var template = (function () { }; }()); -var added_css = false; function add_css () { var style = createElement( 'style' ); + style.id = "svelte-3842350206-style"; style.textContent = "\n\tp[svelte-3842350206], [svelte-3842350206] p {\n\t\tcolor: red;\n\t}\n"; appendNode( style, document.head ); - - added_css = true; } function create_main_fragment ( state, component ) { @@ -59,7 +57,7 @@ function SvelteComponent ( options ) { this._yield = options._yield; this._torndown = false; - if ( !added_css ) add_css(); + if ( !document.getElementById( "svelte-3842350206-style" ) ) add_css(); this._fragment = create_main_fragment( this._state, this ); if ( options.target ) this._fragment.mount( options.target, null ); @@ -85,4 +83,4 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio this._torndown = true; }; -export default SvelteComponent; \ No newline at end of file +export default SvelteComponent;