[ci] format
This commit is contained in:
parent
27ac6a03a1
commit
77f9afa44a
4 changed files with 32 additions and 29 deletions
|
@ -189,16 +189,18 @@ export function* eachPageData(internals: BuildInternals) {
|
||||||
* and page-level CSS on bottom.
|
* and page-level CSS on bottom.
|
||||||
*/
|
*/
|
||||||
export function sortedCSS(pageData: PageBuildData) {
|
export function sortedCSS(pageData: PageBuildData) {
|
||||||
return Array.from(pageData.css).sort((a, b) => {
|
return Array.from(pageData.css)
|
||||||
let depthA = a[1].depth,
|
.sort((a, b) => {
|
||||||
depthB = b[1].depth;
|
let depthA = a[1].depth,
|
||||||
|
depthB = b[1].depth;
|
||||||
|
|
||||||
if(depthA === -1) {
|
if (depthA === -1) {
|
||||||
return -1;
|
return -1;
|
||||||
} else if(depthB === -1) {
|
} else if (depthB === -1) {
|
||||||
return 1;
|
return 1;
|
||||||
} else {
|
} else {
|
||||||
return depthA > depthB ? -1 : 1;
|
return depthA > depthB ? -1 : 1;
|
||||||
}
|
}
|
||||||
}).map(([id]) => id);
|
})
|
||||||
|
.map(([id]) => id);
|
||||||
}
|
}
|
||||||
|
|
|
@ -43,7 +43,10 @@ export function rollupPluginAstroBuildCSS(options: PluginOptions): VitePlugin[]
|
||||||
|
|
||||||
function createNameForParentPages(id: string, ctx: { getModuleInfo: GetModuleInfo }): string {
|
function createNameForParentPages(id: string, ctx: { getModuleInfo: GetModuleInfo }): string {
|
||||||
const parents = Array.from(getTopLevelPages(id, ctx));
|
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.
|
// 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) {
|
if (proposedName.length <= MAX_NAME_LENGTH) {
|
||||||
|
@ -134,15 +137,15 @@ export function rollupPluginAstroBuildCSS(options: PluginOptions): VitePlugin[]
|
||||||
for (const importedCssImport of meta.importedCss) {
|
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.
|
// 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.
|
// 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
|
// eslint-disable-next-line
|
||||||
const cssInfo = pageData?.css.get(importedCssImport)!;
|
const cssInfo = pageData?.css.get(importedCssImport)!;
|
||||||
if(depth < cssInfo.depth) {
|
if (depth < cssInfo.depth) {
|
||||||
cssInfo.depth = depth;
|
cssInfo.depth = depth;
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
pageData?.css.set(importedCssImport, { depth });
|
pageData?.css.set(importedCssImport, { depth });
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -14,9 +14,9 @@ describe('CSS production ordering', () => {
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
*
|
*
|
||||||
* @param {import('./test-utils').Fixture} fixture
|
* @param {import('./test-utils').Fixture} fixture
|
||||||
* @param {string} href
|
* @param {string} href
|
||||||
* @returns {Promise<{ href: string; css: string; }>}
|
* @returns {Promise<{ href: string; css: string; }>}
|
||||||
*/
|
*/
|
||||||
async function getLinkContent(fixture, href) {
|
async function getLinkContent(fixture, href) {
|
||||||
|
@ -27,22 +27,20 @@ describe('CSS production ordering', () => {
|
||||||
describe('SSG and SSR parity', () => {
|
describe('SSG and SSR parity', () => {
|
||||||
let staticHTML, serverHTML;
|
let staticHTML, serverHTML;
|
||||||
let staticCSS, serverCSS;
|
let staticCSS, serverCSS;
|
||||||
|
|
||||||
const commonConfig = Object.freeze({
|
const commonConfig = Object.freeze({
|
||||||
root: './fixtures/css-order/',
|
root: './fixtures/css-order/',
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
before(async () => {
|
before(async () => {
|
||||||
let fixture = await loadFixture({ ...commonConfig });
|
let fixture = await loadFixture({ ...commonConfig });
|
||||||
await fixture.build();
|
await fixture.build();
|
||||||
staticHTML = await fixture.readFile('/one/index.html');
|
staticHTML = await fixture.readFile('/one/index.html');
|
||||||
staticCSS = await Promise.all(
|
staticCSS = await Promise.all(
|
||||||
getLinks(staticHTML).map(href => getLinkContent(fixture, href))
|
getLinks(staticHTML).map((href) => getLinkContent(fixture, href))
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
before(async () => {
|
before(async () => {
|
||||||
let fixture = await loadFixture({
|
let fixture = await loadFixture({
|
||||||
...commonConfig,
|
...commonConfig,
|
||||||
|
@ -50,7 +48,7 @@ describe('CSS production ordering', () => {
|
||||||
output: 'server',
|
output: 'server',
|
||||||
});
|
});
|
||||||
await fixture.build();
|
await fixture.build();
|
||||||
|
|
||||||
const app = await fixture.loadTestAdapterApp();
|
const app = await fixture.loadTestAdapterApp();
|
||||||
const request = new Request('http://example.com/one');
|
const request = new Request('http://example.com/one');
|
||||||
const response = await app.render(request);
|
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 () => {
|
it('is in the same order for output: server and static', async () => {
|
||||||
const staticContent = staticCSS.map((o) => o.css);
|
const staticContent = staticCSS.map((o) => o.css);
|
||||||
const serverContent = serverCSS.map((o) => o.css);
|
const serverContent = serverCSS.map((o) => o.css);
|
||||||
|
|
||||||
expect(staticContent).to.deep.equal(serverContent);
|
expect(staticContent).to.deep.equal(serverContent);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
@ -85,11 +83,11 @@ describe('CSS production ordering', () => {
|
||||||
let html = await fixture.readFile('/two/index.html');
|
let html = await fixture.readFile('/two/index.html');
|
||||||
|
|
||||||
const content = await Promise.all(
|
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');
|
expect(content).to.have.a.lengthOf(2, 'there are 2 stylesheets');
|
||||||
const [,last] = content;
|
const [, last] = content;
|
||||||
|
|
||||||
expect(last.css).to.match(/#00f/);
|
expect(last.css).to.match(/#00f/);
|
||||||
});
|
});
|
||||||
|
|
|
@ -34,7 +34,7 @@ describe('MDX Page', () => {
|
||||||
const stylesheet = document.querySelector('link[rel="stylesheet"]');
|
const stylesheet = document.querySelector('link[rel="stylesheet"]');
|
||||||
|
|
||||||
expect(stylesheet).to.not.be.null;
|
expect(stylesheet).to.not.be.null;
|
||||||
})
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('dev', () => {
|
describe('dev', () => {
|
||||||
|
|
Loading…
Add table
Reference in a new issue