Skip to content

Commit 12602a9

Browse files
riderxriderx
authored
fix: stop CSS traversal at page boundaries (#16116)
1 parent ade6f51 commit 12602a9

13 files changed

Lines changed: 140 additions & 2 deletions

File tree

‎.changeset/lucky-kiwis-swim.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'astro': patch
3+
---
4+
5+
Fixes a bug where page-level CSS could leak between unrelated pages when traversing style parents across top-level route boundaries

‎packages/astro/src/core/build/plugins/plugin-css.ts‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,12 @@ interface PluginOptions {
3030
buildOptions: StaticBuildOptions;
3131
}
3232

33+
function isBuildCssBoundary(id: string, ctx: { getModuleInfo: GetModuleInfo }): boolean {
34+
if (isPropagatedAssetBoundary(id)) return true;
35+
const info = ctx.getModuleInfo(id);
36+
return info ? moduleIsTopLevelPage(info) : false;
37+
}
38+
3339
function rollupPluginAstroBuildCSS(options: PluginOptions): VitePlugin[] {
3440
const { internals, buildOptions } = options;
3541
const { settings } = buildOptions;
@@ -158,7 +164,7 @@ function rollupPluginAstroBuildCSS(options: PluginOptions): VitePlugin[] {
158164
const parentModuleInfos = getParentExtendedModuleInfos(
159165
scopedToModule,
160166
this,
161-
isPropagatedAssetBoundary,
167+
(moduleId) => isBuildCssBoundary(moduleId, this),
162168
);
163169
for (const { info: pageInfo, depth, order } of parentModuleInfos) {
164170
if (moduleIsTopLevelPage(pageInfo)) {
@@ -230,7 +236,7 @@ function rollupPluginAstroBuildCSS(options: PluginOptions): VitePlugin[] {
230236
const parentModuleInfos = getParentExtendedModuleInfos(
231237
id,
232238
this,
233-
isPropagatedAssetBoundary,
239+
(importer) => isBuildCssBoundary(importer, this),
234240
);
235241
for (const { info: pageInfo, depth, order } of parentModuleInfos) {
236242
if (isPropagatedAssetBoundary(pageInfo.id)) {

‎packages/astro/test/fixtures/i18n-css-leak-basic/astro.config.mjs‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import { defineConfig } from 'astro/config';
2+
3+
export default defineConfig({
4+
build: {
5+
inlineStylesheets: 'never',
6+
},
7+
i18n: {
8+
locales: ['en'],
9+
defaultLocale: 'en',
10+
routing: {
11+
redirectToDefaultLocale: false,
12+
},
13+
},
14+
});

‎packages/astro/test/fixtures/i18n-css-leak-basic/package.json‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"name": "@test/i18n-css-leak-basic",
3+
"version": "0.0.0",
4+
"private": true,
5+
"dependencies": {
6+
"astro": "workspace:*"
7+
}
8+
}

‎packages/astro/test/fixtures/i18n-css-leak-basic/src/components/Header.astro‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
---
2+
import { getRelativeLocaleUrl } from 'astro:i18n';
3+
4+
const docsHref = getRelativeLocaleUrl('en', 'docs');
5+
---
6+
7+
<header>
8+
<a href={docsHref}>Docs</a>
9+
</header>

‎packages/astro/test/fixtures/i18n-css-leak-basic/src/layouts/DocsLayout.astro‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
---
2+
import '../styles/docs.css';
3+
---
4+
5+
<html>
6+
<head>
7+
<title>Docs</title>
8+
</head>
9+
<body>
10+
<slot />
11+
</body>
12+
</html>

‎packages/astro/test/fixtures/i18n-css-leak-basic/src/layouts/SiteLayout.astro‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
---
2+
import Header from '../components/Header.astro';
3+
import '../styles/site.css';
4+
---
5+
6+
<html>
7+
<head>
8+
<title>Site</title>
9+
</head>
10+
<body>
11+
<Header />
12+
<slot />
13+
</body>
14+
</html>

‎packages/astro/test/fixtures/i18n-css-leak-basic/src/pages/docs/index.astro‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
import DocsLayout from '../../layouts/DocsLayout.astro';
3+
---
4+
5+
<DocsLayout>
6+
<h1 id="docs-heading">Docs</h1>
7+
</DocsLayout>

‎packages/astro/test/fixtures/i18n-css-leak-basic/src/pages/index.astro‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
import SiteLayout from '../layouts/SiteLayout.astro';
3+
---
4+
5+
<SiteLayout>
6+
<h1 id="site-heading">Home</h1>
7+
</SiteLayout>

‎packages/astro/test/fixtures/i18n-css-leak-basic/src/styles/docs.css‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
body {
2+
background: black;
3+
}
4+
5+
h1 {
6+
color: red;
7+
}

0 commit comments

Comments
 (0)