From 7eea37a075c6abb1de715de76d1911ff41e8ab13 Mon Sep 17 00:00:00 2001 From: Matthew Phillips Date: Fri, 8 Sep 2023 22:00:07 +0800 Subject: [PATCH] Fix multi-layout head injection (#8449) * Fix multi-layout head injection * Tracing fix * Improved walk * Upgrade the compiler version --------- Co-authored-by: Nate Moore --- .changeset/orange-cheetahs-happen.md | 5 ++++ packages/astro/package.json | 2 +- packages/astro/src/vite-plugin-astro/index.ts | 2 +- packages/astro/src/vite-plugin-head/index.ts | 28 ++++++++++++++++--- .../test/units/dev/head-injection.test.js | 25 ++++++++++++----- pnpm-lock.yaml | 8 +++--- 6 files changed, 53 insertions(+), 17 deletions(-) create mode 100644 .changeset/orange-cheetahs-happen.md diff --git a/.changeset/orange-cheetahs-happen.md b/.changeset/orange-cheetahs-happen.md new file mode 100644 index 000000000..2a0ff291b --- /dev/null +++ b/.changeset/orange-cheetahs-happen.md @@ -0,0 +1,5 @@ +--- +'astro': patch +--- + +Fix multi-layout head injection diff --git a/packages/astro/package.json b/packages/astro/package.json index b50874d24..6eb2e6643 100644 --- a/packages/astro/package.json +++ b/packages/astro/package.json @@ -119,7 +119,7 @@ "test:e2e:match": "playwright test -g" }, "dependencies": { - "@astrojs/compiler": "^2.0.1", + "@astrojs/compiler": "^2.1.0", "@astrojs/internal-helpers": "workspace:*", "@astrojs/markdown-remark": "workspace:*", "@astrojs/telemetry": "workspace:*", diff --git a/packages/astro/src/vite-plugin-astro/index.ts b/packages/astro/src/vite-plugin-astro/index.ts index 371ae9657..abeade65e 100644 --- a/packages/astro/src/vite-plugin-astro/index.ts +++ b/packages/astro/src/vite-plugin-astro/index.ts @@ -154,7 +154,7 @@ export default function astro({ settings, logger }: AstroPluginOptions): vite.Pl hydratedComponents: transformResult.hydratedComponents, scripts: transformResult.scripts, containsHead: transformResult.containsHead, - propagation: 'none', + propagation: transformResult.propagation ? 'self' : 'none', pageOptions: {}, }; diff --git a/packages/astro/src/vite-plugin-head/index.ts b/packages/astro/src/vite-plugin-head/index.ts index ca95a334e..ae49e7401 100644 --- a/packages/astro/src/vite-plugin-head/index.ts +++ b/packages/astro/src/vite-plugin-head/index.ts @@ -58,6 +58,15 @@ export default function configHeadVitePlugin(): vite.Plugin { propagateMetadata.call(this, id, 'containsHead', true); } + if(info && getAstroMetadata(info)?.propagation === 'self') { + const mod = server.moduleGraph.getModuleById(id); + for (const parent of mod?.importers ?? []) { + if(parent.id) { + propagateMetadata.call(this, parent.id, 'propagation', 'in-tree'); + } + } + } + if (injectExp.test(source)) { propagateMetadata.call(this, id, 'propagation', 'in-tree'); } @@ -91,10 +100,21 @@ export function astroHeadBuildPlugin(internals: BuildInternals): AstroBuildPlugi const modinfo = this.getModuleInfo(id); // tag in the tree - if (modinfo && getAstroMetadata(modinfo)?.containsHead) { - for (const [pageInfo] of getTopLevelPages(id, this)) { - let metadata = getOrCreateMetadata(pageInfo.id); - metadata.containsHead = true; + if(modinfo) { + const meta = getAstroMetadata(modinfo); + if(meta?.containsHead) { + for (const [pageInfo] of getTopLevelPages(id, this)) { + let metadata = getOrCreateMetadata(pageInfo.id); + metadata.containsHead = true; + } + } + if(meta?.propagation === 'self') { + for (const [info] of walkParentInfos(id, this)) { + let metadata = getOrCreateMetadata(info.id); + if(metadata.propagation !== 'self') { + metadata.propagation = 'in-tree'; + } + } } } diff --git a/packages/astro/test/units/dev/head-injection.test.js b/packages/astro/test/units/dev/head-injection.test.js index 566e7ab48..967ad8725 100644 --- a/packages/astro/test/units/dev/head-injection.test.js +++ b/packages/astro/test/units/dev/head-injection.test.js @@ -123,27 +123,38 @@ describe('head injection', () => { }); } `.trim(), + '/src/components/Content.astro': ` + --- + import { renderEntry } from '../common/head.js'; + const ExtraHead = renderEntry(); + --- + + `, + '/src/components/Inner.astro': ` + --- + import Content from './Content.astro'; + --- + + `, '/src/components/Layout.astro': ` - --- - import { renderEntry } from '../common/head.js'; - const ExtraHead = renderEntry(); - --- Normal head stuff - + `, '/src/pages/index.astro': ` --- import Layout from '../components/Layout.astro'; + import Inner from '../components/Inner.astro'; ---

Test page

+ `, }, @@ -168,8 +179,8 @@ describe('head injection', () => { const html = await text(); const $ = cheerio.load(html); - expect($('link[rel=stylesheet][href="/some/fake/styles.css"]')).to.have.a.lengthOf(1); - expect($('#other')).to.have.a.lengthOf(1); + expect($('link[rel=stylesheet][href="/some/fake/styles.css"]')).to.have.a.lengthOf(1, 'found inner link'); + expect($('#other')).to.have.a.lengthOf(1, 'Found the #other div'); } ); }); diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index faf79d758..970dba563 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -483,8 +483,8 @@ importers: packages/astro: dependencies: '@astrojs/compiler': - specifier: ^2.0.1 - version: 2.0.1 + specifier: ^2.1.0 + version: 2.1.0 '@astrojs/internal-helpers': specifier: workspace:* version: link:../internal-helpers @@ -5180,8 +5180,8 @@ packages: resolution: {integrity: sha512-o/ObKgtMzl8SlpIdzaxFnt7SATKPxu4oIP/1NL+HDJRzxfJcAkOTAb/ZKMRyULbz4q+1t2/DAebs2Z1QairkZw==} dev: true - /@astrojs/compiler@2.0.1: - resolution: {integrity: sha512-DfBR7Cf+tOgQ4n7TIgTtU5x5SEA/08DNshpEPcT+91A0KbBlmUOYMBM/O6qAaHkmVo1KIoXQYhAmfdTT1zx9PQ==} + /@astrojs/compiler@2.1.0: + resolution: {integrity: sha512-Mp+qrNhly+27bL/Zq8lGeUY+YrdoU0eDfIlAeGIPrzt0PnI/jGpvPUdCaugv4zbCrDkOUScFfcbeEiYumrdJnw==} dev: false /@astrojs/language-server@2.3.0(prettier-plugin-astro@0.12.0)(prettier@3.0.3)(typescript@5.1.6):