tests: update tests

readmeio · Jan 15, 2025 · c539551 · c539551
1 parent bef5d6f
commit c539551
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 24 deletions.
diff --git a/__tests__/custom-components/index.test.tsx b/__tests__/custom-components/index.test.tsx
@@ -3,16 +3,17 @@ import React from 'react';
 import { render, screen } from '@testing-library/react';
 import { execute } from '../helpers';
 
-describe('Custom Components', () => {
-  const Example = { default: () => <div>It works!</div> };
-  const Composite = {
-    default: () => (
-      <>
-        <div>Does it work?</div>
-        <Example.default />
-      </>
-    ),
-  };
+describe('Custom Components', async () => {
+  const Example = await execute(`It works!`, {}, {}, { getDefault: false });
+  const Multiple = await execute(
+    `
+export const First = () => <div>First</div>;
+export const Second = () => <div>Second</div>;
+`,
+    {},
+    {},
+    { getDefault: false },
+  );
 
   it('renders custom components', async () => {
     const doc = `
@@ -24,14 +25,16 @@ describe('Custom Components', () => {
     expect(screen.getByText('It works!')).toBeVisible();
   });
 
-  it('renders custom components recursively', async () => {
+  it('renders a custom component with multiple exports', async () => {
     const doc = `
-<Composite />
-    `;
+<First />
 
-    const Page = await execute(doc, undefined, { components: { Example, Composite } });
+<Second />
+    `;
+    const Page = await execute(doc, undefined, { components: { Multiple } });
     render(<Page />);
 
-    expect(screen.getByText('It works!')).toBeVisible();
+    expect(screen.getByText('First')).toBeVisible();
+    expect(screen.getByText('Second')).toBeVisible();
   });
 });
diff --git a/__tests__/helpers.ts b/__tests__/helpers.ts
@@ -16,10 +16,11 @@ export const silenceConsole =
     }
   };
 
-export const execute = async (doc: string, compileOpts = {}, runOpts = {}) => {
+export const execute = async (doc: string, compileOpts = {}, runOpts = {}, { getDefault = true } = {}) => {
   const code = compile(doc, compileOpts);
-  const module = await run(code, runOpts);
-  return module.default;
+  const mod = await run(code, runOpts);
+
+  return getDefault ? mod.default : mod;
 };
 
 export const migrate = (doc: string) => {

diff --git a/lib/run.tsx b/lib/run.tsx
@@ -54,17 +54,19 @@ const makeUseMDXComponents = (more: ReturnType<UseMdxComponents> = {}): UseMdxCo
 const run = async (string: string, _opts: RunOpts = {}) => {
   const { Fragment } = runtime as any;
   const { components = {}, terms, variables, baseUrl, ...opts } = _opts;
-  const defaults = Object.entries(components).reduce((memo, [tag, mod]) => {
+  const executedComponents = Object.entries(components).reduce((memo, [tag, mod]) => {
     memo[tag] = mod.default;
 
-    Object.entries(mod.exports).forEach(([subTag, component]) => {
-      memo[subTag] = component;
-    });
+    if (mod.exports) {
+      Object.entries(mod.exports).forEach(([subTag, component]) => {
+        memo[subTag] = component;
+      });
+    }
 
     return memo;
   }, {});
 
-  const exec = (text: string, { useMDXComponents = makeUseMDXComponents(defaults) }: RunOpts = {}) => {
+  const exec = (text: string, { useMDXComponents = makeUseMDXComponents(executedComponents) }: RunOpts = {}) => {
     return mdxRun(text, {
       ...runtime,
       Fragment,
@@ -75,7 +77,7 @@ const run = async (string: string, _opts: RunOpts = {}) => {
     }) as Promise<RMDXModule>;
   };
 
-  const { toc, default: Content, ...exports } = await exec(string);
+  const { Toc: _Toc, toc, default: Content, ...exports } = await exec(string);
 
   const tocMdx = tocToMdx(toc, components);
   const { default: Toc } = await exec(compile(tocMdx), { useMDXComponents: () => ({ p: Fragment }) });