diff --git a/tests/scenarios/compat-addon-classic-features-test.ts b/tests/scenarios/compat-addon-classic-features-test.ts index ecdd6170d..80c789584 100644 --- a/tests/scenarios/compat-addon-classic-features-test.ts +++ b/tests/scenarios/compat-addon-classic-features-test.ts @@ -1,9 +1,12 @@ 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'; import fetch from 'node-fetch'; +import globby from 'globby'; +import { join } from 'path'; import { appScenarios, baseAddon } from './scenarios'; import CommandWatcher from './helpers/command-watcher'; @@ -135,29 +138,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()); + assert.true(lstatSync(`${app.dir}/dist/@embroider/core/test-support.js`).isFile()); }); - }); - Qmodule(`${scenario.name} - dev mode`, function (hooks) { - hooks.before(async () => { - app = await scenario.prepare(); - }); - - 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 +164,86 @@ appScenarios // and has a 200 status (for index.html being returned correctly) let text = await response.text(); assert.true(!text.includes('')); + + 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('')); + } finally { + await server.shutdown(); + } + }); + }); + }); + +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); + + // 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); + + // 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) { + 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(); }