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})))