Lookup non-local element factory for reference marking when marking fragment references (#60684)

src/compiler/checker.ts

@@ -30042,8 +30042,9 @@ export function createTypeChecker(host: TypeCheckerHost): TypeChecker {
             // if JsxFragment, additionally mark jsx pragma as referenced, since `getJsxNamespace` above would have resolved to only the fragment factory if they are distinct
             if (isJsxOpeningFragment(node)) {
                 const file = getSourceFileOfNode(node);
-                const localJsxNamespace = getLocalJsxNamespace(file);
-                if (localJsxNamespace) {
+                const entity = getJsxFactoryEntity(file);
+                if (entity) {
+                    const localJsxNamespace = getFirstIdentifier(entity).escapedText;
                     resolveName(
                         jsxFactoryLocation,
                         localJsxNamespace,

tests/baselines/reference/jsxFragmentAndFactoryUsedOnFragmentUse.js

@@ -0,0 +1,25 @@
+//// [tests/cases/compiler/jsxFragmentAndFactoryUsedOnFragmentUse.tsx] ////
+
+//// [index.tsx]
+import {element, fragment} from "./jsx";
+
+export const a = <>fragment text</>
+
+//// [jsx.ts]
+export function element() {}
+
+export function fragment() {}
+
+//// [jsx.js]
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.element = element;
+exports.fragment = fragment;
+function element() { }
+function fragment() { }
+//// [index.js]
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.a = void 0;
+var jsx_1 = require("./jsx");
+exports.a = (0, jsx_1.element)(jsx_1.fragment, null, "fragment text");

tests/baselines/reference/jsxFragmentAndFactoryUsedOnFragmentUse.symbols

@@ -0,0 +1,17 @@
+//// [tests/cases/compiler/jsxFragmentAndFactoryUsedOnFragmentUse.tsx] ////
+
+=== index.tsx ===
+import {element, fragment} from "./jsx";
+>element : Symbol(element, Decl(index.tsx, 0, 8))
+>fragment : Symbol(fragment, Decl(index.tsx, 0, 16))
+
+export const a = <>fragment text</>
+>a : Symbol(a, Decl(index.tsx, 2, 12))
+
+=== jsx.ts ===
+export function element() {}
+>element : Symbol(element, Decl(jsx.ts, 0, 0))
+
+export function fragment() {}
+>fragment : Symbol(fragment, Decl(jsx.ts, 0, 28))
+

tests/baselines/reference/jsxFragmentAndFactoryUsedOnFragmentUse.types

@@ -0,0 +1,22 @@
+//// [tests/cases/compiler/jsxFragmentAndFactoryUsedOnFragmentUse.tsx] ////
+
+=== index.tsx ===
+import {element, fragment} from "./jsx";
+>element : () => void
+>        : ^^^^^^^^^^
+>fragment : () => void
+>         : ^^^^^^^^^^
+
+export const a = <>fragment text</>
+>a : any
+><>fragment text</> : any
+
+=== jsx.ts ===
+export function element() {}
+>element : () => void
+>        : ^^^^^^^^^^
+
+export function fragment() {}
+>fragment : () => void
+>         : ^^^^^^^^^^
+

tests/cases/compiler/jsxFragmentAndFactoryUsedOnFragmentUse.tsx

@@ -0,0 +1,13 @@
+// @jsx: react
+// @jsxFactory: element
+// @jsxFragmentFactory: fragment
+// @noUnusedLocals: true
+// @filename: index.tsx
+import {element, fragment} from "./jsx";
+
+export const a = <>fragment text</>
+
+// @filename: jsx.ts
+export function element() {}
+
+export function fragment() {}