1efaef6be0
* 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>
89 lines
2.3 KiB
JavaScript
89 lines
2.3 KiB
JavaScript
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;
|
|
}
|