From b5ef1c2113693523f10479d472e855ab9c41395d Mon Sep 17 00:00:00 2001
From: Ben Holmes <hey@bholmes.dev>
Date: Tue, 9 Aug 2022 18:18:34 -0500
Subject: [PATCH] [MD] Add `rawContent` and `compiledContent` to MD layout
 props (#4222)

* fix: add subs for astro.source and astro.html

* fix: define "source" property

* test: raw and compiled content from layout

* chore: changeset

Co-authored-by: bholmesdev <bholmesdev@gmail.com>
---
 .changeset/warm-socks-exercise.md             |  5 +++++
 .../astro/src/vite-plugin-markdown/index.ts   | 20 ++++++++++++++++-
 packages/astro/test/astro-markdown.test.js    | 22 +++++++++++++++++++
 .../astro-markdown/src/layouts/Base.astro     |  4 ++++
 4 files changed, 50 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/warm-socks-exercise.md

diff --git a/.changeset/warm-socks-exercise.md b/.changeset/warm-socks-exercise.md
new file mode 100644
index 000000000000..f776943130c9
--- /dev/null
+++ b/.changeset/warm-socks-exercise.md
@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Add rawContent and compiledContent to MD layout props
diff --git a/packages/astro/src/vite-plugin-markdown/index.ts b/packages/astro/src/vite-plugin-markdown/index.ts
index 3279e573c1fd..d025d669da76 100644
--- a/packages/astro/src/vite-plugin-markdown/index.ts
+++ b/packages/astro/src/vite-plugin-markdown/index.ts
@@ -92,10 +92,28 @@ export default function markdown({ config, logging }: AstroPluginOptions): Plugi
 							throw new Error('The "astro" property is no longer supported! To access "headings" from your layout, try using "Astro.props.headings."')
 						}
 					});
+					Object.defineProperty(content.astro, 'html', {
+						get() {
+							throw new Error('The "astro" property is no longer supported! To access "html" from your layout, try using "Astro.props.compiledContent()."')
+						}
+					});
+					Object.defineProperty(content.astro, 'source', {
+						get() {
+							throw new Error('The "astro" property is no longer supported! To access "source" from your layout, try using "Astro.props.rawContent()."')
+						}
+					});
 					const contentFragment = h(Fragment, { 'set:html': html });
 					return ${
 						layout
-							? `h(Layout, { content, frontmatter: content, headings: getHeadings(), 'server:root': true, children: contentFragment })`
+							? `h(Layout, {
+									content,
+									frontmatter: content,
+									headings: getHeadings(),
+									rawContent,
+									compiledContent,
+									'server:root': true,
+									children: contentFragment
+								})`
 							: `contentFragment`
 					};
 				}
diff --git a/packages/astro/test/astro-markdown.test.js b/packages/astro/test/astro-markdown.test.js
index cf0e7a0ac665..c326bb5486fd 100644
--- a/packages/astro/test/astro-markdown.test.js
+++ b/packages/astro/test/astro-markdown.test.js
@@ -89,6 +89,28 @@ describe('Astro Markdown', () => {
 		expect(headingSlugs).to.contain('section-2');
 	});
 
+	it('Passes compiled content to layout via "compiledContent" prop', async () => {
+		const html = await fixture.readFile('/with-layout/index.html');
+		const $ = cheerio.load(html);
+
+		const compiledContent = $('[data-compiled-content]');
+
+		expect(fixLineEndings(compiledContent.text()).trim()).to.equal(
+			`<h2 id="section-1">Section 1</h2>\n<h2 id="section-2">Section 2</h2>`
+		);
+	});
+
+	it('Passes raw content to layout via "rawContent" prop', async () => {
+		const html = await fixture.readFile('/with-layout/index.html');
+		const $ = cheerio.load(html);
+
+		const rawContent = $('[data-raw-content]');
+
+		expect(fixLineEndings(rawContent.text()).trim()).to.equal(
+			`## Section 1\n\n## Section 2`
+		);
+	});
+
 	it('Exposes getHeadings() on glob imports', async () => {
 		const { headings } = JSON.parse(await fixture.readFile('/headings-glob.json'));
 
diff --git a/packages/astro/test/fixtures/astro-markdown/src/layouts/Base.astro b/packages/astro/test/fixtures/astro-markdown/src/layouts/Base.astro
index e4fa7560acf9..64817bad9ecc 100644
--- a/packages/astro/test/fixtures/astro-markdown/src/layouts/Base.astro
+++ b/packages/astro/test/fixtures/astro-markdown/src/layouts/Base.astro
@@ -3,6 +3,8 @@ const {
 	content = { title: "content didn't work" },
 	frontmatter = { title: "frontmatter didn't work" },
 	headings = [],
+	compiledContent = () => '',
+	rawContent = () => '',
 } = Astro.props;
 ---
 
@@ -18,6 +20,8 @@ const {
 <body>
 	<p data-content-title>{content.title}</p>
 	<p data-frontmatter-title>{frontmatter.title}</p>
+	<p data-compiled-content>{compiledContent()}</p>
+	<p data-raw-content>{rawContent()}</p>
 	<p data-layout-rendered>Layout rendered!</p>
 	<ul data-headings>
 		{headings.map(heading => <li>{heading.slug}</li>)}