diff --git a/packages/mdx/lib/plugin/recma-jsx-rewrite.js b/packages/mdx/lib/plugin/recma-jsx-rewrite.js index 0858a0be5..e1d8dbf50 100644 --- a/packages/mdx/lib/plugin/recma-jsx-rewrite.js +++ b/packages/mdx/lib/plugin/recma-jsx-rewrite.js @@ -136,11 +136,25 @@ export function recmaJsxRewrite(options = {}) { const fullId = ids.join('.') const id = name.name + const isInScope = inScope(currentScope, id) + if (!own.call(fnScope.references, fullId)) { - fnScope.references[fullId] = {node, component: true} + const parentScope = /** @type {Scope|null} */ ( + currentScope.parent + ) + if ( + !isInScope || + // If the parent scope is `_createMdxContent`, then this + // references a component we can add a check statement for. + (parentScope && + parentScope.node.type === 'FunctionDeclaration' && + isNamedFunction(parentScope.node, '_createMdxContent')) + ) { + fnScope.references[fullId] = {node, component: true} + } } - if (!fnScope.objects.includes(id) && !inScope(currentScope, id)) { + if (!fnScope.objects.includes(id) && !isInScope) { fnScope.objects.push(id) } } diff --git a/packages/mdx/test/compile.js b/packages/mdx/test/compile.js index b98cf6c16..70db8b800 100644 --- a/packages/mdx/test/compile.js +++ b/packages/mdx/test/compile.js @@ -504,7 +504,6 @@ test('compile', async () => { ) } - // TODO: this is incorrect behavior, will be fixed in GH-1986 try { renderToStaticMarkup( React.createElement( @@ -521,11 +520,10 @@ test('compile', async () => { ) } - // TODO: this is incorrect behavior, will be fixed in GH-1986 try { renderToStaticMarkup( React.createElement( - await run(compileSync(' } />')) + await run(compileSync(' } />')) ) ) assert.unreachable() @@ -533,11 +531,21 @@ test('compile', async () => { const exception = /** @type {Error} */ (error) assert.match( exception.message, - /x is not defined/, + /Expected object `x` to be defined/, 'should throw if a used member is not defined locally (JSX in a function)' ) } + assert.equal( + renderToStaticMarkup( + React.createElement( + await run(compileSync(' } />')) + ) + ), + '', + 'should render if a used member is defined locally (JSX in a function)' + ) + try { renderToStaticMarkup( React.createElement(await run(compileSync('', {development: true})))