Infrastructure/astro
0
Fork 0
mirror of https://github.com/withastro/astro.git synced 2024-12-16 21:46:22 -05:00
Code Issues Activity

Fix inline stylesheets in content collection cache (#10543)

Browse source 
* Fix inline stylesheets in content collection cache

* Refactor for better reusability

* Update .changeset/tricky-cobras-mate.md

Co-authored-by: Florian Lefebvre <contact@florian-lefebvre.dev>

---------

Co-authored-by: Florian Lefebvre <contact@florian-lefebvre.dev>
This commit is contained in:
Matthew Phillips 2024-03-28 10:31:41 -04:00 committed by GitHub
parent fbdc10f90f
commit 0fd36bdb38
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 25 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
.changeset/tricky-cobras-mate.md Normal file
View file

@ -0,0 +1,5 @@
---
"astro": patch
---
Fixes inline stylesheets with content collections cache

2
packages/astro/src/content/index.ts
View file

@ -2,7 +2,7 @@ export { CONTENT_FLAG, PROPAGATED_ASSET_FLAG } from './consts.js';
export { errorMap } from './error-map.js';
export { attachContentServerListeners } from './server-listeners.js';
export { createContentTypesGenerator } from './types-generator.js';
export { contentObservable, getContentPaths, getDotAstroTypeReference } from './utils.js';
export { contentObservable, getContentPaths, getDotAstroTypeReference, hasAssetPropagationFlag } from './utils.js';
export { astroContentAssetPropagationPlugin } from './vite-plugin-content-assets.js';
export { astroContentImportPlugin } from './vite-plugin-content-imports.js';
export { astroContentVirtualModPlugin } from './vite-plugin-content-virtual-mod.js';

10
packages/astro/src/content/utils.ts
View file

@ -16,7 +16,7 @@ import { AstroError, AstroErrorData } from '../core/errors/index.js';
import { MarkdownError } from '../core/errors/index.js';
import { isYAMLException } from '../core/errors/utils.js';
import { CONTENT_FLAGS, CONTENT_TYPES_FILE } from './consts.js';
import { CONTENT_FLAGS, CONTENT_TYPES_FILE, PROPAGATED_ASSET_FLAG } from './consts.js';
import { errorMap } from './error-map.js';
import { createImage } from './runtime-assets.js';
@ -505,3 +505,11 @@ export function getExtGlob(exts: string[]) {
exts[0]
: `{${exts.join(',')}}`;
}
export function hasAssetPropagationFlag(id: string): boolean {
try {
return new URL(id, 'file://').searchParams.has(PROPAGATED_ASSET_FLAG)
} catch {
return false;
}
}

26
packages/astro/src/core/build/plugins/plugin-css.ts
View file

@ -5,7 +5,7 @@ import type { BuildInternals } from '../internal.js';
import type { AstroBuildPlugin, BuildTarget } from '../plugin.js';
import type { PageBuildData, StaticBuildOptions, StylesheetAsset } from '../types.js';
import { PROPAGATED_ASSET_FLAG } from '../../../content/consts.js';
import { RESOLVED_VIRTUAL_MODULE_ID as ASTRO_CONTENT_VIRTUAL_MODULE_ID } from '../../../content/consts.js';
import type { AstroPluginCssMetadata } from '../../../vite-plugin-astro/index.js';
import * as assetName from '../css-asset-name.js';
import {
@ -21,6 +21,7 @@ import {
isHoistedScript,
} from '../internal.js';
import { extendManualChunks, shouldInlineAsset } from './util.js';
import { hasAssetPropagationFlag } from '../../../content/index.js';
interface PluginOptions {
internals: BuildInternals;
@ -96,18 +97,11 @@ function rollupPluginAstroBuildCSS(options: PluginOptions): VitePlugin[] {
const ctx = { getModuleInfo: meta.getModuleInfo };
for (const pageInfo of getParentModuleInfos(id, ctx)) {
if (new URL(pageInfo.id, 'file://').searchParams.has(PROPAGATED_ASSET_FLAG)) {
if (hasAssetPropagationFlag(pageInfo.id)) {
// Split delayed assets to separate modules
// so they can be injected where needed
const chunkId = assetName.createNameHash(id, [id]);
internals.cssModuleToChunkIdMap.set(id, chunkId);
if (isContentCollectionCache) {
// TODO: Handle inlining?
const propagatedStyles =
internals.propagatedStylesMap.get(pageInfo.id) ?? new Set();
propagatedStyles.add({ type: 'external', src: chunkId });
internals.propagatedStylesMap.set(pageInfo.id, propagatedStyles);
}
return chunkId;
}
}
@ -144,15 +138,11 @@ function rollupPluginAstroBuildCSS(options: PluginOptions): VitePlugin[] {
// For this CSS chunk, walk parents until you find a page. Add the CSS to that page.
for (const id of Object.keys(chunk.modules)) {
for (const { info: pageInfo, depth, order } of getParentExtendedModuleInfos(
id,
this,
function until(importer) {
return new URL(importer, 'file://').searchParams.has(PROPAGATED_ASSET_FLAG);
}
)) {
if (new URL(pageInfo.id, 'file://').searchParams.has(PROPAGATED_ASSET_FLAG)) {
for (const parentInfo of getParentModuleInfos(id, this)) {
const parentModuleInfos = getParentExtendedModuleInfos(id, this, hasAssetPropagationFlag);
for (const { info: pageInfo, depth, order } of parentModuleInfos) {
if (hasAssetPropagationFlag(pageInfo.id)) {
const walkId = isContentCollectionCache ? ASTRO_CONTENT_VIRTUAL_MODULE_ID : id;
for (const parentInfo of getParentModuleInfos(walkId, this)) {
if (moduleIsTopLevelPage(parentInfo) === false) continue;
const pageViteID = parentInfo.id;

4
packages/astro/test/experimental-content-collections-css-inline-stylesheets.test.js
View file

@ -92,7 +92,7 @@ describe('Experimental Content Collections cache - inlineStylesheets to never in
});
});
describe.skip('Experimental Content Collections cache - inlineStylesheets to auto in static output', () => {
describe('Experimental Content Collections cache - inlineStylesheets to auto in static output', () => {
let fixture;
before(async () => {
@ -120,7 +120,7 @@ describe.skip('Experimental Content Collections cache - inlineStylesheets to aut
after(async () => await fixture.clean());
it.skip(
it(
'Renders some <style> and some <link> tags',
{ todo: 'Styles have the wrong length' },
async () => {