diff --git a/.changeset/great-insects-beam.md b/.changeset/great-insects-beam.md
new file mode 100644
index 000000000000..4e0e889f06c6
--- /dev/null
+++ b/.changeset/great-insects-beam.md
@@ -0,0 +1,5 @@
+---
+'@astrojs/mdx': patch
+---
+
+Add support for injected "page-ssr" scripts
diff --git a/packages/astro/test/fixtures/tailwindcss/astro.config.mjs b/packages/astro/test/fixtures/tailwindcss/astro.config.mjs
index 34c98eaf8d12..31f537fd004b 100644
--- a/packages/astro/test/fixtures/tailwindcss/astro.config.mjs
+++ b/packages/astro/test/fixtures/tailwindcss/astro.config.mjs
@@ -1,12 +1,13 @@
import { defineConfig } from 'astro/config';
import tailwind from '@astrojs/tailwind';
+import mdx from '@astrojs/mdx';
// https://astro.build/config
export default defineConfig({
legacy: {
astroFlavoredMarkdown: true,
},
- integrations: [tailwind()],
+ integrations: [tailwind(), mdx()],
vite: {
build: {
assetsInlineLimit: 0,
diff --git a/packages/astro/test/fixtures/tailwindcss/package.json b/packages/astro/test/fixtures/tailwindcss/package.json
index dcf52d91b878..00646e0fdd1a 100644
--- a/packages/astro/test/fixtures/tailwindcss/package.json
+++ b/packages/astro/test/fixtures/tailwindcss/package.json
@@ -4,6 +4,7 @@
"private": true,
"dependencies": {
"@astrojs/tailwind": "workspace:*",
+ "@astrojs/mdx": "workspace:*",
"astro": "workspace:*",
"autoprefixer": "^10.4.7",
"postcss": "^8.4.14",
diff --git a/packages/astro/test/fixtures/tailwindcss/src/pages/mdx-page.mdx b/packages/astro/test/fixtures/tailwindcss/src/pages/mdx-page.mdx
new file mode 100644
index 000000000000..a59f7f745a7b
--- /dev/null
+++ b/packages/astro/test/fixtures/tailwindcss/src/pages/mdx-page.mdx
@@ -0,0 +1,7 @@
+import Button from '../components/Button.astro';
+import Complex from '../components/Complex.astro';
+
+
+
+
+
\ No newline at end of file
diff --git a/packages/astro/test/tailwindcss.test.js b/packages/astro/test/tailwindcss.test.js
index 7a59aebe5762..83061248f84c 100644
--- a/packages/astro/test/tailwindcss.test.js
+++ b/packages/astro/test/tailwindcss.test.js
@@ -65,5 +65,13 @@ describe('Tailwind', () => {
const mdBundledCSS = await fixture.readFile(bundledCSSHREF.replace(/^\/?/, '/'));
expect(mdBundledCSS, 'includes used component classes').to.match(/\.bg-purple-600{/);
});
+
+ it('handles MDX pages (with integration)', async () => {
+ const html = await fixture.readFile('/mdx-page/index.html');
+ const $md = cheerio.load(html);
+ const bundledCSSHREF = $md('link[rel=stylesheet][href^=/assets/]').attr('href');
+ const mdBundledCSS = await fixture.readFile(bundledCSSHREF.replace(/^\/?/, '/'));
+ expect(mdBundledCSS, 'includes used component classes').to.match(/\.bg-purple-600{/);
+ });
});
});
diff --git a/packages/integrations/mdx/src/index.ts b/packages/integrations/mdx/src/index.ts
index b33b098862ad..da10281a7c2e 100644
--- a/packages/integrations/mdx/src/index.ts
+++ b/packages/integrations/mdx/src/index.ts
@@ -89,6 +89,13 @@ export default function mdx(mdxOptions: MdxOptions = {}): AstroIntegration {
if (!id.endsWith('.mdx')) return;
const [, moduleExports] = parseESM(code);
+ // This adds support for injected "page-ssr" scripts in MDX files.
+ // TODO: This should only be happening on page entrypoints, not all imported MDX.
+ // TODO: This code is copy-pasted across all Astro/Vite plugins that deal with page
+ // entrypoints (.astro, .md, .mdx). This should be handled in some centralized place,
+ // or otherwise refactored to not require copy-paste handling logic.
+ code += `\nimport "${'astro:scripts/page-ssr.js'}";`;
+
if (!moduleExports.includes('url')) {
const { fileUrl } = getFileInfo(id, config);
code += `\nexport const url = ${JSON.stringify(fileUrl)};`;
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 9ced36a11c90..6d31b7da2dc7 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1929,12 +1929,14 @@ importers:
packages/astro/test/fixtures/tailwindcss:
specifiers:
+ '@astrojs/mdx': workspace:*
'@astrojs/tailwind': workspace:*
astro: workspace:*
autoprefixer: ^10.4.7
postcss: ^8.4.14
tailwindcss: ^3.0.24
dependencies:
+ '@astrojs/mdx': link:../../../../integrations/mdx
'@astrojs/tailwind': link:../../../../integrations/tailwind
astro: link:../../..
autoprefixer: 10.4.7_postcss@8.4.14