Use snapshot-fixtures for testing

This also adds Prettier support and makes empty `options.json` files
redundant.

fixtures/default/expected.jsx

@@ -1,24 +1,30 @@
 /*@jsxRuntime automatic @jsxImportSource react*/
 export const frontmatter = {
-  "title": "Hello frontmatter",
-  "index": 1,
-  "nested": {
-    "data": {
-      "structure": {
-        "including": {
-          "numbers": 42,
-          "booleans": true,
-          "": null,
-          "arrays": ["of", "items"]
+  title: 'Hello frontmatter',
+  index: 1,
+  nested: {
+    data: {
+      structure: {
+        including: {
+          numbers: 42,
+          booleans: true,
+          '': null,
+          arrays: ['of', 'items']
         }
       }
     }
   }
-};
+}
 function _createMdxContent(props) {
-  return <></>;
+  return <></>
 }
 export default function MDXContent(props = {}) {
-  const {wrapper: MDXLayout} = props.components || ({});
-  return MDXLayout ? <MDXLayout {...props}><_createMdxContent {...props} /></MDXLayout> : _createMdxContent(props);
+  const { wrapper: MDXLayout } = props.components || {}
+  return MDXLayout ? (
+    <MDXLayout {...props}>
+      <_createMdxContent {...props} />
+    </MDXLayout>
+  ) : (
+    _createMdxContent(props)
+  )
 }

fixtures/named/expected.jsx

@@ -1,24 +1,30 @@
 /*@jsxRuntime automatic @jsxImportSource react*/
 export const frontmatter = {
-  "title": "Hello frontmatter",
-  "index": 1,
-  "nested": {
-    "data": {
-      "structure": {
-        "including": {
-          "numbers": 42,
-          "booleans": true,
-          "": null,
-          "arrays": ["of", "items"]
+  title: 'Hello frontmatter',
+  index: 1,
+  nested: {
+    data: {
+      structure: {
+        including: {
+          numbers: 42,
+          booleans: true,
+          '': null,
+          arrays: ['of', 'items']
         }
       }
     }
   }
-};
+}
 function _createMdxContent(props) {
-  return <></>;
+  return <></>
 }
 export default function MDXContent(props = {}) {
-  const {wrapper: MDXLayout} = props.components || ({});
-  return MDXLayout ? <MDXLayout {...props}><_createMdxContent {...props} /></MDXLayout> : _createMdxContent(props);
+  const { wrapper: MDXLayout } = props.components || {}
+  return MDXLayout ? (
+    <MDXLayout {...props}>
+      <_createMdxContent {...props} />
+    </MDXLayout>
+  ) : (
+    _createMdxContent(props)
+  )
 }

fixtures/null/expected.jsx

@@ -1,9 +1,15 @@
 /*@jsxRuntime automatic @jsxImportSource react*/
-export const frontmatter = null;
+export const frontmatter = null
 function _createMdxContent(props) {
-  return <></>;
+  return <></>
 }
 export default function MDXContent(props = {}) {
-  const {wrapper: MDXLayout} = props.components || ({});
-  return MDXLayout ? <MDXLayout {...props}><_createMdxContent {...props} /></MDXLayout> : _createMdxContent(props);
+  const { wrapper: MDXLayout } = props.components || {}
+  return MDXLayout ? (
+    <MDXLayout {...props}>
+      <_createMdxContent {...props} />
+    </MDXLayout>
+  ) : (
+    _createMdxContent(props)
+  )
 }

fixtures/toml-with-content/expected.jsx

@@ -1,17 +1,29 @@
 /*@jsxRuntime automatic @jsxImportSource react*/
 export const frontmatter = {
   __proto__: null,
-  "title": "Hello TOML"
-};
+  title: 'Hello TOML'
+}
 function _createMdxContent(props) {
   const _components = {
-    h1: "h1",
-    p: "p",
+    h1: 'h1',
+    p: 'p',
     ...props.components
-  };
-  return <><_components.h1>{"Hello, World"}</_components.h1>{"\n"}<_components.p>{"Some content"}</_components.p></>;
+  }
+  return (
+    <>
+      <_components.h1>{'Hello, World'}</_components.h1>
+      {'\n'}
+      <_components.p>{'Some content'}</_components.p>
+    </>
+  )
 }
 export default function MDXContent(props = {}) {
-  const {wrapper: MDXLayout} = props.components || ({});
-  return MDXLayout ? <MDXLayout {...props}><_createMdxContent {...props} /></MDXLayout> : _createMdxContent(props);
+  const { wrapper: MDXLayout } = props.components || {}
+  return MDXLayout ? (
+    <MDXLayout {...props}>
+      <_createMdxContent {...props} />
+    </MDXLayout>
+  ) : (
+    _createMdxContent(props)
+  )
 }

fixtures/toml/expected.jsx

@@ -1,12 +1,18 @@
 /*@jsxRuntime automatic @jsxImportSource react*/
 export const frontmatter = {
   __proto__: null,
-  "title": "Hello TOML"
-};
+  title: 'Hello TOML'
+}
 function _createMdxContent(props) {
-  return <></>;
+  return <></>
 }
 export default function MDXContent(props = {}) {
-  const {wrapper: MDXLayout} = props.components || ({});
-  return MDXLayout ? <MDXLayout {...props}><_createMdxContent {...props} /></MDXLayout> : _createMdxContent(props);
+  const { wrapper: MDXLayout } = props.components || {}
+  return MDXLayout ? (
+    <MDXLayout {...props}>
+      <_createMdxContent {...props} />
+    </MDXLayout>
+  ) : (
+    _createMdxContent(props)
+  )
 }

fixtures/undefined-named/expected.jsx

@@ -1,9 +1,15 @@
 /*@jsxRuntime automatic @jsxImportSource react*/
-export const frontmatter = undefined;
+export const frontmatter = undefined
 function _createMdxContent(props) {
-  return <></>;
+  return <></>
 }
 export default function MDXContent(props = {}) {
-  const {wrapper: MDXLayout} = props.components || ({});
-  return MDXLayout ? <MDXLayout {...props}><_createMdxContent {...props} /></MDXLayout> : _createMdxContent(props);
+  const { wrapper: MDXLayout } = props.components || {}
+  return MDXLayout ? (
+    <MDXLayout {...props}>
+      <_createMdxContent {...props} />
+    </MDXLayout>
+  ) : (
+    _createMdxContent(props)
+  )
 }

package.json

@@ -54,6 +54,7 @@
     "remark-cli": "^11.0.0",
     "remark-frontmatter": "^5.0.0",
     "remark-preset-remcohaszing": "^2.0.0",
+    "snapshot-fixtures": "^1.0.0",
     "typescript": "^5.0.0"
   }
 }

src/test.ts

@@ -1,33 +1,27 @@
 import assert from 'node:assert/strict'
-import { readdir, readFile, writeFile } from 'node:fs/promises'
 import { test } from 'node:test'
 
 import { compile, compileSync } from '@mdx-js/mdx'
 import remarkFrontmatter from 'remark-frontmatter'
 import remarkMdxFrontmatter from 'remark-mdx-frontmatter'
+import { assertEqual, testFixturesDirectory } from 'snapshot-fixtures'
 
-const fixturesDir = new URL('../fixtures/', import.meta.url)
-const tests = await readdir(fixturesDir)
-
-for (const name of tests) {
-  test(name, async () => {
-    const url = new URL(`${name}/`, fixturesDir)
-    const input = await readFile(new URL('input.md', url))
-    const expected = new URL('expected.jsx', url)
-    const options: unknown = JSON.parse(await readFile(new URL('options.json', url), 'utf8'))
-    const { value } = await compile(input, {
-      remarkPlugins: [
-        [remarkFrontmatter, ['yaml', 'toml']],
-        [remarkMdxFrontmatter, options]
-      ],
-      jsx: true
-    })
-    if (process.argv.includes('--write')) {
-      await writeFile(expected, value)
+testFixturesDirectory({
+  directory: new URL('../fixtures', import.meta.url),
+  prettier: true,
+  write: true,
+  tests: {
+    'expected.jsx'(file, options) {
+      return compile(file, {
+        remarkPlugins: [
+          [remarkFrontmatter, ['yaml', 'toml']],
+          [remarkMdxFrontmatter, options]
+        ],
+        jsx: true
+      })
     }
-    assert.equal(value, await readFile(expected, 'utf8'))
-  })
-}
+  }
+})
 
 test('custom parser', async () => {
   const { value } = await compile('---\nfoo: bar\n---\n', {
@@ -37,8 +31,9 @@ test('custom parser', async () => {
     ],
     jsx: true
   })
-  assert.equal(
-    value,
+
+  assertEqual(
+    String(value),
     `/*@jsxRuntime automatic @jsxImportSource react*/
 export const frontmatter = {
   "content": "foo: bar"