From 83a41d72772b74d2f4682ff9b4a82913c3bafe66 Mon Sep 17 00:00:00 2001 From: Peter Schilling Date: Wed, 17 Jul 2024 05:14:35 -0700 Subject: [PATCH] feat(markdoc): Support markdown-it's typographer option (#11450) * Support markdoc-it's typographer option in markdoc * Update .changeset/forty-scissors-jog.md [skip ci] * Update .changeset/forty-scissors-jog.md [skip ci] * Fix typo in changeset --------- Co-authored-by: Bjorn Lu Co-authored-by: Erika <3019731+Princesseuh@users.noreply.github.com> --- .changeset/forty-scissors-jog.md | 5 +++++ packages/integrations/markdoc/src/options.ts | 1 + .../integrations/markdoc/src/tokenizer.ts | 5 +++++ .../render-typographer/astro.config.mjs | 7 ++++++ .../fixtures/render-typographer/package.json | 9 ++++++++ .../src/content/blog/typographer.mdoc | 7 ++++++ .../render-typographer/src/pages/index.astro | 19 ++++++++++++++++ .../integrations/markdoc/test/render.test.js | 22 +++++++++++++++++++ pnpm-lock.yaml | 9 ++++++++ 9 files changed, 84 insertions(+) create mode 100644 .changeset/forty-scissors-jog.md create mode 100644 packages/integrations/markdoc/test/fixtures/render-typographer/astro.config.mjs create mode 100644 packages/integrations/markdoc/test/fixtures/render-typographer/package.json create mode 100644 packages/integrations/markdoc/test/fixtures/render-typographer/src/content/blog/typographer.mdoc create mode 100644 packages/integrations/markdoc/test/fixtures/render-typographer/src/pages/index.astro diff --git a/.changeset/forty-scissors-jog.md b/.changeset/forty-scissors-jog.md new file mode 100644 index 0000000000..3637b08025 --- /dev/null +++ b/.changeset/forty-scissors-jog.md @@ -0,0 +1,5 @@ +--- +'@astrojs/markdoc': patch +--- + +Adds support for markdown-it's typographer option diff --git a/packages/integrations/markdoc/src/options.ts b/packages/integrations/markdoc/src/options.ts index 450285bcf7..abaeb5a964 100644 --- a/packages/integrations/markdoc/src/options.ts +++ b/packages/integrations/markdoc/src/options.ts @@ -1,4 +1,5 @@ export interface MarkdocIntegrationOptions { allowHTML?: boolean; ignoreIndentation?: boolean; + typographer?: boolean; } diff --git a/packages/integrations/markdoc/src/tokenizer.ts b/packages/integrations/markdoc/src/tokenizer.ts index 79d0d7358b..001e6da062 100644 --- a/packages/integrations/markdoc/src/tokenizer.ts +++ b/packages/integrations/markdoc/src/tokenizer.ts @@ -24,6 +24,11 @@ export function getMarkdocTokenizer(options: MarkdocIntegrationOptions | undefin // allow indentation so nested Markdoc tags can be formatted for better readability tokenizerOptions.allowIndentation = true; } + if (options?.typographer) { + // enable typographer to convert straight quotes to curly quotes, etc. + tokenizerOptions.typographer = options.typographer; + } + _cachedMarkdocTokenizers[key] = new Markdoc.Tokenizer(tokenizerOptions); } diff --git a/packages/integrations/markdoc/test/fixtures/render-typographer/astro.config.mjs b/packages/integrations/markdoc/test/fixtures/render-typographer/astro.config.mjs new file mode 100644 index 0000000000..408e036c7a --- /dev/null +++ b/packages/integrations/markdoc/test/fixtures/render-typographer/astro.config.mjs @@ -0,0 +1,7 @@ +import markdoc from '@astrojs/markdoc'; +import { defineConfig } from 'astro/config'; + +// https://astro.build/config +export default defineConfig({ + integrations: [markdoc({ typographer: true })], +}); diff --git a/packages/integrations/markdoc/test/fixtures/render-typographer/package.json b/packages/integrations/markdoc/test/fixtures/render-typographer/package.json new file mode 100644 index 0000000000..02fd6788f3 --- /dev/null +++ b/packages/integrations/markdoc/test/fixtures/render-typographer/package.json @@ -0,0 +1,9 @@ +{ + "name": "@test/markdoc-render-typographer", + "version": "0.0.0", + "private": true, + "dependencies": { + "@astrojs/markdoc": "workspace:*", + "astro": "workspace:*" + } +} diff --git a/packages/integrations/markdoc/test/fixtures/render-typographer/src/content/blog/typographer.mdoc b/packages/integrations/markdoc/test/fixtures/render-typographer/src/content/blog/typographer.mdoc new file mode 100644 index 0000000000..2180e7a47b --- /dev/null +++ b/packages/integrations/markdoc/test/fixtures/render-typographer/src/content/blog/typographer.mdoc @@ -0,0 +1,7 @@ +--- +title: Typographer +--- + +## Typographer's post + +This is a post to test the "typographer" option. diff --git a/packages/integrations/markdoc/test/fixtures/render-typographer/src/pages/index.astro b/packages/integrations/markdoc/test/fixtures/render-typographer/src/pages/index.astro new file mode 100644 index 0000000000..88fc531fa2 --- /dev/null +++ b/packages/integrations/markdoc/test/fixtures/render-typographer/src/pages/index.astro @@ -0,0 +1,19 @@ +--- +import { getEntryBySlug } from "astro:content"; + +const post = await getEntryBySlug('blog', 'typographer'); +const { Content } = await post.render(); +--- + + + + + + + + Content + + + + + diff --git a/packages/integrations/markdoc/test/render.test.js b/packages/integrations/markdoc/test/render.test.js index d439adcd2b..4c6d1b415e 100644 --- a/packages/integrations/markdoc/test/render.test.js +++ b/packages/integrations/markdoc/test/render.test.js @@ -117,6 +117,15 @@ describe('Markdoc - render', () => { renderWithRootFolderContainingSpace(html); }); + + it('renders content - with typographer option', async () => { + const fixture = await getFixture('render-typographer'); + await fixture.build() + + const html = await fixture.readFile('/index.html'); + + renderTypographerChecks(html); + }); }); }); @@ -173,3 +182,16 @@ function renderWithRootFolderContainingSpace(html) { const p = document.querySelector('p'); assert.equal(p.textContent, 'This is a simple Markdoc post with root folder containing a space.'); } + +/** + * @param {string} html + */ +function renderTypographerChecks(html) { + const { document } = parseHTML(html); + + const h2 = document.querySelector('h2'); + assert.equal(h2.textContent, 'Typographer’s post'); + + const p = document.querySelector('p'); + assert.equal(p.textContent, 'This is a post to test the “typographer” option.'); +} diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 2031e768ba..061a605980 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -4597,6 +4597,15 @@ importers: specifier: workspace:* version: link:../../../../../astro + packages/integrations/markdoc/test/fixtures/render-typographer: + dependencies: + '@astrojs/markdoc': + specifier: workspace:* + version: link:../../.. + astro: + specifier: workspace:* + version: link:../../../../../astro + packages/integrations/markdoc/test/fixtures/render-with-components: dependencies: '@astrojs/markdoc':