diff options
| -rw-r--r-- | packages/astro/src/core/build/internal.ts | 26 | ||||
| -rw-r--r-- | packages/astro/src/core/build/vite-plugin-css.ts | 11 | ||||
| -rw-r--r-- | packages/astro/test/css-order.test.js | 24 | ||||
| -rw-r--r-- | packages/integrations/mdx/test/mdx-page.test.js | 2 |
4 files changed, 33 insertions, 30 deletions
diff --git a/packages/astro/src/core/build/internal.ts b/packages/astro/src/core/build/internal.ts index d7db27069..e8704a282 100644 --- a/packages/astro/src/core/build/internal.ts +++ b/packages/astro/src/core/build/internal.ts @@ -189,16 +189,18 @@ export function* eachPageData(internals: BuildInternals) { * and page-level CSS on bottom. */ export function sortedCSS(pageData: PageBuildData) { - return Array.from(pageData.css).sort((a, b) => { - let depthA = a[1].depth, - depthB = b[1].depth; - - if(depthA === -1) { - return -1; - } else if(depthB === -1) { - return 1; - } else { - return depthA > depthB ? -1 : 1; - } - }).map(([id]) => id); + return Array.from(pageData.css) + .sort((a, b) => { + let depthA = a[1].depth, + depthB = b[1].depth; + + if (depthA === -1) { + return -1; + } else if (depthB === -1) { + return 1; + } else { + return depthA > depthB ? -1 : 1; + } + }) + .map(([id]) => id); } diff --git a/packages/astro/src/core/build/vite-plugin-css.ts b/packages/astro/src/core/build/vite-plugin-css.ts index 1788d9ee8..cd729575d 100644 --- a/packages/astro/src/core/build/vite-plugin-css.ts +++ b/packages/astro/src/core/build/vite-plugin-css.ts @@ -43,7 +43,10 @@ export function rollupPluginAstroBuildCSS(options: PluginOptions): VitePlugin[] function createNameForParentPages(id: string, ctx: { getModuleInfo: GetModuleInfo }): string { const parents = Array.from(getTopLevelPages(id, ctx)); - const proposedName = parents.map(([page]) => nameifyPage(page.id)).sort().join('-'); + const proposedName = parents + .map(([page]) => nameifyPage(page.id)) + .sort() + .join('-'); // We don't want absurdedly long chunk names, so if this is too long create a hashed version instead. if (proposedName.length <= MAX_NAME_LENGTH) { @@ -134,15 +137,15 @@ export function rollupPluginAstroBuildCSS(options: PluginOptions): VitePlugin[] for (const importedCssImport of meta.importedCss) { // CSS is prioritized based on depth. Shared CSS has a higher depth due to being imported by multiple pages. // Depth info is used when sorting the links on the page. - if(pageData?.css.has(importedCssImport)) { + if (pageData?.css.has(importedCssImport)) { // eslint-disable-next-line const cssInfo = pageData?.css.get(importedCssImport)!; - if(depth < cssInfo.depth) { + if (depth < cssInfo.depth) { cssInfo.depth = depth; } } else { pageData?.css.set(importedCssImport, { depth }); - } + } } } } diff --git a/packages/astro/test/css-order.test.js b/packages/astro/test/css-order.test.js index 402e6b619..02db6b449 100644 --- a/packages/astro/test/css-order.test.js +++ b/packages/astro/test/css-order.test.js @@ -14,9 +14,9 @@ describe('CSS production ordering', () => { } /** - * - * @param {import('./test-utils').Fixture} fixture - * @param {string} href + * + * @param {import('./test-utils').Fixture} fixture + * @param {string} href * @returns {Promise<{ href: string; css: string; }>} */ async function getLinkContent(fixture, href) { @@ -27,22 +27,20 @@ describe('CSS production ordering', () => { describe('SSG and SSR parity', () => { let staticHTML, serverHTML; let staticCSS, serverCSS; - + const commonConfig = Object.freeze({ root: './fixtures/css-order/', }); - - before(async () => { let fixture = await loadFixture({ ...commonConfig }); await fixture.build(); staticHTML = await fixture.readFile('/one/index.html'); staticCSS = await Promise.all( - getLinks(staticHTML).map(href => getLinkContent(fixture, href)) + getLinks(staticHTML).map((href) => getLinkContent(fixture, href)) ); }); - + before(async () => { let fixture = await loadFixture({ ...commonConfig, @@ -50,7 +48,7 @@ describe('CSS production ordering', () => { output: 'server', }); await fixture.build(); - + const app = await fixture.loadTestAdapterApp(); const request = new Request('http://example.com/one'); const response = await app.render(request); @@ -62,11 +60,11 @@ describe('CSS production ordering', () => { }) ); }); - + it('is in the same order for output: server and static', async () => { const staticContent = staticCSS.map((o) => o.css); const serverContent = serverCSS.map((o) => o.css); - + expect(staticContent).to.deep.equal(serverContent); }); }); @@ -85,11 +83,11 @@ describe('CSS production ordering', () => { let html = await fixture.readFile('/two/index.html'); const content = await Promise.all( - getLinks(html).map(href => getLinkContent(fixture, href)) + getLinks(html).map((href) => getLinkContent(fixture, href)) ); expect(content).to.have.a.lengthOf(2, 'there are 2 stylesheets'); - const [,last] = content; + const [, last] = content; expect(last.css).to.match(/#00f/); }); diff --git a/packages/integrations/mdx/test/mdx-page.test.js b/packages/integrations/mdx/test/mdx-page.test.js index 4c3605651..726f091c9 100644 --- a/packages/integrations/mdx/test/mdx-page.test.js +++ b/packages/integrations/mdx/test/mdx-page.test.js @@ -34,7 +34,7 @@ describe('MDX Page', () => { const stylesheet = document.querySelector('link[rel="stylesheet"]'); expect(stylesheet).to.not.be.null; - }) + }); }); describe('dev', () => { |