michael/astro
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Migrate more tests to the static build (#2693)

Browse source 
* fix: disable HMR during build (#2684)

* Migrate more tests to the static build

* Only prepend links in non-legacy mode

* Add the 0-css tests

* Convert all CSS tests to the static build

* Migrate Astro global tests

* Remove .only

* Fix static build tests

* Migrate a few more

* More tests

* Move the lit test back to legacy

* Increase the test timeout

Co-authored-by: Nate Moore <natemoo-re@users.noreply.github.com>
This commit is contained in:
Matthew Phillips 2022-03-02 09:39:05 -05:00 committed by Nate Moore
parent 9bd2ff8195
commit 34c2d1e8fc
45 changed files with 144 additions and 419 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
packages/astro/package.json
View file

@ -54,8 +54,8 @@
"dev": "astro-scripts dev \"src/**/*.ts\"", "dev": "astro-scripts dev \"src/**/*.ts\"",
"postbuild": "astro-scripts copy \"src/**/*.astro\"", "postbuild": "astro-scripts copy \"src/**/*.astro\"",
"benchmark": "node test/benchmark/dev.bench.js && node test/benchmark/build.bench.js", "benchmark": "node test/benchmark/dev.bench.js && node test/benchmark/build.bench.js",
"test": "mocha --parallel --timeout 15000 --ignore **/lit-element.test.js && mocha **/lit-element.test.js", "test": "mocha --parallel --timeout 20000 --ignore **/lit-element.test.js && mocha --timeout 20000 **/lit-element.test.js",
"test:match": "mocha --timeout 15000 -g" "test:match": "mocha --timeout 20000 -g"
}, },
"dependencies": { "dependencies": {
"@astrojs/compiler": "^0.12.0-next.5", "@astrojs/compiler": "^0.12.0-next.5",

18
packages/astro/src/core/build/static-build.ts
View file

@ -38,8 +38,7 @@ export interface StaticBuildOptions {
const MAX_CONCURRENT_RENDERS = 10; const MAX_CONCURRENT_RENDERS = 10;
function addPageName(pathname: string, opts: StaticBuildOptions): void { function addPageName(pathname: string, opts: StaticBuildOptions): void {
const pathrepl = opts.astroConfig.buildOptions.pageUrlFormat === 'directory' ? '/index.html' : pathname === '/' ? 'index.html' : '.html'; opts.pageNames.push(pathname.replace(/\/?$/, '/').replace(/^\//, ''));
opts.pageNames.push(pathname.replace(/\/?$/, pathrepl).replace(/^\//, ''));
} }
// Gives back a facadeId that is relative to the root. // Gives back a facadeId that is relative to the root.
@ -362,7 +361,7 @@ async function generatePath(pathname: string, opts: StaticBuildOptions, gopts: G
debug('build', `Generating: ${pathname}`); debug('build', `Generating: ${pathname}`);
const site = astroConfig.buildOptions.site; const site = astroConfig.buildOptions.site;
const links = createLinkStylesheetElementSet(linkIds, site); const links = createLinkStylesheetElementSet(linkIds.reverse(), site);
const scripts = createModuleScriptElementWithSrcSet(hoistedId ? [hoistedId] : [], site); const scripts = createModuleScriptElementWithSrcSet(hoistedId ? [hoistedId] : [], site);
try { try {
@ -456,8 +455,7 @@ async function generateManifest(result: RollupOutput, opts: StaticBuildOptions,
} }
function getOutRoot(astroConfig: AstroConfig): URL { function getOutRoot(astroConfig: AstroConfig): URL {
const rootPathname = appendForwardSlash(astroConfig.buildOptions.site ? new URL(astroConfig.buildOptions.site).pathname : '/'); return new URL('./', astroConfig.dist);
return new URL('.' + rootPathname, astroConfig.dist);
} }
function getServerRoot(astroConfig: AstroConfig): URL { function getServerRoot(astroConfig: AstroConfig): URL {
@ -483,8 +481,10 @@ function getOutFolder(astroConfig: AstroConfig, pathname: string, routeType: Rou
switch (astroConfig.buildOptions.pageUrlFormat) { switch (astroConfig.buildOptions.pageUrlFormat) {
case 'directory': case 'directory':
return new URL('.' + appendForwardSlash(pathname), outRoot); return new URL('.' + appendForwardSlash(pathname), outRoot);
case 'file': case 'file': {
return new URL('.' + appendForwardSlash(npath.dirname(pathname)), outRoot); return new URL('.' + appendForwardSlash(npath.dirname(pathname)), outRoot);
}
} }
} }
} }
@ -497,8 +497,10 @@ function getOutFile(astroConfig: AstroConfig, outFolder: URL, pathname: string,
switch (astroConfig.buildOptions.pageUrlFormat) { switch (astroConfig.buildOptions.pageUrlFormat) {
case 'directory': case 'directory':
return new URL('./index.html', outFolder); return new URL('./index.html', outFolder);
case 'file': case 'file': {
return new URL('./' + npath.basename(pathname) + '.html', outFolder); const baseName = npath.basename(pathname);
return new URL('./' + (baseName || 'index') + '.html', outFolder);
}
} }
} }
} }

74
packages/astro/src/core/render/dev/index.ts
View file

@ -1,5 +1,5 @@
import type * as vite from 'vite'; import type * as vite from 'vite';
import type { AstroConfig, ComponentInstance, Renderer, RouteData, RuntimeMode } from '../../../@types/astro'; import type { AstroConfig, ComponentInstance, Renderer, RouteData, RuntimeMode, SSRElement } from '../../../@types/astro';
import { LogOptions } from '../../logger.js'; import { LogOptions } from '../../logger.js';
import { fileURLToPath } from 'url'; import { fileURLToPath } from 'url';
import { getStylesForURL } from './css.js'; import { getStylesForURL } from './css.js';
@ -48,14 +48,15 @@ export async function preload({ astroConfig, filePath, viteServer }: SSROptions)
/** use Vite to SSR */ /** use Vite to SSR */
export async function render(renderers: Renderer[], mod: ComponentInstance, ssrOpts: SSROptions): Promise<string> { export async function render(renderers: Renderer[], mod: ComponentInstance, ssrOpts: SSROptions): Promise<string> {
const { astroConfig, filePath, logging, mode, origin, pathname, route, routeCache, viteServer } = ssrOpts; const { astroConfig, filePath, logging, mode, origin, pathname, route, routeCache, viteServer } = ssrOpts;
const legacy = astroConfig.buildOptions.legacyBuild;
// Add hoisted script tags // Add hoisted script tags
const scripts = createModuleScriptElementWithSrcSet( const scripts = createModuleScriptElementWithSrcSet(
!astroConfig.buildOptions.legacyBuild && mod.hasOwnProperty('$$metadata') ? Array.from(mod.$$metadata.hoistedScriptPaths()) : [] !legacy && mod.hasOwnProperty('$$metadata') ? Array.from(mod.$$metadata.hoistedScriptPaths()) : []
); );
// Inject HMR scripts // Inject HMR scripts
if (mod.hasOwnProperty('$$metadata') && mode === 'development' && !astroConfig.buildOptions.legacyBuild) { if (mod.hasOwnProperty('$$metadata') && mode === 'development' && !legacy) {
scripts.add({ scripts.add({
props: { type: 'module', src: '/@vite/client' }, props: { type: 'module', src: '/@vite/client' },
children: '', children: '',
@ -66,9 +67,31 @@ export async function render(renderers: Renderer[], mod: ComponentInstance, ssrO
}); });
} }
// Pass framework CSS in as link tags to be appended to the page.
let links = new Set<SSRElement>();
if(!legacy) {
[...getStylesForURL(filePath, viteServer)].forEach((href) => {
if (mode === 'development' && svelteStylesRE.test(href)) {
scripts.add({
props: { type: 'module', src: href },
children: '',
});
} else {
links.add({
props: {
rel: 'stylesheet',
href,
'data-astro-injected': true,
},
children: '',
});
}
});
}
let content = await coreRender({ let content = await coreRender({
legacyBuild: astroConfig.buildOptions.legacyBuild, legacyBuild: astroConfig.buildOptions.legacyBuild,
links: new Set(), links,
logging, logging,
markdownRender: astroConfig.markdownOptions.render, markdownRender: astroConfig.markdownOptions.render,
mod, mod,
@ -101,7 +124,7 @@ export async function render(renderers: Renderer[], mod: ComponentInstance, ssrO
const tags: vite.HtmlTagDescriptor[] = []; const tags: vite.HtmlTagDescriptor[] = [];
// dev only: inject Astro HMR client // dev only: inject Astro HMR client
if (mode === 'development' && astroConfig.buildOptions.legacyBuild) { if (mode === 'development' && legacy) {
tags.push({ tags.push({
tag: 'script', tag: 'script',
attrs: { type: 'module' }, attrs: { type: 'module' },
@ -113,25 +136,28 @@ export async function render(renderers: Renderer[], mod: ComponentInstance, ssrO
} }
// inject CSS // inject CSS
[...getStylesForURL(filePath, viteServer)].forEach((href) => { if(legacy) {
if (mode === 'development' && svelteStylesRE.test(href)) { [...getStylesForURL(filePath, viteServer)].forEach((href) => {
tags.push({ if (mode === 'development' && svelteStylesRE.test(href)) {
tag: 'script', tags.push({
attrs: { type: 'module', src: href }, tag: 'script',
injectTo: 'head', attrs: { type: 'module', src: href },
}); injectTo: 'head',
} else { });
tags.push({ } else {
tag: 'link', tags.push({
attrs: { tag: 'link',
rel: 'stylesheet', attrs: {
href, rel: 'stylesheet',
'data-astro-injected': true, href,
}, 'data-astro-injected': true,
injectTo: 'head', },
}); injectTo: 'head',
} });
}); }
});
}
// add injected tags // add injected tags
content = injectTags(content, tags); content = injectTags(content, tags);

1
packages/astro/src/core/render/sitemap.ts
View file

@ -3,7 +3,6 @@ const STATUS_CODE_PAGE_REGEXP = /\/[0-9]{3}\/?$/;
/** Construct sitemap.xml given a set of URLs */ /** Construct sitemap.xml given a set of URLs */
export function generateSitemap(pages: string[]): string { export function generateSitemap(pages: string[]): string {
// TODO: find way to respect <link rel="canonical"> URLs here // TODO: find way to respect <link rel="canonical"> URLs here
// TODO: find way to exclude pages from sitemap // TODO: find way to exclude pages from sitemap
// copy just in case original copy is needed // copy just in case original copy is needed

18
packages/astro/src/runtime/server/index.ts
View file

@ -337,12 +337,14 @@ export function createAstro(filePathname: string, _site: string, projectRootStr:
}; };
} }
const toAttributeString = (value: any) => String(value).replace(/&/g, '&#38;').replace(/"/g, '&#34;'); const toAttributeString = (value: any, shouldEscape = true) => shouldEscape ?
String(value).replace(/&/g, '&#38;').replace(/"/g, '&#34;') :
value;
const STATIC_DIRECTIVES = new Set(['set:html', 'set:text']); const STATIC_DIRECTIVES = new Set(['set:html', 'set:text']);
// A helper used to turn expressions into attribute key/value // A helper used to turn expressions into attribute key/value
export function addAttribute(value: any, key: string) { export function addAttribute(value: any, key: string, shouldEscape = true) {
if (value == null) { if (value == null) {
return ''; return '';
} }
@ -372,15 +374,15 @@ Make sure to use the static attribute syntax (\`${key}={value}\`) instead of the
if (value === true && (key.startsWith('data-') || htmlBooleanAttributes.test(key))) { if (value === true && (key.startsWith('data-') || htmlBooleanAttributes.test(key))) {
return unescapeHTML(` ${key}`); return unescapeHTML(` ${key}`);
} else { } else {
return unescapeHTML(` ${key}="${toAttributeString(value)}"`); return unescapeHTML(` ${key}="${toAttributeString(value, shouldEscape)}"`);
} }
} }
// Adds support for `<Component {...value} /> // Adds support for `<Component {...value} />
export function spreadAttributes(values: Record<any, any>) { export function spreadAttributes(values: Record<any, any>, shouldEscape = true) {
let output = ''; let output = '';
for (const [key, value] of Object.entries(values)) { for (const [key, value] of Object.entries(values)) {
output += addAttribute(value, key); output += addAttribute(value, key, shouldEscape);
} }
return unescapeHTML(output); return unescapeHTML(output);
} }
@ -463,7 +465,7 @@ export async function renderPage(result: SSRResult, Component: AstroComponentFac
const links = Array.from(result.links) const links = Array.from(result.links)
.filter(uniqueElements) .filter(uniqueElements)
.map((link) => renderElement('link', link)); .map((link) => renderElement('link', link, false));
// inject styles & scripts at end of <head> // inject styles & scripts at end of <head>
let headPos = template.indexOf('</head>'); let headPos = template.indexOf('</head>');
@ -513,7 +515,7 @@ function getHTMLElementName(constructor: typeof HTMLElement) {
return assignedName; return assignedName;
} }
function renderElement(name: string, { props: _props, children = '' }: SSRElement) { function renderElement(name: string, { props: _props, children = '' }: SSRElement, shouldEscape = true) {
// Do not print `hoist`, `lang`, `global` // Do not print `hoist`, `lang`, `global`
const { lang: _, 'data-astro-id': astroId, 'define:vars': defineVars, ...props } = _props; const { lang: _, 'data-astro-id': astroId, 'define:vars': defineVars, ...props } = _props;
if (defineVars) { if (defineVars) {
@ -530,5 +532,5 @@ function renderElement(name: string, { props: _props, children = '' }: SSRElemen
children = defineScriptVars(defineVars) + '\n' + children; children = defineScriptVars(defineVars) + '\n' + children;
} }
} }
return `<${name}${spreadAttributes(props)}>${children}</${name}>`; return `<${name}${spreadAttributes(props, shouldEscape)}>${children}</${name}>`;
} }

25
packages/astro/test/0-css.test.js
View file

@ -15,7 +15,11 @@ describe('CSS', function () {
fixture = await loadFixture({ fixture = await loadFixture({
projectRoot: './fixtures/0-css/', projectRoot: './fixtures/0-css/',
renderers: ['@astrojs/renderer-react', '@astrojs/renderer-svelte', '@astrojs/renderer-vue'], renderers: ['@astrojs/renderer-react', '@astrojs/renderer-svelte', '@astrojs/renderer-vue'],
buildOptions: { legacyBuild: true } // TODO make this test work without legacyBuild vite: {
build: {
assetsInlineLimit: 0
}
}
}); });
}); });
@ -32,7 +36,7 @@ describe('CSS', function () {
// get bundled CSS (will be hashed, hence DOM query) // get bundled CSS (will be hashed, hence DOM query)
const html = await fixture.readFile('/index.html'); const html = await fixture.readFile('/index.html');
$ = cheerio.load(html); $ = cheerio.load(html);
const bundledCSSHREF = $('link[rel=stylesheet][href^=./assets/]').attr('href'); const bundledCSSHREF = $('link[rel=stylesheet][href^=/assets/]').attr('href');
bundledCSS = await fixture.readFile(bundledCSSHREF.replace(/^\/?/, '/')); bundledCSS = await fixture.readFile(bundledCSSHREF.replace(/^\/?/, '/'));
}); });
@ -48,7 +52,8 @@ describe('CSS', function () {
expect(el2.attr('class')).to.equal(`visible ${scopedClass}`); expect(el2.attr('class')).to.equal(`visible ${scopedClass}`);
// 2. check CSS // 2. check CSS
expect(bundledCSS).to.include(`.blue.${scopedClass}{color:#b0e0e6}.color\\:blue.${scopedClass}{color:#b0e0e6}.visible.${scopedClass}{display:block}`); const expected = `.blue.${scopedClass}{color:#b0e0e6}.color\\\\:blue.${scopedClass}{color:#b0e0e6}.visible.${scopedClass}{display:block}`;
expect(bundledCSS).to.include(expected);
}); });
it('No <style> skips scoping', async () => { it('No <style> skips scoping', async () => {
@ -61,7 +66,8 @@ describe('CSS', function () {
}); });
it('Using hydrated components adds astro-root styles', async () => { it('Using hydrated components adds astro-root styles', async () => {
expect(bundledCSS).to.include('display:contents'); const inline = $('style').html();
expect(inline).to.include('display: contents');
}); });
it('<style lang="sass">', async () => { it('<style lang="sass">', async () => {
@ -218,7 +224,7 @@ describe('CSS', function () {
it('<style>', async () => { it('<style>', async () => {
const el = $('#svelte-css'); const el = $('#svelte-css');
const classes = el.attr('class').split(' '); const classes = el.attr('class').split(' ');
const scopedClass = classes.find((name) => /^s-[A-Za-z0-9-]+/.test(name)); const scopedClass = classes.find((name) => name !== 'svelte-css' && /^svelte-[A-Za-z0-9-]+/.test(name));
// 1. check HTML // 1. check HTML
expect(el.attr('class')).to.include('svelte-css'); expect(el.attr('class')).to.include('svelte-css');
@ -230,7 +236,7 @@ describe('CSS', function () {
it('<style lang="sass">', async () => { it('<style lang="sass">', async () => {
const el = $('#svelte-sass'); const el = $('#svelte-sass');
const classes = el.attr('class').split(' '); const classes = el.attr('class').split(' ');
const scopedClass = classes.find((name) => /^s-[A-Za-z0-9-]+/.test(name)); const scopedClass = classes.find((name) => name !== 'svelte-sass' && /^svelte-[A-Za-z0-9-]+/.test(name));
// 1. check HTML // 1. check HTML
expect(el.attr('class')).to.include('svelte-sass'); expect(el.attr('class')).to.include('svelte-sass');
@ -242,7 +248,7 @@ describe('CSS', function () {
it('<style lang="scss">', async () => { it('<style lang="scss">', async () => {
const el = $('#svelte-scss'); const el = $('#svelte-scss');
const classes = el.attr('class').split(' '); const classes = el.attr('class').split(' ');
const scopedClass = classes.find((name) => /^s-[A-Za-z0-9-]+/.test(name)); const scopedClass = classes.find((name) => name !== 'svelte-scss' && /^svelte-[A-Za-z0-9-]+/.test(name));
// 1. check HTML // 1. check HTML
expect(el.attr('class')).to.include('svelte-scss'); expect(el.attr('class')).to.include('svelte-scss');
@ -273,11 +279,6 @@ describe('CSS', function () {
expect((await fixture.fetch(href)).status).to.equal(200); expect((await fixture.fetch(href)).status).to.equal(200);
}); });
it('resolves CSS in src/', async () => {
const href = $('link[href$="linked.css"]').attr('href');
expect((await fixture.fetch(href)).status).to.equal(200);
});
// Skipped until upstream fix lands // Skipped until upstream fix lands
// Our fix: https://github.com/withastro/astro/pull/2106 // Our fix: https://github.com/withastro/astro/pull/2106
// OG Vite PR: https://github.com/vitejs/vite/pull/5940 // OG Vite PR: https://github.com/vitejs/vite/pull/5940

4
packages/astro/test/astro-css-bundling-import.test.js
View file

@ -8,7 +8,6 @@ describe('CSS Bundling (ESM import)', () => {
before(async () => { before(async () => {
fixture = await loadFixture({ fixture = await loadFixture({
projectRoot: './fixtures/astro-css-bundling-import/', projectRoot: './fixtures/astro-css-bundling-import/',
buildOptions: { legacyBuild: true } // TODO make this test work without legacyBuild
}); });
await fixture.build(); await fixture.build();
}); });
@ -35,8 +34,7 @@ describe('CSS Bundling (ESM import)', () => {
expect(css.indexOf('p{color:green}')).to.be.greaterThan(css.indexOf('p{color:#00f}')); expect(css.indexOf('p{color:green}')).to.be.greaterThan(css.indexOf('p{color:#00f}'));
}); });
// TODO: re-enable this it('no empty CSS files', async () => {
it.skip('no empty CSS files', async () => {
for (const page of ['/page-1/index.html', '/page-2/index.html']) { for (const page of ['/page-1/index.html', '/page-2/index.html']) {
const html = await fixture.readFile(page); const html = await fixture.readFile(page);
const $ = cheerio.load(html); const $ = cheerio.load(html);

41
packages/astro/test/astro-css-bundling-nested-layouts.test.js
View file

@ -1,41 +0,0 @@
import { expect } from 'chai';
import cheerio from 'cheerio';
import { loadFixture } from './test-utils.js';
describe('CSS bundling - nested layouts', () => {
let fixture;
before(async () => {
fixture = await loadFixture({
projectRoot: './fixtures/astro-css-bundling-nested-layouts/',
buildOptions: { legacyBuild: true } // TODO make this test work without legacyBuild
});
await fixture.build();
});
it('page-1 has all CSS', async () => {
const html = await fixture.readFile('/page-1/index.html');
const $ = cheerio.load(html);
const stylesheets = $('link[rel=stylesheet]')
.toArray()
.map((el) => el.attribs.href);
// page-one.[hash].css exists
expect(stylesheets.some((href) => /page-one\.\w+\.css/.test(href))).to.be.true;
});
it('page-2 has all CSS', async () => {
const html = await fixture.readFile('/page-2/index.html');
const $ = cheerio.load(html);
const stylesheets = $('link[rel=stylesheet]')
.toArray()
.map((el) => el.attribs.href);
// page-one.[hash].css exists
expect(stylesheets.some((href) => /page-one\.\w+\.css/.test(href))).to.be.true;
// page-2.[hash].css exists
expect(stylesheets.some((href) => /page-2\.\w+\.css/.test(href))).to.be.true;
});
});

25
packages/astro/test/astro-css-bundling.test.js
View file

@ -5,11 +5,9 @@ import { loadFixture } from './test-utils.js';
// note: the hashes should be deterministic, but updating the file contents will change hashes // note: the hashes should be deterministic, but updating the file contents will change hashes
// be careful not to test that the HTML simply contains CSS, because it always will! filename and quanity matter here (bundling). // be careful not to test that the HTML simply contains CSS, because it always will! filename and quanity matter here (bundling).
const EXPECTED_CSS = { const EXPECTED_CSS = {
'/index.html': ['./assets/index', './assets/typography'], // don’t match hashes, which change based on content '/index.html': ['/assets/index'], // don’t match hashes, which change based on content
'/one/index.html': ['../assets/one'], '/one/index.html': ['/assets/one'],
'/two/index.html': ['../assets/two', '../assets/typography'], '/two/index.html': ['/assets/two'],
'/preload/index.html': ['../assets/preload'],
'/preload-merge/index.html': ['../assets/preload-merge'],
}; };
const UNEXPECTED_CSS = ['/src/components/nav.css', '../css/typography.css', '../css/colors.css', '../css/page-index.css', '../css/page-one.css', '../css/page-two.css']; const UNEXPECTED_CSS = ['/src/components/nav.css', '../css/typography.css', '../css/colors.css', '../css/page-index.css', '../css/page-one.css', '../css/page-two.css'];
@ -19,7 +17,6 @@ describe('CSS Bundling', function () {
before(async () => { before(async () => {
fixture = await loadFixture({ fixture = await loadFixture({
projectRoot: './fixtures/astro-css-bundling/', projectRoot: './fixtures/astro-css-bundling/',
buildOptions: { legacyBuild: true } // TODO make this test work without legacyBuild
}); });
await fixture.build({ mode: 'production' }); await fixture.build({ mode: 'production' });
}); });
@ -46,21 +43,7 @@ describe('CSS Bundling', function () {
expect(link).to.have.lengthOf(0); expect(link).to.have.lengthOf(0);
} }
// test 3: preload tags was not removed and attributes was preserved // test 3: assert all bundled CSS was built and contains CSS
if (filepath === '/preload/index.html') {
const stylesheet = $('link[rel="stylesheet"][href^="../assets/preload"]');
const preload = $('link[rel="preload"][href^="../assets/preload"]');
expect(stylesheet[0].attribs.media).to.equal('print');
expect(preload).to.have.lengthOf(1); // Preload tag was removed
}
// test 4: preload tags was not removed and attributes was preserved
if (filepath === '/preload-merge/index.html') {
const preload = $('link[rel="preload"]');
expect(preload).to.have.lengthOf(1);
}
// test 5: assert all bundled CSS was built and contains CSS
for (const url of builtCSS.keys()) { for (const url of builtCSS.keys()) {
const css = await fixture.readFile(url); const css = await fixture.readFile(url);
expect(css).to.be.ok; expect(css).to.be.ok;

9
packages/astro/test/astro-dynamic.test.js
View file

@ -8,7 +8,6 @@ describe('Dynamic components', () => {
before(async () => { before(async () => {
fixture = await loadFixture({ fixture = await loadFixture({
projectRoot: './fixtures/astro-dynamic/', projectRoot: './fixtures/astro-dynamic/',
buildOptions: { legacyBuild: true } // TODO make this test work without legacyBuild
}); });
await fixture.build(); await fixture.build();
}); });
@ -17,7 +16,7 @@ describe('Dynamic components', () => {
const html = await fixture.readFile('/index.html'); const html = await fixture.readFile('/index.html');
const $ = cheerio.load(html); const $ = cheerio.load(html);
expect($('script').length).to.eq(1); expect($('script').length).to.eq(2);
}); });
it('Loads pages using client:media hydrator', async () => { it('Loads pages using client:media hydrator', async () => {
@ -26,11 +25,7 @@ describe('Dynamic components', () => {
const $ = cheerio.load(html); const $ = cheerio.load(html);
// test 1: static value rendered // test 1: static value rendered
let js = await fixture.readFile(new URL($('script').attr('src'), root).pathname); expect($('script').length).to.equal(2); // One for each
expect(js).to.include(`value:"(max-width: 700px)"`);
// test 2: dynamic value rendered
expect(js).to.include(`value:"(max-width: 600px)"`);
}); });
it('Loads pages using client:only hydrator', async () => { it('Loads pages using client:only hydrator', async () => {

10
packages/astro/test/astro-global.test.js
View file

@ -10,8 +10,7 @@ describe('Astro.*', () => {
projectRoot: './fixtures/astro-global/', projectRoot: './fixtures/astro-global/',
buildOptions: { buildOptions: {
site: 'https://mysite.dev/blog/', site: 'https://mysite.dev/blog/',
sitemap: false, sitemap: false
legacyBuild: true
}, },
}); });
await fixture.build(); await fixture.build();
@ -49,13 +48,6 @@ describe('Astro.*', () => {
expect($('#site').attr('href')).to.equal('https://mysite.dev/blog/'); expect($('#site').attr('href')).to.equal('https://mysite.dev/blog/');
}); });
it('Astro.resolve built', async () => {
const html = await fixture.readFile('/resolve/index.html');
const $ = cheerio.load(html);
expect($('img').attr('src')).to.include('assets/penguin.ccd44411.png'); // Main src/images
expect($('#inner-child img').attr('src')).to.include('assets/penguin.b9ab122a.png');
});
it('Astro.fetchContent() returns the correct "url" property, including buildOptions.site subpath', async () => { it('Astro.fetchContent() returns the correct "url" property, including buildOptions.site subpath', async () => {
const html = await fixture.readFile('/posts/1/index.html'); const html = await fixture.readFile('/posts/1/index.html');
const $ = cheerio.load(html); const $ = cheerio.load(html);

3
packages/astro/test/astro-jsx.test.js
View file

@ -20,9 +20,6 @@ describe('JSX', () => {
projectRoot: cwd, projectRoot: cwd,
renderers: renderers.map((name) => `@astrojs/renderer-${name}`), renderers: renderers.map((name) => `@astrojs/renderer-${name}`),
dist: new URL(`${cwd}dist-${n}/`, import.meta.url), dist: new URL(`${cwd}dist-${n}/`, import.meta.url),
buildOptions: {
legacyBuild: true
}
}).then((fixture) => { }).then((fixture) => {
fixtures[renderers.toString()] = fixture; fixtures[renderers.toString()] = fixture;
return fixture.build(); return fixture.build();

1
packages/astro/test/astro-pagination.test.js
View file

@ -11,7 +11,6 @@ describe('Pagination', () => {
buildOptions: { buildOptions: {
site: 'https://mysite.dev/blog/', site: 'https://mysite.dev/blog/',
sitemap: false, sitemap: false,
legacyBuild: true,
}, },
}); });
await fixture.build(); await fixture.build();

8
packages/astro/test/astro-partial-html.test.js
View file

@ -9,7 +9,6 @@ describe('Partial HTML ', async () => {
before(async () => { before(async () => {
fixture = await loadFixture({ fixture = await loadFixture({
projectRoot: './fixtures/astro-partial-html/', projectRoot: './fixtures/astro-partial-html/',
buildOptions: { legacyBuild: true } // TODO make this test work without legacyBuild
}); });
devServer = await fixture.startDevServer(); devServer = await fixture.startDevServer();
}); });
@ -26,7 +25,12 @@ describe('Partial HTML ', async () => {
expect(html).to.match(/^<!DOCTYPE html/); expect(html).to.match(/^<!DOCTYPE html/);
// test 2: correct CSS present // test 2: correct CSS present
const css = $('style[astro-style]').html(); const link = $('link').attr('href');
const css = await fixture.fetch(link, {
headers: {
accept: 'text/css'
}
}).then(res => res.text());
expect(css).to.match(/\.astro-[^{]+{color:red;}/); expect(css).to.match(/\.astro-[^{]+{color:red;}/);
}); });

2
packages/astro/test/astro-sitemap-rss.test.js
View file

@ -10,7 +10,6 @@ describe('Sitemaps', () => {
buildOptions: { buildOptions: {
site: 'https://astro.build/', site: 'https://astro.build/',
sitemap: true, sitemap: true,
legacyBuild: true,
}, },
}); });
await fixture.build(); await fixture.build();
@ -54,7 +53,6 @@ describe('Sitemaps served from subdirectory', () => {
buildOptions: { buildOptions: {
site: 'https://astro.build/base-directory/', site: 'https://astro.build/base-directory/',
sitemap: true, sitemap: true,
legacyBuild: true
}, },
}); });
await fixture.build(); await fixture.build();

30
packages/astro/test/builtins.test.js
View file

@ -1,30 +0,0 @@
import { expect } from 'chai';
import cheerio from 'cheerio';
import { loadFixture } from './test-utils.js';
describe('Node builtins', () => {
let fixture;
before(async () => {
fixture = await loadFixture({
projectRoot: './fixtures/builtins/',
buildOptions: { legacyBuild: true } // TODO make this test work without legacyBuild
});
await fixture.build();
});
it('Can be used with the node: prefix', async () => {
const html = await fixture.readFile('/index.html');
const $ = cheerio.load(html);
expect($('#version').text()).to.equal('1.2.0');
expect($('#dep-version').text()).to.equal('0.1.0');
});
it('Can also be used with the non-prefixed version', async () => {
const html = await fixture.readFile('/bare/index.html');
const $ = cheerio.load(html);
expect($('h1').text()).to.equal('true');
});
});

5
packages/astro/test/custom-elements.test.js
View file

@ -9,7 +9,6 @@ describe('Custom Elements', () => {
fixture = await loadFixture({ fixture = await loadFixture({
projectRoot: './fixtures/custom-elements/', projectRoot: './fixtures/custom-elements/',
renderers: ['@astrojs/test-custom-element-renderer'], renderers: ['@astrojs/test-custom-element-renderer'],
buildOptions: { legacyBuild: true } // TODO make this test work without legacyBuild
}); });
await fixture.build(); await fixture.build();
}); });
@ -48,8 +47,8 @@ describe('Custom Elements', () => {
expect($('my-element template[shadowroot=open]')).to.have.lengthOf(1); expect($('my-element template[shadowroot=open]')).to.have.lengthOf(1);
// Hydration // Hydration
// test 3: Component and polyfill scripts bundled together // test 3: Component and polyfill scripts bundled separately
expect($('script[type=module]')).to.have.lengthOf(1); expect($('script[type=module]')).to.have.lengthOf(2);
}); });
it('Polyfills are added even if not hydrating', async () => { it('Polyfills are added even if not hydrating', async () => {

15
packages/astro/test/fixtures/0-css/src/pages/index.astro vendored
View file

@ -19,7 +19,7 @@ import VueScoped from '../components/VueScoped.vue';
import VueScss from '../components/VueScss.vue'; import VueScss from '../components/VueScss.vue';
import ReactDynamic from '../components/ReactDynamic.jsx'; import ReactDynamic from '../components/ReactDynamic.jsx';
import importedUrl from '../styles/imported-url.css?url'; import '../styles/imported-url.css';
--- ---
<html> <html>
@ -36,10 +36,15 @@ import importedUrl from '../styles/imported-url.css?url';
} }
</style> </style>
<link rel="stylesheet" type="text/css" href="/global.css"> <link rel="stylesheet" type="text/css" href="/global.css">
<link rel="stylesheet" type="text/css" href={Astro.resolve('../styles/linked.css')}> <style>
<link rel="stylesheet" type="text/css" href={Astro.resolve('../styles/linked.scss')}> @import '../styles/linked.css';
<link rel="stylesheet" type="text/css" href={Astro.resolve('../styles/linked.sass')}> </style>
<link rel="stylesheet" type="text/css" href={importedUrl}> <style lang="scss">
@import '../styles/linked.scss';
</style>
<style lang="sass">
@import '../styles/linked.sass'
</style>
</head> </head>
<body> <body>
<div class="wrapper"> <div class="wrapper">

27
packages/astro/test/fixtures/astro-css-bundling-nested-layouts/src/layouts/BaseLayout.astro vendored
View file

@ -1,27 +0,0 @@
---
import "../styles/site.css"
const {title} = Astro.props;
---
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width" />
<title>{title}</title>
<style>
</style>
</head>
<body>
<ul>
<li><a href="/page-1">Page 1</a></li>
<li><a href="/page-2">Page 2</a></li>
<!-- <li><a href="/page-2-reduced-layout">Page 2 reduced layout</a></li> -->
</ul>
<slot></slot>
</body>
</html>

12
packages/astro/test/fixtures/astro-css-bundling-nested-layouts/src/layouts/PageLayout.astro vendored
View file

@ -1,12 +0,0 @@
---
import BaseLayout from "./BaseLayout.astro"
import "../styles/page-one.css"
const {title} = Astro.props;
---
<BaseLayout title={title}>
<main id="page">
<slot></slot>
</main>
</BaseLayout>

15
packages/astro/test/fixtures/astro-css-bundling-nested-layouts/src/pages/page-1.astro vendored
View file

@ -1,15 +0,0 @@
---
import PageLayout from "../layouts/PageLayout.astro"
const date = new Date();
---
<PageLayout title="Page 1">
<h1>Page 1</h1>
<p>This page has styling in dev-server. But the built page has no styling. </p>
<p>Check <code>dist/page-1/index.html</code>. There are no stylesheets imported.</p>
<p>Additionally, there is an empty js file in the <code>dist/assets</code> folder. Thankfully the file is not required by any page.</p>
<p>Execute the build <code>npm run build</code> and preview it <code>npx http-server dist/</code> at <a href="https://github-qoihup--8080.local.webcontainer.io/page-1/">https://github-qoihup--8080.local.webcontainer.io/page-1/</a></p>
<p>Date: {date}</p>
</PageLayout>

9
packages/astro/test/fixtures/astro-css-bundling-nested-layouts/src/pages/page-2.astro vendored
View file

@ -1,9 +0,0 @@
---
import PageLayout from "../layouts/PageLayout.astro"
import "../styles/page-two.css"
---
<PageLayout title="Page 2">
<h1>Page 2</h1>
<p>Nothing to see here. Check <a href="/page-1">Page 1</a></p>
</PageLayout>

3
packages/astro/test/fixtures/astro-css-bundling-nested-layouts/src/styles/page-one.css vendored
View file

@ -1,3 +0,0 @@
p {
color: blue;
}

3
packages/astro/test/fixtures/astro-css-bundling-nested-layouts/src/styles/page-two.css vendored
View file

@ -1,3 +0,0 @@
p {
color: green;
}

7
packages/astro/test/fixtures/astro-css-bundling-nested-layouts/src/styles/site.css vendored
View file

@ -1,7 +0,0 @@
p {
color: red;
}
h1 {
outline: 1px solid red;
}

8
packages/astro/test/fixtures/astro-css-bundling/src/pages/index.astro vendored
View file

@ -4,9 +4,11 @@ import Nav from '../components/Nav.astro';
<html> <html>
<head> <head>
<link rel="stylesheet" href={Astro.resolve('../css/typography.css')}> <style>
<link rel="stylesheet" href={Astro.resolve('../css/colors.css')}> @import '../css/typography.css';
<link rel="stylesheet" href={Astro.resolve('../css/page-index.css')}> @import '../css/colors.css';
@import '../css/page-index.css';
</style>
</head> </head>
<body> <body>
<Nav /> <Nav />

6
packages/astro/test/fixtures/astro-css-bundling/src/pages/one.astro vendored
View file

@ -4,8 +4,10 @@ import Nav from '../components/Nav.astro';
<html> <html>
<head> <head>
<link rel="stylesheet" href={Astro.resolve('../css/typography.css')} /> <style>
<link rel="stylesheet" href={Astro.resolve('../css/page-one.css')} /> @import '../css/typography.css';
@import '../css/page-one.css';
</style>
</head> </head>
<body> <body>
<Nav /> <Nav />

17
packages/astro/test/fixtures/astro-css-bundling/src/pages/preload-merge.astro vendored
View file

@ -1,17 +0,0 @@
---
import Nav from '../components/Nav.astro';
---
<html>
<head>
<link rel="preload" as="style" href={Astro.resolve('../css/page-preload-merge.css')} />
<link rel="preload" as="style" href={Astro.resolve('../css/page-preload-merge-2.css')} />
<link rel="stylesheet" href={Astro.resolve('../css/page-preload-merge.css')} />
<link rel="stylesheet" href={Astro.resolve('../css/page-preload-merge-2.css')} />
</head>
<body>
<Nav />
<h1>Preload merge page</h1>
</body>
</html>

14
packages/astro/test/fixtures/astro-css-bundling/src/pages/preload.astro vendored
View file

@ -1,14 +0,0 @@
---
import Nav from '../components/Nav.astro';
---
<html>
<head>
<link rel="preload" as="style" href={Astro.resolve('../css/page-preload.css')} />
<link rel="stylesheet" href={Astro.resolve('../css/page-preload.css')} media="print" onload="this.media='all'" />
</head>
<body>
<Nav />
<h1>Preload page</h1>
</body>
</html>

8
packages/astro/test/fixtures/astro-css-bundling/src/pages/two.astro vendored
View file

@ -4,9 +4,11 @@ import Nav from '../components/Nav.astro';
<html> <html>
<head> <head>
<link rel="stylesheet" href={Astro.resolve('../css/typography.css')} /> <style>
<link rel="stylesheet" href={Astro.resolve('../css/colors.css')} /> @import '../css/typography.css';
<link rel="stylesheet" href={Astro.resolve('../css/page-two.css')} /> @import '../css/colors.css';
@import '../css/page-two.css';
</style>
</head> </head>
<body> <body>
<Nav /> <Nav />

5
packages/astro/test/fixtures/astro-global/src/components/ChildResolve.astro vendored
View file

@ -1,5 +0,0 @@
---
const penguinUrl = Astro.resolve('../images/penguin.png');
---
<img src={penguinUrl} />
<img src="../images/penguin.png" />

6
packages/astro/test/fixtures/astro-global/src/components/nested/InnerChild.astro vendored
View file

@ -1,6 +0,0 @@
---
const penguinUrl = Astro.resolve('./images/penguin.png');
---
<div id="inner-child">
<img src={penguinUrl} />
</div>

BIN
packages/astro/test/fixtures/astro-global/src/components/nested/images/penguin.png vendored
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 76 KiB

14
packages/astro/test/fixtures/astro-global/src/pages/resolve.astro vendored
View file

@ -1,14 +0,0 @@
---
import Child from '../components/ChildResolve.astro';
import InnerChild from '../components/nested/InnerChild.astro';
---
<html>
<head>
<title>Testing</title>
</head>
<body>
<Child />
<InnerChild />
</body>
</html>

8
packages/astro/test/fixtures/builtins/package.json vendored
View file

@ -1,8 +0,0 @@
{
"name": "@astrojs/astro-test-builtins",
"version": "1.2.0",
"private": true,
"dependencies": {
"@astrojs/astro-test-builtins-dep": "file:./packages/dep"
}
}

8
packages/astro/test/fixtures/builtins/packages/dep/CHANGELOG.md vendored
View file

@ -1,8 +0,0 @@
# @astrojs/astro-test-builtins-dep
## 0.1.0
### Minor Changes
- [#2202](https://github.com/withastro/astro/pull/2202) [`45cea6ae`](https://github.com/withastro/astro/commit/45cea6aec5a310fed4cb8da0d96670d6b99a2539) Thanks [@jonathantneal](https://github.com/jonathantneal)! - Officially drop support for Node v12. The minimum supported version is now Node v14.15+,

10
packages/astro/test/fixtures/builtins/packages/dep/main.js vendored
View file

@ -1,10 +0,0 @@
import fs from 'fs';
const readFile = fs.promises.readFile;
export async function readJson(path) {
const json = await readFile(path, 'utf-8');
const data = JSON.parse(json);
return data;
}

7
packages/astro/test/fixtures/builtins/packages/dep/package.json vendored
View file

@ -1,7 +0,0 @@
{
"name": "@astrojs/astro-test-builtins-dep",
"version": "0.1.0",
"private": true,
"module": "main.js",
"main": "main.js"
}

9
packages/astro/test/fixtures/builtins/src/components/Version.astro vendored
View file

@ -1,9 +0,0 @@
---
import { promises as fs } from 'node:fs';
const url = new URL('../../package.json', import.meta.url);
const json = await fs.readFile(url, 'utf-8');
const data = JSON.parse(json);
---
<span id="version">{data.version}</span>

12
packages/astro/test/fixtures/builtins/src/pages/bare.astro vendored
View file

@ -1,12 +0,0 @@
---
import { builtinModules } from 'module';
---
<html>
<head>
<title>Bare node import</title>
</head>
<body>
<h1>{Array.isArray(builtinModules)}</h1>
</body>
</html>

16
packages/astro/test/fixtures/builtins/src/pages/index.astro vendored
View file

@ -1,16 +0,0 @@
---
import Version from '../components/Version.astro';
import { readJson } from '@astrojs/astro-test-builtins-dep';
const depPath = new URL('../../packages/dep/package.json', import.meta.url);
const title = 'My App';
const depVersion = (await readJson(depPath)).version;
---
<title>{title}</title>
<h1>{title}</h1>
<Version />
<span id="dep-version">{depVersion}</span>

7
packages/astro/test/preview-routing.test.js
View file

@ -16,7 +16,6 @@ describe('Preview Routing', () => {
trailingSlash: 'never', trailingSlash: 'never',
port: 4000, port: 4000,
}, },
buildOptions: { legacyBuild: true } // TODO make this test work without legacyBuild
}); });
await fixture.build(); await fixture.build();
previewServer = await fixture.preview(); previewServer = await fixture.preview();
@ -71,7 +70,6 @@ describe('Preview Routing', () => {
trailingSlash: 'always', trailingSlash: 'always',
port: 4001, port: 4001,
}, },
buildOptions: { legacyBuild: true } // TODO make this test work without legacyBuild
}); });
await fixture.build(); await fixture.build();
previewServer = await fixture.preview(); previewServer = await fixture.preview();
@ -130,7 +128,6 @@ describe('Preview Routing', () => {
trailingSlash: 'ignore', trailingSlash: 'ignore',
port: 4002, port: 4002,
}, },
buildOptions: { legacyBuild: true } // TODO make this test work without legacyBuild
}); });
await fixture.build(); await fixture.build();
previewServer = await fixture.preview(); previewServer = await fixture.preview();
@ -189,7 +186,6 @@ describe('Preview Routing', () => {
projectRoot: './fixtures/with-subpath-no-trailing-slash/', projectRoot: './fixtures/with-subpath-no-trailing-slash/',
buildOptions: { buildOptions: {
pageUrlFormat: 'file', pageUrlFormat: 'file',
legacyBuild: true
}, },
devOptions: { devOptions: {
trailingSlash: 'never', trailingSlash: 'never',
@ -247,7 +243,6 @@ describe('Preview Routing', () => {
projectRoot: './fixtures/with-subpath-no-trailing-slash/', projectRoot: './fixtures/with-subpath-no-trailing-slash/',
buildOptions: { buildOptions: {
pageUrlFormat: 'file', pageUrlFormat: 'file',
legacyBuild: true
}, },
devOptions: { devOptions: {
trailingSlash: 'always', trailingSlash: 'always',
@ -309,7 +304,6 @@ describe('Preview Routing', () => {
projectRoot: './fixtures/with-subpath-no-trailing-slash/', projectRoot: './fixtures/with-subpath-no-trailing-slash/',
buildOptions: { buildOptions: {
pageUrlFormat: 'file', pageUrlFormat: 'file',
legacyBuild: true
}, },
devOptions: { devOptions: {
trailingSlash: 'ignore', trailingSlash: 'ignore',
@ -371,7 +365,6 @@ describe('Preview Routing', () => {
projectRoot: './fixtures/with-subpath-no-trailing-slash/', projectRoot: './fixtures/with-subpath-no-trailing-slash/',
buildOptions: { buildOptions: {
pageUrlFormat: 'file', pageUrlFormat: 'file',
legacyBuild: true
}, },
devOptions: { devOptions: {
trailingSlash: 'ignore', trailingSlash: 'ignore',

3
packages/astro/test/remote-css.test.js
View file

@ -8,7 +8,6 @@ describe('Remote CSS', () => {
before(async () => { before(async () => {
fixture = await loadFixture({ fixture = await loadFixture({
projectRoot: './fixtures/remote-css/', projectRoot: './fixtures/remote-css/',
buildOptions: { legacyBuild: true } // TODO make this test work without legacyBuild
}); });
await fixture.build(); await fixture.build();
}); });
@ -18,7 +17,7 @@ describe('Remote CSS', () => {
const $ = cheerio.load(html); const $ = cheerio.load(html);
const relPath = $('link').attr('href'); const relPath = $('link').attr('href');
const css = await fixture.readFile('/' + relPath); const css = await fixture.readFile(relPath);
expect(css).to.match(/https:\/\/unpkg.com\/open-props/); expect(css).to.match(/https:\/\/unpkg.com\/open-props/);
expect(css).to.match(/body/); expect(css).to.match(/body/);

4
packages/astro/test/static-build-page-url-format.test.js
View file

@ -23,12 +23,12 @@ describe("Static build - pageUrlFormat: 'file'", () => {
}); });
it('Builds pages in root', async () => { it('Builds pages in root', async () => {
const html = await fixture.readFile('/subpath/one.html'); const html = await fixture.readFile('/one.html');
expect(html).to.be.a('string'); expect(html).to.be.a('string');
}); });
it('Builds pages in subfolders', async () => { it('Builds pages in subfolders', async () => {
const html = await fixture.readFile('/subpath/sub/page.html'); const html = await fixture.readFile('/sub/page.html');
expect(html).to.be.a('string'); expect(html).to.be.a('string');
}); });
}); });

32
packages/astro/test/static-build.test.js
View file

@ -25,12 +25,12 @@ describe('Static build', () => {
}); });
it('Builds out .astro pages', async () => { it('Builds out .astro pages', async () => {
const html = await fixture.readFile('/subpath/index.html'); const html = await fixture.readFile('/index.html');
expect(html).to.be.a('string'); expect(html).to.be.a('string');
}); });
it('can build pages using fetchContent', async () => { it('can build pages using fetchContent', async () => {
const html = await fixture.readFile('/subpath/index.html'); const html = await fixture.readFile('/index.html');
const $ = cheerio.load(html); const $ = cheerio.load(html);
const link = $('.posts a'); const link = $('.posts a');
const href = link.attr('href'); const href = link.attr('href');
@ -38,18 +38,18 @@ describe('Static build', () => {
}); });
it('Builds out .md pages', async () => { it('Builds out .md pages', async () => {
const html = await fixture.readFile('/subpath/posts/thoughts/index.html'); const html = await fixture.readFile('/posts/thoughts/index.html');
expect(html).to.be.a('string'); expect(html).to.be.a('string');
}); });
it('Builds out .json files', async () => { it('Builds out .json files', async () => {
const content = await fixture.readFile('/subpath/company.json').then((text) => JSON.parse(text)); const content = await fixture.readFile('/company.json').then((text) => JSON.parse(text));
expect(content.name).to.equal('Astro Technology Company'); expect(content.name).to.equal('Astro Technology Company');
expect(content.url).to.equal('https://astro.build/'); expect(content.url).to.equal('https://astro.build/');
}); });
it('Builds out async .json files', async () => { it('Builds out async .json files', async () => {
const content = await fixture.readFile('/subpath/posts.json').then((text) => JSON.parse(text)); const content = await fixture.readFile('/posts.json').then((text) => JSON.parse(text));
expect(Array.isArray(content)).to.equal(true); expect(Array.isArray(content)).to.equal(true);
expect(content).deep.equal([ expect(content).deep.equal([
{ {
@ -67,20 +67,20 @@ describe('Static build', () => {
const slugs = ['thing1', 'thing2']; const slugs = ['thing1', 'thing2'];
for (const slug of slugs) { for (const slug of slugs) {
const content = await fixture.readFile(`/subpath/data/${slug}.json`).then((text) => JSON.parse(text)); const content = await fixture.readFile(`/data/${slug}.json`).then((text) => JSON.parse(text));
expect(content.name).to.equal('Astro Technology Company'); expect(content.name).to.equal('Astro Technology Company');
expect(content.url).to.equal('https://astro.build/'); expect(content.url).to.equal('https://astro.build/');
expect(content.slug).to.equal(slug); expect(content.slug).to.equal(slug);
} }
}); });
function createFindEvidence(expected) { function createFindEvidence(expected, prefix) {
return async function findEvidence(pathname) { return async function findEvidence(pathname) {
const html = await fixture.readFile(pathname); const html = await fixture.readFile(pathname);
const $ = cheerio.load(html); const $ = cheerio.load(html);
const links = $('link[rel=stylesheet]'); const links = $('link[rel=stylesheet]');
for (const link of links) { for (const link of links) {
const href = $(link).attr('href'); const href = $(link).attr('href').slice('/subpath'.length);
const data = await fixture.readFile(addLeadingSlash(href)); const data = await fixture.readFile(addLeadingSlash(href));
if (expected.test(data)) { if (expected.test(data)) {
return true; return true;
@ -95,7 +95,7 @@ describe('Static build', () => {
const findEvidence = createFindEvidence(/height:( )*45vw/); const findEvidence = createFindEvidence(/height:( )*45vw/);
it('Page level CSS is added', async () => { it('Page level CSS is added', async () => {
const found = await findEvidence('/subpath/index.html'); const found = await findEvidence('/index.html');
expect(found).to.equal(true, 'Did not find page-level CSS on this page'); expect(found).to.equal(true, 'Did not find page-level CSS on this page');
}); });
}); });
@ -104,12 +104,12 @@ describe('Static build', () => {
const findEvidence = createFindEvidence(/var\(--c\)/); const findEvidence = createFindEvidence(/var\(--c\)/);
it('Included on the index page', async () => { it('Included on the index page', async () => {
const found = await findEvidence('/subpath/index.html'); const found = await findEvidence('/index.html');
expect(found).to.equal(true, 'Did not find shared CSS on this page'); expect(found).to.equal(true, 'Did not find shared CSS on this page');
}); });
it('Included on a md page', async () => { it('Included on a md page', async () => {
const found = await findEvidence('/subpath/posts/thoughts/index.html'); const found = await findEvidence('/posts/thoughts/index.html');
expect(found).to.equal(true, 'Did not find shared CSS on this page'); expect(found).to.equal(true, 'Did not find shared CSS on this page');
}); });
}); });
@ -118,30 +118,30 @@ describe('Static build', () => {
const findEvidence = createFindEvidence(/var\(--c-black\)/); const findEvidence = createFindEvidence(/var\(--c-black\)/);
it('Is included in the index CSS', async () => { it('Is included in the index CSS', async () => {
const found = await findEvidence('/subpath/index.html'); const found = await findEvidence('/index.html');
expect(found).to.equal(true, 'Did not find shared CSS module code'); expect(found).to.equal(true, 'Did not find shared CSS module code');
}); });
}); });
describe('Hoisted scripts', () => { describe('Hoisted scripts', () => {
it('Get bundled together on the page', async () => { it('Get bundled together on the page', async () => {
const html = await fixture.readFile('/subpath/hoisted/index.html'); const html = await fixture.readFile('/hoisted/index.html');
const $ = cheerio.load(html); const $ = cheerio.load(html);
expect($('script[type="module"]').length).to.equal(1, 'hoisted script added'); expect($('script[type="module"]').length).to.equal(1, 'hoisted script added');
}); });
it('Do not get added to the wrong page', async () => { it('Do not get added to the wrong page', async () => {
const hoistedHTML = await fixture.readFile('/subpath/hoisted/index.html'); const hoistedHTML = await fixture.readFile('/hoisted/index.html');
const $ = cheerio.load(hoistedHTML); const $ = cheerio.load(hoistedHTML);
const href = $('script[type="module"]').attr('src'); const href = $('script[type="module"]').attr('src');
const indexHTML = await fixture.readFile('/subpath/index.html'); const indexHTML = await fixture.readFile('/index.html');
const $$ = cheerio.load(indexHTML); const $$ = cheerio.load(indexHTML);
expect($$(`script[src="${href}"]`).length).to.equal(0, 'no script added to different page'); expect($$(`script[src="${href}"]`).length).to.equal(0, 'no script added to different page');
}); });
}); });
it('honors ssr config', async () => { it('honors ssr config', async () => {
const html = await fixture.readFile('/subpath/index.html'); const html = await fixture.readFile('/index.html');
const $ = cheerio.load(html); const $ = cheerio.load(html);
expect($('#ssr-config').text()).to.equal('testing'); expect($('#ssr-config').text()).to.equal('testing');
}); });