From 97fc3825c9c9fee201b61345320457739469c986 Mon Sep 17 00:00:00 2001
From: Marine Dunstetter <bluecut.official@gmail.com>
Date: Wed, 24 Apr 2024 15:05:07 +0200
Subject: [PATCH 1/3] test(virtual test-support): add a test to check this
 script is correclty served and emitted

---
 .../compat-addon-classic-features-test.ts     | 30 +++++++++++--------
 1 file changed, 17 insertions(+), 13 deletions(-)

diff --git a/tests/scenarios/compat-addon-classic-features-test.ts b/tests/scenarios/compat-addon-classic-features-test.ts
index ecdd6170d..620edfdd4 100644
--- a/tests/scenarios/compat-addon-classic-features-test.ts
+++ b/tests/scenarios/compat-addon-classic-features-test.ts
@@ -135,29 +135,25 @@ appScenarios
 appScenarios
   .map('compat-addon-classic-features-virtual-scripts', () => {})
   .forEachScenario(scenario => {
-    let app: PreparedApp;
-
-    Qmodule(`${scenario.name} - build mode`, function (hooks) {
-      hooks.before(async assert => {
+    Qmodule(scenario.name, function (hooks) {
+      let app: PreparedApp;
+      hooks.before(async () => {
         app = await scenario.prepare();
+      });
+
+      test('virtual scripts are emitted in the build', async function (assert) {
         let result = await app.execute('pnpm build');
         assert.equal(result.exitCode, 0, result.output);
-      });
 
-      test('vendor.js script is emitted in the build', async function (assert) {
         assert.true(lstatSync(`${app.dir}/dist/@embroider/core/vendor.js`).isFile());
-      });
-    });
-
-    Qmodule(`${scenario.name} - dev mode`, function (hooks) {
-      hooks.before(async () => {
-        app = await scenario.prepare();
+        assert.true(lstatSync(`${app.dir}/dist/@embroider/core/test-support.js`).isFile());
       });
 
-      test('vendor.js script is served', async function (assert) {
+      test('virtual scripts contents are served in dev mode', async function (assert) {
         const server = CommandWatcher.launch('vite', ['--clearScreen', 'false'], { cwd: app.dir });
         try {
           const [, url] = await server.waitFor(/Local:\s+(https?:\/\/.*)\//g);
+
           let response = await fetch(`${url}/@embroider/core/vendor.js`);
           assert.strictEqual(response.status, 200);
           // checking the response status 200 is not enough to assert vendor.js is served,
@@ -165,6 +161,14 @@ appScenarios
           // and has a 200 status (for index.html being returned correctly)
           let text = await response.text();
           assert.true(!text.includes('<!DOCTYPE html>'));
+
+          response = await fetch(`${url}/@embroider/core/test-support.js`);
+          assert.strictEqual(response.status, 200);
+          // checking the response status 200 is not enough to assert test-support.js is served,
+          // because when the URL is not recognized, the response contains the index.html
+          // and has a 200 status (for index.html being returned correctly)
+          text = await response.text();
+          assert.true(!text.includes('<!DOCTYPE html>'));
         } finally {
           await server.shutdown();
         }

From 567d933ba9da3574e2d33679e53c59de9a4a4b0c Mon Sep 17 00:00:00 2001
From: Marine Dunstetter <bluecut.official@gmail.com>
Date: Wed, 24 Apr 2024 15:31:13 +0200
Subject: [PATCH 2/3] test(virtual styles): add a test to check vendor.css and
 test-support.css are served and built

---
 .../compat-addon-classic-features-test.ts     | 65 +++++++++++++++++++
 1 file changed, 65 insertions(+)

diff --git a/tests/scenarios/compat-addon-classic-features-test.ts b/tests/scenarios/compat-addon-classic-features-test.ts
index 620edfdd4..f7b383291 100644
--- a/tests/scenarios/compat-addon-classic-features-test.ts
+++ b/tests/scenarios/compat-addon-classic-features-test.ts
@@ -4,6 +4,8 @@ import { merge } from 'lodash';
 import QUnit from 'qunit';
 import type { PreparedApp } from 'scenario-tester';
 import fetch from 'node-fetch';
+import globby from 'globby';
+import { join } from 'path';
 
 import { appScenarios, baseAddon } from './scenarios';
 import CommandWatcher from './helpers/command-watcher';
@@ -175,3 +177,66 @@ appScenarios
       });
     });
   });
+
+appScenarios
+  .map('compat-addon-classic-features-virtual-styles', project => {
+    let myAddon = baseAddon();
+    myAddon.pkg.name = 'my-addon';
+    merge(myAddon.files, {
+      addon: {
+        styles: {
+          'addon.css': `
+            .my-addon-p { color: blue; }
+          `,
+        },
+      },
+    });
+    project.addDependency(myAddon);
+  })
+  .forEachScenario(scenario => {
+    Qmodule(scenario.name, function (hooks) {
+      let app: PreparedApp;
+      hooks.before(async () => {
+        app = await scenario.prepare();
+      });
+
+      test('virtual styles are included in the CSS of the production build', async function (assert) {
+        let result = await app.execute('pnpm build');
+        assert.equal(result.exitCode, 0, result.output);
+
+        let [mainStyles] = await globby('dist/assets/main-*.css', { cwd: app.dir });
+        let content = readFileSync(join(app.dir, mainStyles)).toString();
+        assert.true(content.includes('.my-addon-p{color:#00f}'));
+      });
+
+      test('virtual styles are included in the CSS of the test build', async function (assert) {
+        let result = await app.execute('pnpm test');
+        assert.equal(result.exitCode, 0, result.output);
+
+        let [mainStyles] = await globby('dist/assets/app-template-*.css', { cwd: app.dir });
+        let content = readFileSync(join(app.dir, mainStyles)).toString();
+        assert.true(content.includes('.my-addon-p{color:#00f}'));
+
+        let [testStyles] = await globby('dist/assets/tests-*.css', { cwd: app.dir });
+        content = readFileSync(join(app.dir, testStyles)).toString();
+        assert.true(content.includes('#qunit-tests'));
+      });
+
+      test('virtual styles are served in dev mode', async function (assert) {
+        const server = CommandWatcher.launch('vite', ['--clearScreen', 'false'], { cwd: app.dir });
+        try {
+          const [, url] = await server.waitFor(/Local:\s+(https?:\/\/.*)\//g);
+
+          let response = await fetch(`${url}/@embroider/core/vendor.css?direct`);
+          let text = await response.text();
+          assert.true(text.includes('.my-addon-p { color: blue; }'));
+
+          response = await fetch(`${url}/@embroider/core/test-support.css?direct`);
+          text = await response.text();
+          assert.true(text.includes('#qunit-tests'));
+        } finally {
+          await server.shutdown();
+        }
+      });
+    });
+  });

From 70035aa150c1175174d6659aba7cc0b6ae73a519 Mon Sep 17 00:00:00 2001
From: Marine Dunstetter <bluecut.official@gmail.com>
Date: Thu, 25 Apr 2024 14:27:38 +0200
Subject: [PATCH 3/3] test(virtual styles): make the build test able to find
 the CSS without hardcoding any filename

---
 .../compat-addon-classic-features-test.ts     | 30 ++++++++++++-------
 1 file changed, 20 insertions(+), 10 deletions(-)

diff --git a/tests/scenarios/compat-addon-classic-features-test.ts b/tests/scenarios/compat-addon-classic-features-test.ts
index f7b383291..80c789584 100644
--- a/tests/scenarios/compat-addon-classic-features-test.ts
+++ b/tests/scenarios/compat-addon-classic-features-test.ts
@@ -1,5 +1,6 @@
 import { throwOnWarnings } from '@embroider/core';
 import { lstatSync, readFileSync } from 'fs';
+import { readFile } from 'fs/promises';
 import { merge } from 'lodash';
 import QUnit from 'qunit';
 import type { PreparedApp } from 'scenario-tester';
@@ -204,22 +205,31 @@ appScenarios
         let result = await app.execute('pnpm build');
         assert.equal(result.exitCode, 0, result.output);
 
-        let [mainStyles] = await globby('dist/assets/main-*.css', { cwd: app.dir });
-        let content = readFileSync(join(app.dir, mainStyles)).toString();
-        assert.true(content.includes('.my-addon-p{color:#00f}'));
+        // TODO: replace with an Audit when it's ready to take any given dist
+        let styles = await globby('dist/**/*.css', { cwd: app.dir });
+        let readResult = await Promise.all(
+          styles.map(async styleFile => {
+            let content = await readFile(join(app.dir, styleFile));
+            return content.toString().includes('.my-addon-p{color:#00f}');
+          })
+        );
+        assert.true(readResult.includes(true));
       });
 
       test('virtual styles are included in the CSS of the test build', async function (assert) {
         let result = await app.execute('pnpm test');
         assert.equal(result.exitCode, 0, result.output);
 
-        let [mainStyles] = await globby('dist/assets/app-template-*.css', { cwd: app.dir });
-        let content = readFileSync(join(app.dir, mainStyles)).toString();
-        assert.true(content.includes('.my-addon-p{color:#00f}'));
-
-        let [testStyles] = await globby('dist/assets/tests-*.css', { cwd: app.dir });
-        content = readFileSync(join(app.dir, testStyles)).toString();
-        assert.true(content.includes('#qunit-tests'));
+        // TODO: replace with an Audit when it's ready to take any given dist
+        let styles = await globby('dist/**/*.css', { cwd: app.dir });
+        let readResult = await Promise.all(
+          styles.map(async styleFile => {
+            let content = await readFile(join(app.dir, styleFile));
+            return content.toString();
+          })
+        );
+        assert.true(readResult.some(content => content.includes('.my-addon-p{color:#00f}')));
+        assert.true(readResult.some(content => content.includes('#qunit-tests')));
       });
 
       test('virtual styles are served in dev mode', async function (assert) {