From ca45c0c270f5ca3f7d2fb113a235d415cecdb333 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Juan=20Mart=C3=ADn=20Seery?= <me@juanm04.com>
Date: Wed, 13 Jul 2022 16:31:59 -0300
Subject: [PATCH] fix: don't throw when Shiki doesn't recognize a language
 (#3911)

* Don't throw when Shiki doesn't recognise a language

* Changeset
---
 .changeset/healthy-donuts-dream.md               |  5 +++++
 packages/astro/test/astro-markdown-shiki.test.js |  6 ++++++
 .../langs/src/pages/astro.astro                  |  4 ++++
 .../langs/src/pages/index.md                     |  4 ++++
 packages/markdown/remark/src/remark-shiki.ts     | 16 +++++++++++++++-
 5 files changed, 34 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/healthy-donuts-dream.md

diff --git a/.changeset/healthy-donuts-dream.md b/.changeset/healthy-donuts-dream.md
new file mode 100644
index 000000000..a6b4dd93c
--- /dev/null
+++ b/.changeset/healthy-donuts-dream.md
@@ -0,0 +1,5 @@
+---
+'@astrojs/markdown-remark': patch
+---
+
+Don't throw when Shiki doesn't recognize a language
diff --git a/packages/astro/test/astro-markdown-shiki.test.js b/packages/astro/test/astro-markdown-shiki.test.js
index 7a03fb390..0d6ec6f74 100644
--- a/packages/astro/test/astro-markdown-shiki.test.js
+++ b/packages/astro/test/astro-markdown-shiki.test.js
@@ -119,6 +119,9 @@ describe('Astro Markdown Shiki', () => {
 			expect(segments[0].attribs.style).to.be.equal('color: #C9D1D9');
 			expect(segments[1].attribs.style).to.be.equal('color: #79C0FF');
 			expect(segments[2].attribs.style).to.be.equal('color: #C9D1D9');
+			
+			const unknownLang = $('.line').last().html();
+			expect(unknownLang).to.be.equal('<span style="color: #c9d1d9">This language does not exist</span>')
 		});
 
 		it('<Markdown /> component', async () => {
@@ -129,6 +132,9 @@ describe('Astro Markdown Shiki', () => {
 			expect(segments).to.have.lengthOf(3);
 			expect(segments[0].attribs.style).to.be.equal('color: #C9D1D9');
 			expect(segments[1].attribs.style).to.be.equal('color: #79C0FF');
+
+			const unknownLang = $('.line').last().html();
+			expect(unknownLang).to.be.equal('<span style="color: #c9d1d9">This language does not exist</span>')
 		});
 	});
 
diff --git a/packages/astro/test/fixtures/astro-markdown-shiki/langs/src/pages/astro.astro b/packages/astro/test/fixtures/astro-markdown-shiki/langs/src/pages/astro.astro
index 2dcc8111d..1e4e0dc8a 100644
--- a/packages/astro/test/fixtures/astro-markdown-shiki/langs/src/pages/astro.astro
+++ b/packages/astro/test/fixtures/astro-markdown-shiki/langs/src/pages/astro.astro
@@ -23,5 +23,9 @@ import Layout from '../layouts/content.astro';
 			Iniciar(Rinfo, 1, 1)
 		fin
 		```
+
+		```unknown
+		This language does not exist
+		```
 	</Markdown>
 </Layout>
diff --git a/packages/astro/test/fixtures/astro-markdown-shiki/langs/src/pages/index.md b/packages/astro/test/fixtures/astro-markdown-shiki/langs/src/pages/index.md
index d5b554e05..d2d756b95 100644
--- a/packages/astro/test/fixtures/astro-markdown-shiki/langs/src/pages/index.md
+++ b/packages/astro/test/fixtures/astro-markdown-shiki/langs/src/pages/index.md
@@ -20,3 +20,7 @@ comenzar
   Iniciar(Rinfo, 1, 1)
 fin
 ```
+
+```unknown
+This language does not exist
+```
diff --git a/packages/markdown/remark/src/remark-shiki.ts b/packages/markdown/remark/src/remark-shiki.ts
index 0b51f07ff..fdc00c2f0 100644
--- a/packages/markdown/remark/src/remark-shiki.ts
+++ b/packages/markdown/remark/src/remark-shiki.ts
@@ -30,7 +30,21 @@ const remarkShiki = async (
 
 	return () => (tree: any) => {
 		visit(tree, 'code', (node) => {
-			let html = highlighter!.codeToHtml(node.value, { lang: node.lang ?? 'plaintext' });
+			let lang: string;
+
+			if (typeof node.lang === 'string') {
+				const langExists = highlighter.getLoadedLanguages().includes(node.lang);
+				if (langExists) {
+					lang = node.lang;
+				} else {
+					console.warn(`The language "${node.lang}" doesn't exist, falling back to plaintext.`);
+					lang = 'plaintext';
+				}
+			} else {
+				lang = 'plaintext';
+			}
+
+			let html = highlighter!.codeToHtml(node.value, { lang });
 
 			// Q: Couldn't these regexes match on a user's inputted code blocks?
 			// A: Nope! All rendered HTML is properly escaped.