From 1efaef6be0265c68eac706623778e8ad23b33247 Mon Sep 17 00:00:00 2001
From: Ben Holmes <hey@bholmes.dev>
Date: Wed, 24 May 2023 16:52:22 -0400
Subject: Markdoc - Shiki (#7187)

* chore: remove unused util

* chore: changeset

* deps: shiki

* wip: first stab at shiki markdoc config

* feat: get shiki working!

* refactor: return HTML string directly from transform

* chore: move shiki to markdoc dev dep

* refactor: use async cache with clear docs on why

* test: transform units with Shiki config options

* refactor: switch to `extends` model

* refactor: nodes/ -> extensions/

* feat: raise friendly error for Promise extensions

* docs: README

* chore: lint

* chore: dead file

* chore: lowercase for fuzzy find please

* fix: bad ctx spread

* chore: clean up cache, add shiki imp error

* chore: add shiki to optional peer deps

* chore: hoist those consts

* docs: more explicit "install shiki now please"

Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>

* oops bad find and replace

* chore: update changeset

* nit: period haunts me

---------

Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>
---
 .../markdoc/test/syntax-highlighting.test.js       | 89 ++++++++++++++++++++++
 1 file changed, 89 insertions(+)
 create mode 100644 packages/integrations/markdoc/test/syntax-highlighting.test.js

(limited to 'packages/integrations/markdoc/test/syntax-highlighting.test.js')

diff --git a/packages/integrations/markdoc/test/syntax-highlighting.test.js b/packages/integrations/markdoc/test/syntax-highlighting.test.js
new file mode 100644
index 000000000..ef1845eb9
--- /dev/null
+++ b/packages/integrations/markdoc/test/syntax-highlighting.test.js
@@ -0,0 +1,89 @@
+import { parseHTML } from 'linkedom';
+import { expect } from 'chai';
+import Markdoc from '@markdoc/markdoc';
+import { shiki } from '../dist/config.js';
+import { setupConfig } from '../dist/runtime.js';
+import { isHTMLString } from 'astro/runtime/server/index.js';
+
+const entry = `
+\`\`\`ts
+const highlighting = true;
+\`\`\`
+
+\`\`\`css
+.highlighting {
+	color: red;
+}
+\`\`\`
+`;
+
+describe('Markdoc - syntax highlighting', () => {
+	it('transforms with defaults', async () => {
+		const ast = Markdoc.parse(entry);
+		const content = Markdoc.transform(ast, await getConfigExtendingShiki());
+
+		expect(content.children).to.have.lengthOf(2);
+		for (const codeBlock of content.children) {
+			expect(isHTMLString(codeBlock)).to.be.true;
+
+			const pre = parsePreTag(codeBlock);
+			expect(pre.classList).to.include('astro-code');
+			expect(pre.classList).to.include('github-dark');
+		}
+	});
+	it('transforms with `theme` property', async () => {
+		const ast = Markdoc.parse(entry);
+		const content = Markdoc.transform(
+			ast,
+			await getConfigExtendingShiki({
+				theme: 'dracula',
+			})
+		);
+		expect(content.children).to.have.lengthOf(2);
+		for (const codeBlock of content.children) {
+			expect(isHTMLString(codeBlock)).to.be.true;
+
+			const pre = parsePreTag(codeBlock);
+			expect(pre.classList).to.include('astro-code');
+			expect(pre.classList).to.include('dracula');
+		}
+	});
+	it('transforms with `wrap` property', async () => {
+		const ast = Markdoc.parse(entry);
+		const content = Markdoc.transform(
+			ast,
+			await getConfigExtendingShiki({
+				wrap: true,
+			})
+		);
+		expect(content.children).to.have.lengthOf(2);
+		for (const codeBlock of content.children) {
+			expect(isHTMLString(codeBlock)).to.be.true;
+
+			const pre = parsePreTag(codeBlock);
+			expect(pre.getAttribute('style')).to.include('white-space: pre-wrap');
+			expect(pre.getAttribute('style')).to.include('word-wrap: break-word');
+		}
+	});
+});
+
+/**
+ * @param {import('astro').ShikiConfig} config
+ * @returns {import('../src/config.js').AstroMarkdocConfig}
+ */
+async function getConfigExtendingShiki(config) {
+	return setupConfig({
+		extends: [await shiki(config)],
+	});
+}
+
+/**
+ * @param {string} html
+ * @returns {HTMLPreElement}
+ */
+function parsePreTag(html) {
+	const { document } = parseHTML(html);
+	const pre = document.querySelector('pre');
+	expect(pre).to.exist;
+	return pre;
+}
-- 
cgit v1.2.3