Merge pull request #1925 from embroider-build/new-index-html-format-css

New `index.html` format - app css
embroider-build · May 20, 2024 · e01da0a · e01da0a
2 parents 6b85eb1 + 6be1308
commit e01da0a
Show file tree

Hide file tree

Showing 14 changed files with 12 additions and 32 deletions.
diff --git a/packages/compat/src/compat-app-builder.ts b/packages/compat/src/compat-app-builder.ts
@@ -174,10 +174,8 @@ export class CompatAppBuilder {
         rootURL: this.rootURL(),
         prepare: (dom: JSDOM) => {
           let scripts = [...dom.window.document.querySelectorAll('script')];
-          let styles = [...dom.window.document.querySelectorAll('link[rel*="stylesheet"]')] as HTMLLinkElement[];
           return {
             javascript: this.compatApp.findAppScript(scripts, entrypoint),
-            styles: this.compatApp.findAppStyles(styles, entrypoint),
             implicitScripts: this.compatApp.findVendorScript(scripts, entrypoint),
             testJavascript: this.compatApp.findTestScript(scripts),
           };
@@ -361,8 +359,6 @@ export class CompatAppBuilder {
       }
     }
 
-    html.insertStyleLink(html.styles, `assets/${this.origAppPackage.name}.css`);
-
     if (this.fastbootConfig) {
       // any extra fastboot vendor files get inserted into our
       // html.implicitScripts section, after the regular implicit script

diff --git a/packages/compat/src/compat-app.ts b/packages/compat/src/compat-app.ts
@@ -738,19 +738,6 @@ export default class CompatApp {
     );
   }
 
-  findAppStyles(styles: HTMLLinkElement[], entrypoint: string): HTMLLinkElement {
-    let style = styles.find(
-      style => this.withoutRootURL(style.href) === this.legacyEmberAppInstance.options.outputPaths.app.css.app
-    );
-    return throwIfMissing(
-      style,
-      this.legacyEmberAppInstance.options.outputPaths.app.css.app,
-      styles.map(s => s.href),
-      entrypoint,
-      'app css'
-    );
-  }
-
   findVendorScript(scripts: HTMLScriptElement[], entrypoint: string): HTMLScriptElement {
     const vendorScript = '/@embroider/core/vendor.js';
     let vendor = scripts.find(script => this.withoutRootURL(script.src) === vendorScript);

diff --git a/packages/core/src/ember-html.ts b/packages/core/src/ember-html.ts
@@ -10,7 +10,6 @@ export interface EmberHTML {
 
   // these are mandatory, the Ember app may need to put things into them.
   javascript: Node;
-  styles: Node;
   implicitScripts: Node;
 
   // these are optional because you *may* choose to stick your implicit test
@@ -77,23 +76,21 @@ class Placeholder {
 export class PreparedEmberHTML {
   dom: JSDOM;
   javascript: Placeholder;
-  styles: Placeholder;
   implicitScripts: Placeholder;
   testJavascript: Placeholder;
 
   constructor(private asset: EmberAsset) {
     this.dom = new JSDOM(readFileSync(asset.sourcePath, 'utf8'));
     let html = asset.prepare(this.dom);
     this.javascript = Placeholder.find(html.javascript);
-    this.styles = Placeholder.replacing(html.styles);
     this.implicitScripts = Placeholder.find(html.implicitScripts);
     this.testJavascript = html.testJavascript
       ? Placeholder.replacing(html.testJavascript)
       : Placeholder.immediatelyAfter(this.javascript.end);
   }
 
   private placeholders(): Placeholder[] {
-    return [this.javascript, this.styles, this.implicitScripts, this.testJavascript];
+    return [this.javascript, this.implicitScripts, this.testJavascript];
   }
 
   clear() {

diff --git a/packages/util/tests/dummy/app/index.html b/packages/util/tests/dummy/app/index.html
@@ -9,7 +9,7 @@
     {{content-for "head"}}
 
     <link integrity="" rel="stylesheet" href="/@embroider/core/vendor.css">
-    <link integrity="" rel="stylesheet" href="{{rootURL}}assets/dummy.css">
+    <link integrity="" rel="stylesheet" href="/assets/dummy.css">
 
     {{content-for "head-footer"}}
   </head>

diff --git a/test-packages/sample-transforms/tests/dummy/app/index.html b/test-packages/sample-transforms/tests/dummy/app/index.html
@@ -10,7 +10,7 @@
     {{content-for "head"}}
 
     <link integrity="" rel="stylesheet" href="/@embroider/core/vendor.css">
-    <link integrity="" rel="stylesheet" href="{{rootURL}}assets/dummy.css">
+    <link integrity="" rel="stylesheet" href="/assets/dummy.css">
 
     {{content-for "head-footer"}}
   </head>

diff --git a/test-packages/sample-transforms/tests/index.html b/test-packages/sample-transforms/tests/index.html
@@ -11,7 +11,7 @@
     {{content-for "test-head"}}
 
     <link rel="stylesheet" href="/@embroider/core/vendor.css">
-    <link rel="stylesheet" href="{{rootURL}}assets/dummy.css">
+    <link rel="stylesheet" href="/assets/dummy.css">
     <link rel="stylesheet" href="/@embroider/core/test-support.css">
 
     {{content-for "head-footer"}}

diff --git a/tests/addon-template/tests/dummy/app/index.html b/tests/addon-template/tests/dummy/app/index.html
@@ -9,7 +9,7 @@
     {{content-for "head"}}
 
     <link integrity="" rel="stylesheet" href="/@embroider/core/vendor.css">
-    <link integrity="" rel="stylesheet" href="{{rootURL}}assets/dummy.css">
+    <link integrity="" rel="stylesheet" href="/assets/dummy.css">
 
     {{content-for "head-footer"}}
   </head>

diff --git a/tests/addon-template/tests/index.html b/tests/addon-template/tests/index.html
@@ -10,7 +10,7 @@
     {{content-for "test-head"}}
 
     <link rel="stylesheet" href="/@embroider/core/vendor.css">
-    <link rel="stylesheet" href="{{rootURL}}assets/dummy.css">
+    <link rel="stylesheet" href="/assets/dummy.css">
     <link rel="stylesheet" href="/@embroider/core/test-support.css">
 
     {{content-for "head-footer"}}

diff --git a/tests/app-template/app/index.html b/tests/app-template/app/index.html
@@ -9,7 +9,7 @@
     {{content-for "head"}}
 
     <link integrity="" rel="stylesheet" href="/@embroider/core/vendor.css">
-    <link integrity="" rel="stylesheet" href="{{rootURL}}assets/app-template.css">
+    <link integrity="" rel="stylesheet" href="/assets/app-template.css">
 
     {{content-for "head-footer"}}
   </head>

diff --git a/tests/app-template/tests/index.html b/tests/app-template/tests/index.html
@@ -9,7 +9,7 @@
     {{content-for "head"}} {{content-for "test-head"}}
 
     <link rel="stylesheet" href="/@embroider/core/vendor.css" />
-    <link rel="stylesheet" href="{{rootURL}}assets/app-template.css" />
+    <link rel="stylesheet" href="/assets/app-template.css" />
     <link rel="stylesheet" href="/@embroider/core/test-support.css" />
 
     {{content-for "head-footer"}} {{content-for "test-head-footer"}}

diff --git a/tests/fixtures/macro-test/tests/index.html b/tests/fixtures/macro-test/tests/index.html
@@ -11,7 +11,7 @@
     {{content-for "test-head"}}
 
     <link rel="stylesheet" href="/@embroider/core/vendor.css">
-    <link rel="stylesheet" href="{{rootURL}}assets/app-template.css">
+    <link rel="stylesheet" href="/assets/app-template.css">
     <link rel="stylesheet" href="/@embroider/core/test-support.css">
 
     {{content-for "head-footer"}}

diff --git a/tests/scenarios/compat-addon-classic-features-test.ts b/tests/scenarios/compat-addon-classic-features-test.ts
@@ -73,7 +73,7 @@ appScenarios
               {{content-for "head"}}
           
               <link integrity="" rel="stylesheet" href="/@embroider/core/vendor.css">
-              <link integrity="" rel="stylesheet" href="{{rootURL}}assets/app-template.css">
+              <link integrity="" rel="stylesheet" href="/assets/app-template.css">
           
               {{content-for "head-footer"}}
             </head>

diff --git a/tests/ts-app-template/app/index.html b/tests/ts-app-template/app/index.html
@@ -9,7 +9,7 @@
     {{content-for "head"}}
 
     <link integrity="" rel="stylesheet" href="/@embroider/core/vendor.css">
-    <link integrity="" rel="stylesheet" href="{{rootURL}}assets/ts-app-template.css">
+    <link integrity="" rel="stylesheet" href="/assets/ts-app-template.css">
 
     {{content-for "head-footer"}}
   </head>

diff --git a/tests/ts-app-template/tests/index.html b/tests/ts-app-template/tests/index.html
@@ -10,7 +10,7 @@
     {{content-for "test-head"}}
 
     <link rel="stylesheet" href="/@embroider/core/vendor.css">
-    <link rel="stylesheet" href="{{rootURL}}assets/ts-app-template.css">
+    <link rel="stylesheet" href="/assets/ts-app-template.css">
     <link rel="stylesheet" href="/@embroider/core/test-support.css">
 
     {{content-for "head-footer"}}