diff --git a/src/compiler/checker.ts b/src/compiler/checker.ts
index 97c272990aca6..05e62f2524d34 100644
--- a/src/compiler/checker.ts
+++ b/src/compiler/checker.ts
@@ -30668,15 +30668,21 @@ export function createTypeChecker(host: TypeCheckerHost): TypeChecker {
             if (!isErrorType(intrinsicElementsType)) {
                 // Property case
                 if (!isIdentifier(node.tagName) && !isJsxNamespacedName(node.tagName)) return Debug.fail();
-                const intrinsicProp = getPropertyOfType(intrinsicElementsType, isJsxNamespacedName(node.tagName) ? getEscapedTextOfJsxNamespacedName(node.tagName) : node.tagName.escapedText);
+                const propName = isJsxNamespacedName(node.tagName) ? getEscapedTextOfJsxNamespacedName(node.tagName) : node.tagName.escapedText;
+                const intrinsicProp = getPropertyOfType(intrinsicElementsType, propName);
                 if (intrinsicProp) {
                     links.jsxFlags |= JsxFlags.IntrinsicNamedElement;
                     return links.resolvedSymbol = intrinsicProp;
                 }
 
                 // Intrinsic string indexer case
-                const indexSignatureType = getIndexTypeOfType(intrinsicElementsType, stringType);
-                if (indexSignatureType) {
+                const indexSymbol = getApplicableIndexSymbol(intrinsicElementsType, getStringLiteralType(unescapeLeadingUnderscores(propName)));
+                if (indexSymbol) {
+                    links.jsxFlags |= JsxFlags.IntrinsicIndexedElement;
+                    return links.resolvedSymbol = indexSymbol;
+                }
+
+                if (getTypeOfPropertyOrIndexSignatureOfType(intrinsicElementsType, propName)) {
                     links.jsxFlags |= JsxFlags.IntrinsicIndexedElement;
                     return links.resolvedSymbol = intrinsicElementsType.symbol;
                 }
@@ -30904,8 +30910,9 @@ export function createTypeChecker(host: TypeCheckerHost): TypeChecker {
                 return links.resolvedJsxElementAttributesType = getTypeOfSymbol(symbol) || errorType;
             }
             else if (links.jsxFlags & JsxFlags.IntrinsicIndexedElement) {
+                const propName = isJsxNamespacedName(node.tagName) ? getEscapedTextOfJsxNamespacedName(node.tagName) : node.tagName.escapedText;
                 return links.resolvedJsxElementAttributesType =
-                    getIndexTypeOfType(getJsxType(JsxNames.IntrinsicElements, node), stringType) || errorType;
+                    getApplicableIndexInfoForName(getJsxType(JsxNames.IntrinsicElements, node), propName)?.type || errorType;
             }
             else {
                 return links.resolvedJsxElementAttributesType = errorType;
@@ -45699,33 +45706,7 @@ export function createTypeChecker(host: TypeCheckerHost): TypeChecker {
                 if (name.kind === SyntaxKind.PropertyAccessExpression) {
                     checkPropertyAccessExpression(name, CheckMode.Normal);
                     if (!links.resolvedSymbol) {
-                        const expressionType = checkExpressionCached(name.expression);
-                        const infos = getApplicableIndexInfos(expressionType, getLiteralTypeFromPropertyName(name.name));
-                        if (infos.length && (expressionType as ObjectType).members) {
-                            const resolved = resolveStructuredTypeMembers(expressionType as ObjectType);
-                            const symbol = resolved.members.get(InternalSymbolName.Index);
-                            if (infos === getIndexInfosOfType(expressionType)) {
-                                links.resolvedSymbol = symbol;
-                            }
-                            else if (symbol) {
-                                const symbolLinks = getSymbolLinks(symbol);
-                                const declarationList = mapDefined(infos, i => i.declaration);
-                                const nodeListId = map(declarationList, getNodeId).join(",");
-                                if (!symbolLinks.filteredIndexSymbolCache) {
-                                    symbolLinks.filteredIndexSymbolCache = new Map();
-                                }
-                                if (symbolLinks.filteredIndexSymbolCache.has(nodeListId)) {
-                                    links.resolvedSymbol = symbolLinks.filteredIndexSymbolCache.get(nodeListId)!;
-                                }
-                                else {
-                                    const copy = createSymbol(SymbolFlags.Signature, InternalSymbolName.Index);
-                                    copy.declarations = mapDefined(infos, i => i.declaration);
-                                    copy.parent = expressionType.aliasSymbol ? expressionType.aliasSymbol : expressionType.symbol ? expressionType.symbol : getSymbolAtLocation(copy.declarations[0].parent);
-                                    symbolLinks.filteredIndexSymbolCache.set(nodeListId, copy);
-                                    links.resolvedSymbol = symbolLinks.filteredIndexSymbolCache.get(nodeListId)!;
-                                }
-                            }
-                        }
+                        links.resolvedSymbol = getApplicableIndexSymbol(checkExpressionCached(name.expression), getLiteralTypeFromPropertyName(name.name));
                     }
                 }
                 else {
@@ -45752,6 +45733,34 @@ export function createTypeChecker(host: TypeCheckerHost): TypeChecker {
         return undefined;
     }
 
+    function getApplicableIndexSymbol(type: Type, keyType: Type) {
+        const infos = getApplicableIndexInfos(type, keyType);
+        if (infos.length && (type as ObjectType).members) {
+            const symbol = getIndexSymbolFromSymbolTable(resolveStructuredTypeMembers(type as ObjectType).members);
+            if (infos === getIndexInfosOfType(type)) {
+                return symbol;
+            }
+            else if (symbol) {
+                const symbolLinks = getSymbolLinks(symbol);
+                const declarationList = mapDefined(infos, i => i.declaration);
+                const nodeListId = map(declarationList, getNodeId).join(",");
+                if (!symbolLinks.filteredIndexSymbolCache) {
+                    symbolLinks.filteredIndexSymbolCache = new Map();
+                }
+                if (symbolLinks.filteredIndexSymbolCache.has(nodeListId)) {
+                    return symbolLinks.filteredIndexSymbolCache.get(nodeListId)!;
+                }
+                else {
+                    const copy = createSymbol(SymbolFlags.Signature, InternalSymbolName.Index);
+                    copy.declarations = mapDefined(infos, i => i.declaration);
+                    copy.parent = type.aliasSymbol ? type.aliasSymbol : type.symbol ? type.symbol : getSymbolAtLocation(copy.declarations[0].parent);
+                    symbolLinks.filteredIndexSymbolCache.set(nodeListId, copy);
+                    return copy;
+                }
+            }
+        }
+    }
+
     /**
      * Recursively resolve entity names and jsdoc instance references:
      * 1. K#m as K.prototype.m for a class (or other value) K
diff --git a/tests/baselines/reference/inlineJsxAndJsxFragPragma.symbols b/tests/baselines/reference/inlineJsxAndJsxFragPragma.symbols
index bf1b31e2dd36d..b73f57f3fc39c 100644
--- a/tests/baselines/reference/inlineJsxAndJsxFragPragma.symbols
+++ b/tests/baselines/reference/inlineJsxAndJsxFragPragma.symbols
@@ -34,8 +34,8 @@ import {h, Fragment} from "./renderer";
 >Fragment : Symbol(Fragment, Decl(preacty.tsx, 4, 10))
 
 <><div></div></>
->div : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
->div : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 
 === snabbdomy.tsx ===
 /* @jsx jsx */
@@ -44,8 +44,8 @@ import {jsx} from "./renderer";
 >jsx : Symbol(jsx, Decl(snabbdomy.tsx, 2, 8))
 
 <><span></span></>
->span : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
->span : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 
 === preacty-only-fragment.tsx ===
 /**
@@ -93,8 +93,8 @@ import {h, Fragment} from "./renderer";
 >Fragment : Symbol(Fragment, Decl(preacty-no-fragment.tsx, 4, 10))
 
 <div></div>
->div : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
->div : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 
 === snabbdomy-no-fragment.tsx ===
 /* @jsx jsx */
@@ -103,8 +103,8 @@ import {jsx} from "./renderer";
 >jsx : Symbol(jsx, Decl(snabbdomy-no-fragment.tsx, 2, 8))
 
 <div></div>
->div : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
->div : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 
 === preacty-only-component.tsx ===
 /**
diff --git a/tests/baselines/reference/inlineJsxAndJsxFragPragmaOverridesCompilerOptions.symbols b/tests/baselines/reference/inlineJsxAndJsxFragPragmaOverridesCompilerOptions.symbols
index 8bcfb81e89f2c..6479cf0a5e504 100644
--- a/tests/baselines/reference/inlineJsxAndJsxFragPragmaOverridesCompilerOptions.symbols
+++ b/tests/baselines/reference/inlineJsxAndJsxFragPragmaOverridesCompilerOptions.symbols
@@ -38,8 +38,8 @@ import {createElement, Fragment} from "./react";
 >Fragment : Symbol(Fragment, Decl(reacty.tsx, 0, 22))
 
 <><span></span></>
->span : Symbol(JSX.IntrinsicElements, Decl(react.d.ts, 1, 19))
->span : Symbol(JSX.IntrinsicElements, Decl(react.d.ts, 1, 19))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(react.d.ts, 2, 37))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(react.d.ts, 2, 37))
 
 === preacty.tsx ===
 /**
@@ -51,8 +51,8 @@ import {h, Frag} from "./preact";
 >Frag : Symbol(Frag, Decl(preacty.tsx, 4, 10))
 
 <><div></div></>
->div : Symbol(JSX.IntrinsicElements, Decl(react.d.ts, 1, 19))
->div : Symbol(JSX.IntrinsicElements, Decl(react.d.ts, 1, 19))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(react.d.ts, 2, 37))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(react.d.ts, 2, 37))
 
 === snabbdomy.tsx ===
 /**
@@ -63,8 +63,8 @@ import {h} from "./snabbdom";
 >h : Symbol(h, Decl(snabbdomy.tsx, 4, 8))
 
 <><div></div></>
->div : Symbol(JSX.IntrinsicElements, Decl(react.d.ts, 1, 19))
->div : Symbol(JSX.IntrinsicElements, Decl(react.d.ts, 1, 19))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(react.d.ts, 2, 37))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(react.d.ts, 2, 37))
 
 === mix-n-match.tsx ===
 /* @jsx h */
@@ -76,6 +76,6 @@ import {Fragment} from "./react";
 >Fragment : Symbol(Fragment, Decl(mix-n-match.tsx, 3, 8))
 
 <><span></span></>
->span : Symbol(JSX.IntrinsicElements, Decl(react.d.ts, 1, 19))
->span : Symbol(JSX.IntrinsicElements, Decl(react.d.ts, 1, 19))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(react.d.ts, 2, 37))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(react.d.ts, 2, 37))
 
diff --git a/tests/baselines/reference/inlineJsxFactoryDeclarations.symbols b/tests/baselines/reference/inlineJsxFactoryDeclarations.symbols
index 5f85fcd782e1d..b852075f866cd 100644
--- a/tests/baselines/reference/inlineJsxFactoryDeclarations.symbols
+++ b/tests/baselines/reference/inlineJsxFactoryDeclarations.symbols
@@ -34,8 +34,8 @@ import * as React from "./renderer";
 >React : Symbol(React, Decl(otherreacty.tsx, 1, 6))
 
 <h></h>
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 
 === other.tsx ===
 /** @jsx h */
@@ -45,8 +45,8 @@ import { dom as h } from "./renderer"
 
 export const prerendered = <h></h>;
 >prerendered : Symbol(prerendered, Decl(other.tsx, 2, 12))
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 
 === othernoalias.tsx ===
 /** @jsx otherdom */
@@ -55,8 +55,8 @@ import { otherdom } from "./renderer"
 
 export const prerendered2 = <h></h>;
 >prerendered2 : Symbol(prerendered2, Decl(othernoalias.tsx, 2, 12))
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 
 === reacty.tsx ===
 import React from "./renderer"
@@ -64,8 +64,8 @@ import React from "./renderer"
 
 export const prerendered3 = <h></h>;
 >prerendered3 : Symbol(prerendered3, Decl(reacty.tsx, 1, 12))
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 
 === index.tsx ===
 /** @jsx dom */
@@ -73,8 +73,8 @@ import { dom } from "./renderer"
 >dom : Symbol(dom, Decl(index.tsx, 1, 8))
 
 <h></h>
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 
 export * from "./other";
 export * from "./othernoalias";
diff --git a/tests/baselines/reference/inlineJsxFactoryDeclarationsLocalTypes.symbols b/tests/baselines/reference/inlineJsxFactoryDeclarationsLocalTypes.symbols
index 91f8a072de126..04dcfda28b154 100644
--- a/tests/baselines/reference/inlineJsxFactoryDeclarationsLocalTypes.symbols
+++ b/tests/baselines/reference/inlineJsxFactoryDeclarationsLocalTypes.symbols
@@ -116,7 +116,7 @@ export const MySFC = (props: {x: number, y: number, children?: predom.JSX.Elemen
 >predom : Symbol(predom, Decl(component.tsx, 1, 8))
 >JSX : Symbol(predom.JSX, Decl(renderer2.d.ts, 0, 25))
 >Element : Symbol(predom.JSX.Element, Decl(renderer2.d.ts, 4, 9))
->p : Symbol(predom.JSX.IntrinsicElements, Decl(renderer2.d.ts, 1, 19))
+>p : Symbol(predom.JSX.IntrinsicElements.__index, Decl(renderer2.d.ts, 2, 37))
 >props.x : Symbol(x, Decl(component.tsx, 3, 30))
 >props : Symbol(props, Decl(component.tsx, 3, 22))
 >x : Symbol(x, Decl(component.tsx, 3, 30))
@@ -129,7 +129,7 @@ export const MySFC = (props: {x: number, y: number, children?: predom.JSX.Elemen
 >props.y : Symbol(y, Decl(component.tsx, 3, 40))
 >props : Symbol(props, Decl(component.tsx, 3, 22))
 >y : Symbol(y, Decl(component.tsx, 3, 40))
->p : Symbol(predom.JSX.IntrinsicElements, Decl(renderer2.d.ts, 1, 19))
+>p : Symbol(predom.JSX.IntrinsicElements.__index, Decl(renderer2.d.ts, 2, 37))
 
 export class MyClass implements predom.JSX.Element {
 >MyClass : Symbol(MyClass, Decl(component.tsx, 3, 164))
@@ -155,7 +155,7 @@ export class MyClass implements predom.JSX.Element {
 >render : Symbol(MyClass.render, Decl(component.tsx, 7, 89))
 
         return <p>
->p : Symbol(predom.JSX.IntrinsicElements, Decl(renderer2.d.ts, 1, 19))
+>p : Symbol(predom.JSX.IntrinsicElements.__index, Decl(renderer2.d.ts, 2, 37))
 
             {this.props.x} + {this.props.y} = {this.props.x + this.props.y}
 >this.props.x : Symbol(x, Decl(component.tsx, 7, 31))
@@ -187,7 +187,7 @@ export class MyClass implements predom.JSX.Element {
 >children : Symbol(children, Decl(component.tsx, 7, 52))
 
         </p>;
->p : Symbol(predom.JSX.IntrinsicElements, Decl(renderer2.d.ts, 1, 19))
+>p : Symbol(predom.JSX.IntrinsicElements.__index, Decl(renderer2.d.ts, 2, 37))
     }
 }
 export const tree = <MySFC x={1} y={2}><MyClass x={3} y={4} /><MyClass x={5} y={6} /></MySFC>
@@ -204,8 +204,8 @@ export const tree = <MySFC x={1} y={2}><MyClass x={3} y={4} /><MyClass x={5} y={
 >MySFC : Symbol(MySFC, Decl(component.tsx, 3, 12))
 
 export default <h></h>
->h : Symbol(predom.JSX.IntrinsicElements, Decl(renderer2.d.ts, 1, 19))
->h : Symbol(predom.JSX.IntrinsicElements, Decl(renderer2.d.ts, 1, 19))
+>h : Symbol(predom.JSX.IntrinsicElements.__index, Decl(renderer2.d.ts, 2, 37))
+>h : Symbol(predom.JSX.IntrinsicElements.__index, Decl(renderer2.d.ts, 2, 37))
 
 === index.tsx ===
 /** @jsx dom */
@@ -224,8 +224,8 @@ let elem = prerendered;
 
 elem = <h></h>; // Expect assignability error here
 >elem : Symbol(elem, Decl(index.tsx, 3, 3))
->h : Symbol(dom.JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
->h : Symbol(dom.JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>h : Symbol(dom.JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
+>h : Symbol(dom.JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 
 const DOMSFC = (props: {x: number, y: number, children?: dom.JSX.Element[]}) => <p>{props.x} + {props.y} = {props.x + props.y}{props.children}</p>;
 >DOMSFC : Symbol(DOMSFC, Decl(index.tsx, 6, 5))
@@ -236,7 +236,7 @@ const DOMSFC = (props: {x: number, y: number, children?: dom.JSX.Element[]}) =>
 >dom : Symbol(dom, Decl(index.tsx, 1, 8))
 >JSX : Symbol(dom.JSX, Decl(renderer.d.ts, 0, 22))
 >Element : Symbol(dom.JSX.Element, Decl(renderer.d.ts, 4, 9))
->p : Symbol(dom.JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>p : Symbol(dom.JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 >props.x : Symbol(x, Decl(index.tsx, 6, 24))
 >props : Symbol(props, Decl(index.tsx, 6, 16))
 >x : Symbol(x, Decl(index.tsx, 6, 24))
@@ -252,7 +252,7 @@ const DOMSFC = (props: {x: number, y: number, children?: dom.JSX.Element[]}) =>
 >props.children : Symbol(children, Decl(index.tsx, 6, 45))
 >props : Symbol(props, Decl(index.tsx, 6, 16))
 >children : Symbol(children, Decl(index.tsx, 6, 45))
->p : Symbol(dom.JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>p : Symbol(dom.JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 
 class DOMClass implements dom.JSX.Element {
 >DOMClass : Symbol(DOMClass, Decl(index.tsx, 6, 147))
@@ -278,7 +278,7 @@ class DOMClass implements dom.JSX.Element {
 >render : Symbol(DOMClass.render, Decl(index.tsx, 10, 86))
 
         return <p>{this.props.x} + {this.props.y} = {this.props.x + this.props.y}{...this.props.children}</p>;
->p : Symbol(dom.JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>p : Symbol(dom.JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 >this.props.x : Symbol(x, Decl(index.tsx, 10, 31))
 >this.props : Symbol(DOMClass.props, Decl(index.tsx, 10, 16))
 >this : Symbol(DOMClass, Decl(index.tsx, 6, 147))
@@ -304,7 +304,7 @@ class DOMClass implements dom.JSX.Element {
 >this : Symbol(DOMClass, Decl(index.tsx, 6, 147))
 >props : Symbol(DOMClass.props, Decl(index.tsx, 10, 16))
 >children : Symbol(children, Decl(index.tsx, 10, 52))
->p : Symbol(dom.JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>p : Symbol(dom.JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
     }
 }
 
diff --git a/tests/baselines/reference/inlineJsxFactoryLocalTypeGlobalFallback.symbols b/tests/baselines/reference/inlineJsxFactoryLocalTypeGlobalFallback.symbols
index c5fc7ce316aa8..de66a23d491ef 100644
--- a/tests/baselines/reference/inlineJsxFactoryLocalTypeGlobalFallback.symbols
+++ b/tests/baselines/reference/inlineJsxFactoryLocalTypeGlobalFallback.symbols
@@ -87,8 +87,8 @@ import { predom } from "./renderer2"
 >predom : Symbol(predom, Decl(component.tsx, 1, 8))
 
 export default <h></h>
->h : Symbol(predom.JSX.IntrinsicElements, Decl(renderer2.d.ts, 1, 19))
->h : Symbol(predom.JSX.IntrinsicElements, Decl(renderer2.d.ts, 1, 19))
+>h : Symbol(predom.JSX.IntrinsicElements.__index, Decl(renderer2.d.ts, 2, 37))
+>h : Symbol(predom.JSX.IntrinsicElements.__index, Decl(renderer2.d.ts, 2, 37))
 
 === index.tsx ===
 /** @jsx dom */
@@ -104,6 +104,6 @@ let elem = prerendered;
 
 elem = <h></h>; // Expect assignability error here
 >elem : Symbol(elem, Decl(index.tsx, 3, 3))
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 
diff --git a/tests/baselines/reference/inlineJsxFactoryOverridesCompilerOption.symbols b/tests/baselines/reference/inlineJsxFactoryOverridesCompilerOption.symbols
index 65e7d5c4a54ab..c55a654ee63f3 100644
--- a/tests/baselines/reference/inlineJsxFactoryOverridesCompilerOption.symbols
+++ b/tests/baselines/reference/inlineJsxFactoryOverridesCompilerOption.symbols
@@ -28,14 +28,14 @@ import {dom} from "./renderer";
 >dom : Symbol(dom, Decl(reacty.tsx, 1, 8))
 
 <h></h>
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 
 === index.tsx ===
 import { p } from "./renderer";
 >p : Symbol(p, Decl(index.tsx, 0, 8))
 
 <h></h>
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 
diff --git a/tests/baselines/reference/inlineJsxFactoryWithFragmentIsError.symbols b/tests/baselines/reference/inlineJsxFactoryWithFragmentIsError.symbols
index 86bf9461edf2c..6baaa631edbdb 100644
--- a/tests/baselines/reference/inlineJsxFactoryWithFragmentIsError.symbols
+++ b/tests/baselines/reference/inlineJsxFactoryWithFragmentIsError.symbols
@@ -27,8 +27,8 @@ import * as React from "./renderer";
 >React : Symbol(React, Decl(reacty.tsx, 1, 6))
 
 <><h></h></>
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 
 === index.tsx ===
 /** @jsx dom */
@@ -36,6 +36,6 @@ import { dom } from "./renderer";
 >dom : Symbol(dom, Decl(index.tsx, 1, 8))
 
 <><h></h></>
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
->h : Symbol(JSX.IntrinsicElements, Decl(renderer.d.ts, 1, 19))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
+>h : Symbol(JSX.IntrinsicElements.__index, Decl(renderer.d.ts, 2, 37))
 
diff --git a/tests/baselines/reference/jsxChildrenGenericContextualTypes.symbols b/tests/baselines/reference/jsxChildrenGenericContextualTypes.symbols
index 331c64e7aacaf..51118d42e9fdc 100644
--- a/tests/baselines/reference/jsxChildrenGenericContextualTypes.symbols
+++ b/tests/baselines/reference/jsxChildrenGenericContextualTypes.symbols
@@ -34,8 +34,8 @@ const Elem = <T,U=never>(p: { prop: T, children: (t: T) => T }) => <div></div>;
 >t : Symbol(t, Decl(jsxChildrenGenericContextualTypes.tsx, 7, 50))
 >T : Symbol(T, Decl(jsxChildrenGenericContextualTypes.tsx, 7, 14))
 >T : Symbol(T, Decl(jsxChildrenGenericContextualTypes.tsx, 7, 14))
->div : Symbol(JSX.IntrinsicElements, Decl(jsxChildrenGenericContextualTypes.tsx, 4, 43))
->div : Symbol(JSX.IntrinsicElements, Decl(jsxChildrenGenericContextualTypes.tsx, 4, 43))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(jsxChildrenGenericContextualTypes.tsx, 5, 40))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(jsxChildrenGenericContextualTypes.tsx, 5, 40))
 
 Elem({prop: {a: "x"}, children: i => ({a: "z"})});
 >Elem : Symbol(Elem, Decl(jsxChildrenGenericContextualTypes.tsx, 7, 5))
@@ -78,8 +78,8 @@ const ElemLit = <T extends string>(p: LitProps<T>) => <div></div>;
 >p : Symbol(p, Decl(jsxChildrenGenericContextualTypes.tsx, 13, 35))
 >LitProps : Symbol(LitProps, Decl(jsxChildrenGenericContextualTypes.tsx, 10, 57))
 >T : Symbol(T, Decl(jsxChildrenGenericContextualTypes.tsx, 13, 17))
->div : Symbol(JSX.IntrinsicElements, Decl(jsxChildrenGenericContextualTypes.tsx, 4, 43))
->div : Symbol(JSX.IntrinsicElements, Decl(jsxChildrenGenericContextualTypes.tsx, 4, 43))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(jsxChildrenGenericContextualTypes.tsx, 5, 40))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(jsxChildrenGenericContextualTypes.tsx, 5, 40))
 
 ElemLit({prop: "x", children: () => "x"});
 >ElemLit : Symbol(ElemLit, Decl(jsxChildrenGenericContextualTypes.tsx, 13, 5))
diff --git a/tests/baselines/reference/jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.errors.txt b/tests/baselines/reference/jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.errors.txt
new file mode 100644
index 0000000000000..57f0d21f68ea8
--- /dev/null
+++ b/tests/baselines/reference/jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.errors.txt
@@ -0,0 +1,26 @@
+jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx(11,9): error TS2322: Type 'number' is not assignable to type 'string'.
+jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx(14,12): error TS2322: Type '"smth"' is not assignable to type '"literal"'.
+
+
+==== jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx (2 errors) ====
+    // https://github.com/microsoft/TypeScript/issues/55240
+    
+    declare namespace JSX {
+      interface IntrinsicElements {
+        [k: `foo${string}`]: { prop: string };
+        [k: `foobar${string}`]: { prop: 'literal' };
+      }
+    }
+    
+    <foobaz prop="smth" />;
+    <foobaz prop={10} />;
+            ~~~~
+!!! error TS2322: Type 'number' is not assignable to type 'string'.
+!!! related TS6500 jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx:5:28: The expected type comes from property 'prop' which is declared here on type '{ prop: string; }'
+    
+    <foobarbaz prop="literal"/>;
+    <foobarbaz prop="smth"/>;
+               ~~~~
+!!! error TS2322: Type '"smth"' is not assignable to type '"literal"'.
+!!! related TS6500 jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx:5:28: The expected type comes from property 'prop' which is declared here on type '{ prop: string; } & { prop: "literal"; }'
+    
\ No newline at end of file
diff --git a/tests/baselines/reference/jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.symbols b/tests/baselines/reference/jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.symbols
new file mode 100644
index 0000000000000..3bd9c7deb0f5d
--- /dev/null
+++ b/tests/baselines/reference/jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.symbols
@@ -0,0 +1,37 @@
+//// [tests/cases/compiler/jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx] ////
+
+=== jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx ===
+// https://github.com/microsoft/TypeScript/issues/55240
+
+declare namespace JSX {
+>JSX : Symbol(JSX, Decl(jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx, 0, 0))
+
+  interface IntrinsicElements {
+>IntrinsicElements : Symbol(IntrinsicElements, Decl(jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx, 2, 23))
+
+    [k: `foo${string}`]: { prop: string };
+>k : Symbol(k, Decl(jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx, 4, 5))
+>prop : Symbol(prop, Decl(jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx, 4, 26))
+
+    [k: `foobar${string}`]: { prop: 'literal' };
+>k : Symbol(k, Decl(jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx, 5, 5))
+>prop : Symbol(prop, Decl(jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx, 5, 29))
+  }
+}
+
+<foobaz prop="smth" />;
+>foobaz : Symbol(JSX.IntrinsicElements.__index, Decl(jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx, 3, 31))
+>prop : Symbol(prop, Decl(jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx, 9, 7))
+
+<foobaz prop={10} />;
+>foobaz : Symbol(JSX.IntrinsicElements.__index, Decl(jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx, 3, 31))
+>prop : Symbol(prop, Decl(jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx, 10, 7))
+
+<foobarbaz prop="literal"/>;
+>foobarbaz : Symbol(JSX.IntrinsicElements.__index, Decl(jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx, 3, 31), Decl(jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx, 4, 42))
+>prop : Symbol(prop, Decl(jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx, 12, 10))
+
+<foobarbaz prop="smth"/>;
+>foobarbaz : Symbol(JSX.IntrinsicElements.__index, Decl(jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx, 3, 31), Decl(jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx, 4, 42))
+>prop : Symbol(prop, Decl(jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx, 13, 10))
+
diff --git a/tests/baselines/reference/jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.types b/tests/baselines/reference/jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.types
new file mode 100644
index 0000000000000..460d34a95aea3
--- /dev/null
+++ b/tests/baselines/reference/jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.types
@@ -0,0 +1,38 @@
+//// [tests/cases/compiler/jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx] ////
+
+=== jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx ===
+// https://github.com/microsoft/TypeScript/issues/55240
+
+declare namespace JSX {
+  interface IntrinsicElements {
+    [k: `foo${string}`]: { prop: string };
+>k : `foo${string}`
+>prop : string
+
+    [k: `foobar${string}`]: { prop: 'literal' };
+>k : `foobar${string}`
+>prop : "literal"
+  }
+}
+
+<foobaz prop="smth" />;
+><foobaz prop="smth" /> : any
+>foobaz : any
+>prop : string
+
+<foobaz prop={10} />;
+><foobaz prop={10} /> : any
+>foobaz : any
+>prop : number
+>10 : 10
+
+<foobarbaz prop="literal"/>;
+><foobarbaz prop="literal"/> : any
+>foobarbaz : any
+>prop : "literal"
+
+<foobarbaz prop="smth"/>;
+><foobarbaz prop="smth"/> : any
+>foobarbaz : any
+>prop : "smth"
+
diff --git a/tests/baselines/reference/jsxLocalNamespaceIndexSignatureNoCrash.symbols b/tests/baselines/reference/jsxLocalNamespaceIndexSignatureNoCrash.symbols
index 3d678afe49025..86d86bc7d7170 100644
--- a/tests/baselines/reference/jsxLocalNamespaceIndexSignatureNoCrash.symbols
+++ b/tests/baselines/reference/jsxLocalNamespaceIndexSignatureNoCrash.symbols
@@ -34,6 +34,6 @@ function A() {
 >A : Symbol(A, Decl(index.tsx, 12, 1))
 
     return (<p>Hello</p>);
->p : Symbol(__type, Decl(index.tsx, 8, 39))
->p : Symbol(__type, Decl(index.tsx, 8, 39))
+>p : Symbol(X.JSX.IntrinsicElements.__index, Decl(index.tsx, 8, 41))
+>p : Symbol(X.JSX.IntrinsicElements.__index, Decl(index.tsx, 8, 41))
 }
diff --git a/tests/baselines/reference/jsxNamespaceReexports.symbols b/tests/baselines/reference/jsxNamespaceReexports.symbols
index 0219ec13ce474..427748a17d567 100644
--- a/tests/baselines/reference/jsxNamespaceReexports.symbols
+++ b/tests/baselines/reference/jsxNamespaceReexports.symbols
@@ -29,5 +29,5 @@ import * as MyLib from "./library";
 
 const content = <my-element/>;
 >content : Symbol(content, Decl(index.tsx, 2, 5))
->my-element : Symbol(MyLib.JSX.IntrinsicElements, Decl(library.ts, 2, 15))
+>my-element : Symbol(MyLib.JSX.IntrinsicElements.__index, Decl(library.ts, 3, 38))
 
diff --git a/tests/baselines/reference/jsxParsingError1.symbols b/tests/baselines/reference/jsxParsingError1.symbols
index 752cfbb154da4..bc8d125842131 100644
--- a/tests/baselines/reference/jsxParsingError1.symbols
+++ b/tests/baselines/reference/jsxParsingError1.symbols
@@ -24,7 +24,7 @@ const class2 = "bar";
 
 const elem = <div className={class1, class2}/>;
 >elem : Symbol(elem, Decl(file.tsx, 10, 5))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >className : Symbol(className, Decl(file.tsx, 10, 17))
 >class1 : Symbol(class1, Decl(file.tsx, 8, 5))
 >class2 : Symbol(class2, Decl(file.tsx, 9, 5))
diff --git a/tests/baselines/reference/jsxParsingError2.symbols b/tests/baselines/reference/jsxParsingError2.symbols
index aec849631a9f3..09088f6a36767 100644
--- a/tests/baselines/reference/jsxParsingError2.symbols
+++ b/tests/baselines/reference/jsxParsingError2.symbols
@@ -19,34 +19,34 @@ declare module JSX {
 // Issue error about missing span closing tag, not missing div closing tag
 let x1 = <div><span></div>;
 >x1 : Symbol(x1, Decl(Error1.tsx, 1, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 === Error2.tsx ===
 let x2 = <div></span>;
 >x2 : Symbol(x2, Decl(Error2.tsx, 0, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 
 === Error3.tsx ===
 let x3 = <div>;
 >x3 : Symbol(x3, Decl(Error3.tsx, 0, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 
 === Error4.tsx ===
 let x4 = <div><div></span>;
 >x4 : Symbol(x4, Decl(Error4.tsx, 0, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 === Error5.tsx ===
 let x5 = <div><span>
 >x5 : Symbol(x5, Decl(Error5.tsx, 0, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 
diff --git a/tests/baselines/reference/jsxParsingError3.symbols b/tests/baselines/reference/jsxParsingError3.symbols
index 013c9bb2a002c..876355a9d6364 100644
--- a/tests/baselines/reference/jsxParsingError3.symbols
+++ b/tests/baselines/reference/jsxParsingError3.symbols
@@ -18,36 +18,36 @@ declare module JSX {
 === Error1.tsx ===
 let x1 = <div>}</div>;
 >x1 : Symbol(x1, Decl(Error1.tsx, 0, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 31))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 31))
 
 === Error2.tsx ===
 let x2 = <div>></div>;
 >x2 : Symbol(x2, Decl(Error2.tsx, 0, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 31))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 31))
 
 === Error3.tsx ===
 let x3 = <div>{"foo"}}</div>;
 >x3 : Symbol(x3, Decl(Error3.tsx, 0, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 31))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 31))
 
 === Error4.tsx ===
 let x4 = <div>{"foo"}></div>;
 >x4 : Symbol(x4, Decl(Error4.tsx, 0, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 31))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 31))
 
 === Error5.tsx ===
 let x5 = <div>}{"foo"}</div>;
 >x5 : Symbol(x5, Decl(Error5.tsx, 0, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 31))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 31))
 
 === Error6.tsx ===
 let x6 = <div>>{"foo"}</div>;
 >x6 : Symbol(x6, Decl(Error6.tsx, 0, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 31))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 31))
 
diff --git a/tests/baselines/reference/jsxParsingError4(strict=false).symbols b/tests/baselines/reference/jsxParsingError4(strict=false).symbols
index b26f56375f252..9c19e21888efc 100644
--- a/tests/baselines/reference/jsxParsingError4(strict=false).symbols
+++ b/tests/baselines/reference/jsxParsingError4(strict=false).symbols
@@ -19,8 +19,8 @@ const a = (
 >a : Symbol(a, Decl(a.tsx, 7, 5))
 
   <public-foo></public-foo>
->public-foo : Symbol(JSX.IntrinsicElements, Decl(a.tsx, 1, 23))
->public-foo : Symbol(JSX.IntrinsicElements, Decl(a.tsx, 1, 23))
+>public-foo : Symbol(JSX.IntrinsicElements.__index, Decl(a.tsx, 2, 33))
+>public-foo : Symbol(JSX.IntrinsicElements.__index, Decl(a.tsx, 2, 33))
 
 );
 
@@ -28,8 +28,8 @@ const b = (
 >b : Symbol(b, Decl(a.tsx, 11, 5))
 
   <public></public>
->public : Symbol(JSX.IntrinsicElements, Decl(a.tsx, 1, 23))
->public : Symbol(JSX.IntrinsicElements, Decl(a.tsx, 1, 23))
+>public : Symbol(JSX.IntrinsicElements.__index, Decl(a.tsx, 2, 33))
+>public : Symbol(JSX.IntrinsicElements.__index, Decl(a.tsx, 2, 33))
 
 );
 
diff --git a/tests/baselines/reference/jsxParsingError4(strict=true).symbols b/tests/baselines/reference/jsxParsingError4(strict=true).symbols
index b26f56375f252..9c19e21888efc 100644
--- a/tests/baselines/reference/jsxParsingError4(strict=true).symbols
+++ b/tests/baselines/reference/jsxParsingError4(strict=true).symbols
@@ -19,8 +19,8 @@ const a = (
 >a : Symbol(a, Decl(a.tsx, 7, 5))
 
   <public-foo></public-foo>
->public-foo : Symbol(JSX.IntrinsicElements, Decl(a.tsx, 1, 23))
->public-foo : Symbol(JSX.IntrinsicElements, Decl(a.tsx, 1, 23))
+>public-foo : Symbol(JSX.IntrinsicElements.__index, Decl(a.tsx, 2, 33))
+>public-foo : Symbol(JSX.IntrinsicElements.__index, Decl(a.tsx, 2, 33))
 
 );
 
@@ -28,8 +28,8 @@ const b = (
 >b : Symbol(b, Decl(a.tsx, 11, 5))
 
   <public></public>
->public : Symbol(JSX.IntrinsicElements, Decl(a.tsx, 1, 23))
->public : Symbol(JSX.IntrinsicElements, Decl(a.tsx, 1, 23))
+>public : Symbol(JSX.IntrinsicElements.__index, Decl(a.tsx, 2, 33))
+>public : Symbol(JSX.IntrinsicElements.__index, Decl(a.tsx, 2, 33))
 
 );
 
diff --git a/tests/baselines/reference/quickInfoOnJsxIntrinsicDeclaredUsingCatchCallIndexSignature.baseline b/tests/baselines/reference/quickInfoOnJsxIntrinsicDeclaredUsingCatchCallIndexSignature.baseline
new file mode 100644
index 0000000000000..4871481dcb4d7
--- /dev/null
+++ b/tests/baselines/reference/quickInfoOnJsxIntrinsicDeclaredUsingCatchCallIndexSignature.baseline
@@ -0,0 +1,74 @@
+=== /a.tsx ===
+// declare namespace JSX {
+//   interface IntrinsicElements { [elemName: string]: any; }
+// }
+// <div class="democlass" />;
+//  ^^^
+// | ----------------------------------------------------------------------
+// | (index) IntrinsicElements[string]: any
+// | ----------------------------------------------------------------------
+
+[
+  {
+    "marker": {
+      "fileName": "/a.tsx",
+      "position": 86,
+      "name": ""
+    },
+    "item": {
+      "kind": "index",
+      "kindModifiers": "declare",
+      "textSpan": {
+        "start": 86,
+        "length": 3
+      },
+      "displayParts": [
+        {
+          "text": "(",
+          "kind": "punctuation"
+        },
+        {
+          "text": "index",
+          "kind": "text"
+        },
+        {
+          "text": ")",
+          "kind": "punctuation"
+        },
+        {
+          "text": " ",
+          "kind": "space"
+        },
+        {
+          "text": "IntrinsicElements",
+          "kind": "interfaceName"
+        },
+        {
+          "text": "[",
+          "kind": "punctuation"
+        },
+        {
+          "text": "string",
+          "kind": "keyword"
+        },
+        {
+          "text": "]",
+          "kind": "punctuation"
+        },
+        {
+          "text": ":",
+          "kind": "punctuation"
+        },
+        {
+          "text": " ",
+          "kind": "space"
+        },
+        {
+          "text": "any",
+          "kind": "keyword"
+        }
+      ],
+      "documentation": []
+    }
+  }
+]
\ No newline at end of file
diff --git a/tests/baselines/reference/quickInfoOnJsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.baseline b/tests/baselines/reference/quickInfoOnJsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.baseline
new file mode 100644
index 0000000000000..9babfbe85687e
--- /dev/null
+++ b/tests/baselines/reference/quickInfoOnJsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.baseline
@@ -0,0 +1,184 @@
+=== /a.tsx ===
+// declare namespace JSX {
+//   interface IntrinsicElements {
+//     [k: `foo${string}`]: any;
+//     [k: `foobar${string}`]: any;
+//   }
+// }
+// <foobaz />;
+//  ^^^^^^
+// | ----------------------------------------------------------------------
+// | (index) IntrinsicElements[`foo${string}`]: any
+// | ----------------------------------------------------------------------
+// <foobarbaz />;
+//  ^^^^^^^^^
+// | ----------------------------------------------------------------------
+// | (index) IntrinsicElements[`foo${string}` | `foobar${string}`]: any
+// | ----------------------------------------------------------------------
+
+[
+  {
+    "marker": {
+      "fileName": "/a.tsx",
+      "position": 126,
+      "name": "1"
+    },
+    "item": {
+      "kind": "index",
+      "kindModifiers": "declare",
+      "textSpan": {
+        "start": 126,
+        "length": 6
+      },
+      "displayParts": [
+        {
+          "text": "(",
+          "kind": "punctuation"
+        },
+        {
+          "text": "index",
+          "kind": "text"
+        },
+        {
+          "text": ")",
+          "kind": "punctuation"
+        },
+        {
+          "text": " ",
+          "kind": "space"
+        },
+        {
+          "text": "IntrinsicElements",
+          "kind": "interfaceName"
+        },
+        {
+          "text": "[",
+          "kind": "punctuation"
+        },
+        {
+          "text": "`foo${",
+          "kind": "stringLiteral"
+        },
+        {
+          "text": "string",
+          "kind": "keyword"
+        },
+        {
+          "text": "}`",
+          "kind": "stringLiteral"
+        },
+        {
+          "text": "]",
+          "kind": "punctuation"
+        },
+        {
+          "text": ":",
+          "kind": "punctuation"
+        },
+        {
+          "text": " ",
+          "kind": "space"
+        },
+        {
+          "text": "any",
+          "kind": "keyword"
+        }
+      ],
+      "documentation": []
+    }
+  },
+  {
+    "marker": {
+      "fileName": "/a.tsx",
+      "position": 138,
+      "name": "2"
+    },
+    "item": {
+      "kind": "index",
+      "kindModifiers": "declare",
+      "textSpan": {
+        "start": 138,
+        "length": 9
+      },
+      "displayParts": [
+        {
+          "text": "(",
+          "kind": "punctuation"
+        },
+        {
+          "text": "index",
+          "kind": "text"
+        },
+        {
+          "text": ")",
+          "kind": "punctuation"
+        },
+        {
+          "text": " ",
+          "kind": "space"
+        },
+        {
+          "text": "IntrinsicElements",
+          "kind": "interfaceName"
+        },
+        {
+          "text": "[",
+          "kind": "punctuation"
+        },
+        {
+          "text": "`foo${",
+          "kind": "stringLiteral"
+        },
+        {
+          "text": "string",
+          "kind": "keyword"
+        },
+        {
+          "text": "}`",
+          "kind": "stringLiteral"
+        },
+        {
+          "text": " ",
+          "kind": "space"
+        },
+        {
+          "text": "|",
+          "kind": "punctuation"
+        },
+        {
+          "text": " ",
+          "kind": "space"
+        },
+        {
+          "text": "`foobar${",
+          "kind": "stringLiteral"
+        },
+        {
+          "text": "string",
+          "kind": "keyword"
+        },
+        {
+          "text": "}`",
+          "kind": "stringLiteral"
+        },
+        {
+          "text": "]",
+          "kind": "punctuation"
+        },
+        {
+          "text": ":",
+          "kind": "punctuation"
+        },
+        {
+          "text": " ",
+          "kind": "space"
+        },
+        {
+          "text": "any",
+          "kind": "keyword"
+        }
+      ],
+      "documentation": []
+    }
+  }
+]
\ No newline at end of file
diff --git a/tests/baselines/reference/reactJsxReactResolvedNodeNext.symbols b/tests/baselines/reference/reactJsxReactResolvedNodeNext.symbols
index b9da7f7d5d757..e2ddca8d016e8 100644
--- a/tests/baselines/reference/reactJsxReactResolvedNodeNext.symbols
+++ b/tests/baselines/reference/reactJsxReactResolvedNodeNext.symbols
@@ -3,8 +3,8 @@
 === file.tsx ===
 export const a = <div></div>;
 >a : Symbol(a, Decl(file.tsx, 0, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(index.d.ts, 0, 23))
->div : Symbol(JSX.IntrinsicElements, Decl(index.d.ts, 0, 23))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(index.d.ts, 1, 33))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(index.d.ts, 1, 33))
 
 === node_modules/@types/react/index.d.ts ===
 declare namespace JSX {
diff --git a/tests/baselines/reference/reactJsxReactResolvedNodeNextEsm.symbols b/tests/baselines/reference/reactJsxReactResolvedNodeNextEsm.symbols
index f63223109210f..5c5343253c544 100644
--- a/tests/baselines/reference/reactJsxReactResolvedNodeNextEsm.symbols
+++ b/tests/baselines/reference/reactJsxReactResolvedNodeNextEsm.symbols
@@ -3,8 +3,8 @@
 === file.tsx ===
 export const a = <div></div>;
 >a : Symbol(a, Decl(file.tsx, 0, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(index.d.ts, 0, 23))
->div : Symbol(JSX.IntrinsicElements, Decl(index.d.ts, 0, 23))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(index.d.ts, 1, 33))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(index.d.ts, 1, 33))
 
 === node_modules/@types/react/index.d.ts ===
 declare namespace JSX {
diff --git a/tests/baselines/reference/tsxElementResolution2.symbols b/tests/baselines/reference/tsxElementResolution2.symbols
index c575e429f78ba..21c96a733924d 100644
--- a/tests/baselines/reference/tsxElementResolution2.symbols
+++ b/tests/baselines/reference/tsxElementResolution2.symbols
@@ -17,9 +17,9 @@ declare module JSX {
 
 // OK
 <div />;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // OK
 <span />;
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
diff --git a/tests/baselines/reference/tsxElementResolution3.symbols b/tests/baselines/reference/tsxElementResolution3.symbols
index ad6d37edb6372..6f972c3e6a577 100644
--- a/tests/baselines/reference/tsxElementResolution3.symbols
+++ b/tests/baselines/reference/tsxElementResolution3.symbols
@@ -18,11 +18,11 @@ declare module JSX {
 
 // OK
 <div n='x' />;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >n : Symbol(n, Decl(file.tsx, 8, 4))
 
 // Error
 <span w='err' />;
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >w : Symbol(w, Decl(file.tsx, 11, 5))
 
diff --git a/tests/baselines/reference/tsxEmit1.symbols b/tests/baselines/reference/tsxEmit1.symbols
index 16dbafa979c71..7a0234d4bba0e 100644
--- a/tests/baselines/reference/tsxEmit1.symbols
+++ b/tests/baselines/reference/tsxEmit1.symbols
@@ -20,76 +20,76 @@ var p;
 
 var selfClosed1 = <div />;
 >selfClosed1 : Symbol(selfClosed1, Decl(file.tsx, 8, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var selfClosed2 = <div x="1" />;
 >selfClosed2 : Symbol(selfClosed2, Decl(file.tsx, 9, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(file.tsx, 9, 22))
 
 var selfClosed3 = <div x='1' />;
 >selfClosed3 : Symbol(selfClosed3, Decl(file.tsx, 10, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(file.tsx, 10, 22))
 
 var selfClosed4 = <div x="1" y='0' />;
 >selfClosed4 : Symbol(selfClosed4, Decl(file.tsx, 11, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(file.tsx, 11, 22))
 >y : Symbol(y, Decl(file.tsx, 11, 28))
 
 var selfClosed5 = <div x={0} y='0' />;
 >selfClosed5 : Symbol(selfClosed5, Decl(file.tsx, 12, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(file.tsx, 12, 22))
 >y : Symbol(y, Decl(file.tsx, 12, 28))
 
 var selfClosed6 = <div x={"1"} y='0' />;
 >selfClosed6 : Symbol(selfClosed6, Decl(file.tsx, 13, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(file.tsx, 13, 22))
 >y : Symbol(y, Decl(file.tsx, 13, 30))
 
 var selfClosed7 = <div x={p} y='p' />;
 >selfClosed7 : Symbol(selfClosed7, Decl(file.tsx, 14, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(file.tsx, 14, 22))
 >p : Symbol(p, Decl(file.tsx, 7, 3))
 >y : Symbol(y, Decl(file.tsx, 14, 28))
 
 var openClosed1 = <div></div>;
 >openClosed1 : Symbol(openClosed1, Decl(file.tsx, 16, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var openClosed2 = <div n='m'>foo</div>;
 >openClosed2 : Symbol(openClosed2, Decl(file.tsx, 17, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >n : Symbol(n, Decl(file.tsx, 17, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var openClosed3 = <div n='m'>{p}</div>;
 >openClosed3 : Symbol(openClosed3, Decl(file.tsx, 18, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >n : Symbol(n, Decl(file.tsx, 18, 22))
 >p : Symbol(p, Decl(file.tsx, 7, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var openClosed4 = <div n='m'>{p < p}</div>;
 >openClosed4 : Symbol(openClosed4, Decl(file.tsx, 19, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >n : Symbol(n, Decl(file.tsx, 19, 22))
 >p : Symbol(p, Decl(file.tsx, 7, 3))
 >p : Symbol(p, Decl(file.tsx, 7, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var openClosed5 = <div n='m'>{p > p}</div>;
 >openClosed5 : Symbol(openClosed5, Decl(file.tsx, 20, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >n : Symbol(n, Decl(file.tsx, 20, 22))
 >p : Symbol(p, Decl(file.tsx, 7, 3))
 >p : Symbol(p, Decl(file.tsx, 7, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 class SomeClass {
 >SomeClass : Symbol(SomeClass, Decl(file.tsx, 20, 43))
@@ -99,67 +99,67 @@ class SomeClass {
 
 		var rewrites1 = <div>{() => this}</div>;
 >rewrites1 : Symbol(rewrites1, Decl(file.tsx, 24, 5))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >this : Symbol(SomeClass, Decl(file.tsx, 20, 43))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 		var rewrites2 = <div>{[p, ...p, p]}</div>;
 >rewrites2 : Symbol(rewrites2, Decl(file.tsx, 25, 5))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >p : Symbol(p, Decl(file.tsx, 7, 3))
 >p : Symbol(p, Decl(file.tsx, 7, 3))
 >p : Symbol(p, Decl(file.tsx, 7, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 		var rewrites3 = <div>{{p}}</div>;
 >rewrites3 : Symbol(rewrites3, Decl(file.tsx, 26, 5))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >p : Symbol(p, Decl(file.tsx, 26, 25))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 		var rewrites4 = <div a={() => this}></div>;
 >rewrites4 : Symbol(rewrites4, Decl(file.tsx, 28, 5))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >a : Symbol(a, Decl(file.tsx, 28, 22))
 >this : Symbol(SomeClass, Decl(file.tsx, 20, 43))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 		var rewrites5 = <div a={[p, ...p, p]}></div>;
 >rewrites5 : Symbol(rewrites5, Decl(file.tsx, 29, 5))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >a : Symbol(a, Decl(file.tsx, 29, 22))
 >p : Symbol(p, Decl(file.tsx, 7, 3))
 >p : Symbol(p, Decl(file.tsx, 7, 3))
 >p : Symbol(p, Decl(file.tsx, 7, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 		var rewrites6 = <div a={{p}}></div>;
 >rewrites6 : Symbol(rewrites6, Decl(file.tsx, 30, 5))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >a : Symbol(a, Decl(file.tsx, 30, 22))
 >p : Symbol(p, Decl(file.tsx, 30, 27))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 	}
 }
 
 var whitespace1 = <div>      </div>;
 >whitespace1 : Symbol(whitespace1, Decl(file.tsx, 34, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var whitespace2 = <div>  {p}    </div>;
 >whitespace2 : Symbol(whitespace2, Decl(file.tsx, 35, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >p : Symbol(p, Decl(file.tsx, 7, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var whitespace3 = <div>  
 >whitespace3 : Symbol(whitespace3, Decl(file.tsx, 36, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
       {p}    
 >p : Symbol(p, Decl(file.tsx, 7, 3))
 
       </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
diff --git a/tests/baselines/reference/tsxEmit2.symbols b/tests/baselines/reference/tsxEmit2.symbols
index eda1e5c3c9d79..637c3a778946c 100644
--- a/tests/baselines/reference/tsxEmit2.symbols
+++ b/tests/baselines/reference/tsxEmit2.symbols
@@ -22,44 +22,44 @@ var p1: any, p2: any, p3: any;
 
 var spreads1 = <div {...p1}>{p2}</div>;
 >spreads1 : Symbol(spreads1, Decl(file.tsx, 8, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >p1 : Symbol(p1, Decl(file.tsx, 7, 3))
 >p2 : Symbol(p2, Decl(file.tsx, 7, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var spreads2 = <div {...p1}>{p2}</div>;
 >spreads2 : Symbol(spreads2, Decl(file.tsx, 9, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >p1 : Symbol(p1, Decl(file.tsx, 7, 3))
 >p2 : Symbol(p2, Decl(file.tsx, 7, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var spreads3 = <div x={p3} {...p1}>{p2}</div>;
 >spreads3 : Symbol(spreads3, Decl(file.tsx, 10, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(file.tsx, 10, 19))
 >p3 : Symbol(p3, Decl(file.tsx, 7, 21))
 >p1 : Symbol(p1, Decl(file.tsx, 7, 3))
 >p2 : Symbol(p2, Decl(file.tsx, 7, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var spreads4 = <div {...p1} x={p3} >{p2}</div>;
 >spreads4 : Symbol(spreads4, Decl(file.tsx, 11, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >p1 : Symbol(p1, Decl(file.tsx, 7, 3))
 >x : Symbol(x, Decl(file.tsx, 11, 27))
 >p3 : Symbol(p3, Decl(file.tsx, 7, 21))
 >p2 : Symbol(p2, Decl(file.tsx, 7, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var spreads5 = <div x={p2} {...p1} y={p3}>{p2}</div>;
 >spreads5 : Symbol(spreads5, Decl(file.tsx, 12, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(file.tsx, 12, 19))
 >p2 : Symbol(p2, Decl(file.tsx, 7, 12))
 >p1 : Symbol(p1, Decl(file.tsx, 7, 3))
 >y : Symbol(y, Decl(file.tsx, 12, 34))
 >p3 : Symbol(p3, Decl(file.tsx, 7, 21))
 >p2 : Symbol(p2, Decl(file.tsx, 7, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
diff --git a/tests/baselines/reference/tsxFragmentPreserveEmit.symbols b/tests/baselines/reference/tsxFragmentPreserveEmit.symbols
index 2da8e928fdde9..b667919968e5d 100644
--- a/tests/baselines/reference/tsxFragmentPreserveEmit.symbols
+++ b/tests/baselines/reference/tsxFragmentPreserveEmit.symbols
@@ -22,19 +22,19 @@ declare var React: any;
 < /*starting wrap*/ ></ /*ending wrap*/>; // comments in the tags
 <>hi</>; // text inside
 <><span>hi</span><div>bye</div></>; // children
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 <><span>1</span><><span>2.1</span><span>2.2</span></><span>3</span></>; // nested fragments
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 <>#</>; // # would cause scanning error if not in jsxtext
diff --git a/tests/baselines/reference/tsxFragmentReactEmit.symbols b/tests/baselines/reference/tsxFragmentReactEmit.symbols
index 9f0b0f7c41ad6..b569e98108b09 100644
--- a/tests/baselines/reference/tsxFragmentReactEmit.symbols
+++ b/tests/baselines/reference/tsxFragmentReactEmit.symbols
@@ -22,19 +22,19 @@ declare var React: any;
 < /*starting wrap*/ ></ /*ending wrap*/>; // comments in the tags
 <>hi</>; // text inside
 <><span>hi</span><div>bye</div></>; // children
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 <><span>1</span><><span>2.1</span><span>2.2</span></><span>3</span></>; // nested fragments
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->span : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>span : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 <>#</>; // # would cause scanning error if not in jsxtext
diff --git a/tests/baselines/reference/tsxReactEmit1.symbols b/tests/baselines/reference/tsxReactEmit1.symbols
index cc4e653b76828..036fcf113731e 100644
--- a/tests/baselines/reference/tsxReactEmit1.symbols
+++ b/tests/baselines/reference/tsxReactEmit1.symbols
@@ -22,39 +22,39 @@ var p;
 
 var selfClosed1 = <div />;
 >selfClosed1 : Symbol(selfClosed1, Decl(file.tsx, 9, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var selfClosed2 = <div x="1" />;
 >selfClosed2 : Symbol(selfClosed2, Decl(file.tsx, 10, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(file.tsx, 10, 22))
 
 var selfClosed3 = <div x='1' />;
 >selfClosed3 : Symbol(selfClosed3, Decl(file.tsx, 11, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(file.tsx, 11, 22))
 
 var selfClosed4 = <div x="1" y='0' />;
 >selfClosed4 : Symbol(selfClosed4, Decl(file.tsx, 12, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(file.tsx, 12, 22))
 >y : Symbol(y, Decl(file.tsx, 12, 28))
 
 var selfClosed5 = <div x={0} y='0' />;
 >selfClosed5 : Symbol(selfClosed5, Decl(file.tsx, 13, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(file.tsx, 13, 22))
 >y : Symbol(y, Decl(file.tsx, 13, 28))
 
 var selfClosed6 = <div x={"1"} y='0' />;
 >selfClosed6 : Symbol(selfClosed6, Decl(file.tsx, 14, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(file.tsx, 14, 22))
 >y : Symbol(y, Decl(file.tsx, 14, 30))
 
 var selfClosed7 = <div x={p} y='p' b />;
 >selfClosed7 : Symbol(selfClosed7, Decl(file.tsx, 15, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(file.tsx, 15, 22))
 >p : Symbol(p, Decl(file.tsx, 8, 3))
 >y : Symbol(y, Decl(file.tsx, 15, 28))
@@ -62,38 +62,38 @@ var selfClosed7 = <div x={p} y='p' b />;
 
 var openClosed1 = <div></div>;
 >openClosed1 : Symbol(openClosed1, Decl(file.tsx, 17, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var openClosed2 = <div n='m'>foo</div>;
 >openClosed2 : Symbol(openClosed2, Decl(file.tsx, 18, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >n : Symbol(n, Decl(file.tsx, 18, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var openClosed3 = <div n='m'>{p}</div>;
 >openClosed3 : Symbol(openClosed3, Decl(file.tsx, 19, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >n : Symbol(n, Decl(file.tsx, 19, 22))
 >p : Symbol(p, Decl(file.tsx, 8, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var openClosed4 = <div n='m'>{p < p}</div>;
 >openClosed4 : Symbol(openClosed4, Decl(file.tsx, 20, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >n : Symbol(n, Decl(file.tsx, 20, 22))
 >p : Symbol(p, Decl(file.tsx, 8, 3))
 >p : Symbol(p, Decl(file.tsx, 8, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var openClosed5 = <div n='m' b>{p > p}</div>;
 >openClosed5 : Symbol(openClosed5, Decl(file.tsx, 21, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >n : Symbol(n, Decl(file.tsx, 21, 22))
 >b : Symbol(b, Decl(file.tsx, 21, 28))
 >p : Symbol(p, Decl(file.tsx, 8, 3))
 >p : Symbol(p, Decl(file.tsx, 8, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 class SomeClass {
 >SomeClass : Symbol(SomeClass, Decl(file.tsx, 21, 45))
@@ -103,67 +103,67 @@ class SomeClass {
 
 		var rewrites1 = <div>{() => this}</div>;
 >rewrites1 : Symbol(rewrites1, Decl(file.tsx, 25, 5))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >this : Symbol(SomeClass, Decl(file.tsx, 21, 45))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 		var rewrites2 = <div>{[p, ...p, p]}</div>;
 >rewrites2 : Symbol(rewrites2, Decl(file.tsx, 26, 5))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >p : Symbol(p, Decl(file.tsx, 8, 3))
 >p : Symbol(p, Decl(file.tsx, 8, 3))
 >p : Symbol(p, Decl(file.tsx, 8, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 		var rewrites3 = <div>{{p}}</div>;
 >rewrites3 : Symbol(rewrites3, Decl(file.tsx, 27, 5))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >p : Symbol(p, Decl(file.tsx, 27, 25))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 		var rewrites4 = <div a={() => this}></div>;
 >rewrites4 : Symbol(rewrites4, Decl(file.tsx, 29, 5))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >a : Symbol(a, Decl(file.tsx, 29, 22))
 >this : Symbol(SomeClass, Decl(file.tsx, 21, 45))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 		var rewrites5 = <div a={[p, ...p, p]}></div>;
 >rewrites5 : Symbol(rewrites5, Decl(file.tsx, 30, 5))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >a : Symbol(a, Decl(file.tsx, 30, 22))
 >p : Symbol(p, Decl(file.tsx, 8, 3))
 >p : Symbol(p, Decl(file.tsx, 8, 3))
 >p : Symbol(p, Decl(file.tsx, 8, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 		var rewrites6 = <div a={{p}}></div>;
 >rewrites6 : Symbol(rewrites6, Decl(file.tsx, 31, 5))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >a : Symbol(a, Decl(file.tsx, 31, 22))
 >p : Symbol(p, Decl(file.tsx, 31, 27))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 	}
 }
 
 var whitespace1 = <div>      </div>;
 >whitespace1 : Symbol(whitespace1, Decl(file.tsx, 35, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var whitespace2 = <div>  {p}    </div>;
 >whitespace2 : Symbol(whitespace2, Decl(file.tsx, 36, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >p : Symbol(p, Decl(file.tsx, 8, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var whitespace3 = <div>  
 >whitespace3 : Symbol(whitespace3, Decl(file.tsx, 37, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
       {p}    
 >p : Symbol(p, Decl(file.tsx, 8, 3))
 
       </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
diff --git a/tests/baselines/reference/tsxReactEmit2.symbols b/tests/baselines/reference/tsxReactEmit2.symbols
index 22c21c14e5b61..b119f4e86b401 100644
--- a/tests/baselines/reference/tsxReactEmit2.symbols
+++ b/tests/baselines/reference/tsxReactEmit2.symbols
@@ -24,44 +24,44 @@ var p1: any, p2: any, p3: any;
 
 var spreads1 = <div {...p1}>{p2}</div>;
 >spreads1 : Symbol(spreads1, Decl(file.tsx, 9, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >p1 : Symbol(p1, Decl(file.tsx, 8, 3))
 >p2 : Symbol(p2, Decl(file.tsx, 8, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var spreads2 = <div {...p1}>{p2}</div>;
 >spreads2 : Symbol(spreads2, Decl(file.tsx, 10, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >p1 : Symbol(p1, Decl(file.tsx, 8, 3))
 >p2 : Symbol(p2, Decl(file.tsx, 8, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var spreads3 = <div x={p3} {...p1}>{p2}</div>;
 >spreads3 : Symbol(spreads3, Decl(file.tsx, 11, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(file.tsx, 11, 19))
 >p3 : Symbol(p3, Decl(file.tsx, 8, 21))
 >p1 : Symbol(p1, Decl(file.tsx, 8, 3))
 >p2 : Symbol(p2, Decl(file.tsx, 8, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var spreads4 = <div {...p1} x={p3} >{p2}</div>;
 >spreads4 : Symbol(spreads4, Decl(file.tsx, 12, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >p1 : Symbol(p1, Decl(file.tsx, 8, 3))
 >x : Symbol(x, Decl(file.tsx, 12, 27))
 >p3 : Symbol(p3, Decl(file.tsx, 8, 21))
 >p2 : Symbol(p2, Decl(file.tsx, 8, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var spreads5 = <div x={p2} {...p1} y={p3}>{p2}</div>;
 >spreads5 : Symbol(spreads5, Decl(file.tsx, 13, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(file.tsx, 13, 19))
 >p2 : Symbol(p2, Decl(file.tsx, 8, 12))
 >p1 : Symbol(p1, Decl(file.tsx, 8, 3))
 >y : Symbol(y, Decl(file.tsx, 13, 34))
 >p3 : Symbol(p3, Decl(file.tsx, 8, 21))
 >p2 : Symbol(p2, Decl(file.tsx, 8, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
diff --git a/tests/baselines/reference/tsxReactEmit4.symbols b/tests/baselines/reference/tsxReactEmit4.symbols
index a78763c0e22b9..f22e9b44ce3b1 100644
--- a/tests/baselines/reference/tsxReactEmit4.symbols
+++ b/tests/baselines/reference/tsxReactEmit4.symbols
@@ -22,17 +22,17 @@ var p: any;
 
 var openClosed1 = <div>
 >openClosed1 : Symbol(openClosed1, Decl(file.tsx, 9, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
    {blah}
 
 </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // Should emit React.__spread({}, p, {x: 0})
 var spread1 = <div {...p} x={0} />;
 >spread1 : Symbol(spread1, Decl(file.tsx, 16, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >p : Symbol(p, Decl(file.tsx, 8, 3))
 >x : Symbol(x, Decl(file.tsx, 16, 25))
 
diff --git a/tests/baselines/reference/tsxReactEmit5.symbols b/tests/baselines/reference/tsxReactEmit5.symbols
index e72bcd941c265..76db22e9d1613 100644
--- a/tests/baselines/reference/tsxReactEmit5.symbols
+++ b/tests/baselines/reference/tsxReactEmit5.symbols
@@ -30,7 +30,7 @@ var foo: any;
 
 var spread1 = <div x='' {...foo} y='' />;
 >spread1 : Symbol(spread1, Decl(react-consumer.tsx, 4, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(react-consumer.tsx, 4, 18))
 >foo : Symbol(foo, Decl(react-consumer.tsx, 3, 3))
 >y : Symbol(y, Decl(react-consumer.tsx, 4, 32))
diff --git a/tests/baselines/reference/tsxReactEmit6.symbols b/tests/baselines/reference/tsxReactEmit6.symbols
index 87b536172c359..02927cb0966f5 100644
--- a/tests/baselines/reference/tsxReactEmit6.symbols
+++ b/tests/baselines/reference/tsxReactEmit6.symbols
@@ -33,7 +33,7 @@ namespace M {
 
 	var spread1 = <div x='' {...foo} y='' />;
 >spread1 : Symbol(spread1, Decl(react-consumer.tsx, 8, 4))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(react-consumer.tsx, 8, 19))
 >foo : Symbol(foo, Decl(react-consumer.tsx, 7, 4))
 >y : Symbol(y, Decl(react-consumer.tsx, 8, 33))
@@ -41,8 +41,8 @@ namespace M {
 	// Quotes
 	var x = <div>This "quote" thing</div>;
 >x : Symbol(x, Decl(react-consumer.tsx, 11, 4))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 }
 
 
diff --git a/tests/baselines/reference/tsxReactEmit7.symbols b/tests/baselines/reference/tsxReactEmit7.symbols
index ae9747ab9f39e..efb7e1a6836fc 100644
--- a/tests/baselines/reference/tsxReactEmit7.symbols
+++ b/tests/baselines/reference/tsxReactEmit7.symbols
@@ -17,56 +17,56 @@ declare module JSX {
 
 var m = <div x-y="val"></div>;
 >m : Symbol(m, Decl(file.tsx, 7, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x-y : Symbol(x-y, Decl(file.tsx, 7, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var n = <div xx-y="val"></div>;
 >n : Symbol(n, Decl(file.tsx, 8, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >xx-y : Symbol(xx-y, Decl(file.tsx, 8, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var o = <div x-yy="val"></div>;
 >o : Symbol(o, Decl(file.tsx, 9, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x-yy : Symbol(x-yy, Decl(file.tsx, 9, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var p = <div xx-yy="val"></div>;
 >p : Symbol(p, Decl(file.tsx, 10, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >xx-yy : Symbol(xx-yy, Decl(file.tsx, 10, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // Investigation
 var a = <div x="val"></div>;
 >a : Symbol(a, Decl(file.tsx, 13, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >x : Symbol(x, Decl(file.tsx, 13, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var b = <div xx="val"></div>;
 >b : Symbol(b, Decl(file.tsx, 14, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >xx : Symbol(xx, Decl(file.tsx, 14, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var c = <div xxx="val"></div>;
 >c : Symbol(c, Decl(file.tsx, 15, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >xxx : Symbol(xxx, Decl(file.tsx, 15, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var d = <div xxxx="val"></div>;
 >d : Symbol(d, Decl(file.tsx, 16, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >xxxx : Symbol(xxxx, Decl(file.tsx, 16, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 var e = <div xxxxx="val"></div>;
 >e : Symbol(e, Decl(file.tsx, 17, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >xxxxx : Symbol(xxxxx, Decl(file.tsx, 17, 12))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
diff --git a/tests/baselines/reference/tsxReactEmitEntities.symbols b/tests/baselines/reference/tsxReactEmitEntities.symbols
index 4b8e4e5f2a423..7f243f7858a62 100644
--- a/tests/baselines/reference/tsxReactEmitEntities.symbols
+++ b/tests/baselines/reference/tsxReactEmitEntities.symbols
@@ -18,42 +18,42 @@ declare var React: any;
 >React : Symbol(React, Decl(file.tsx, 6, 11))
 
 <div>Dot goes here: &middot; &notAnEntity; </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 <div>Be careful of &quot;-ed strings!</div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 <div>&#0123;&#123;braces&#x7d;&#x7D;</div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // Escapes do nothing
 <div>\n</div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // Also works in string literal attributes
 <div attr="&#0123;&hellip;&#x7D;\"></div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >attr : Symbol(attr, Decl(file.tsx, 15, 4))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // Does not happen for a string literal that happens to be inside an attribute (and escapes then work)
 <div attr={"&#0123;&hellip;&#x7D;\""}></div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >attr : Symbol(attr, Decl(file.tsx, 17, 4))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // Preserves single quotes
 <div attr='"'></div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >attr : Symbol(attr, Decl(file.tsx, 19, 4))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // https://github.com/microsoft/TypeScript/issues/35732
 <div>&#x1F408;&#x1F415;&#128007;&#128017;</div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
diff --git a/tests/baselines/reference/tsxReactEmitWhitespace.symbols b/tests/baselines/reference/tsxReactEmitWhitespace.symbols
index 47d42df3cd6c6..2746b9763d7e7 100644
--- a/tests/baselines/reference/tsxReactEmitWhitespace.symbols
+++ b/tests/baselines/reference/tsxReactEmitWhitespace.symbols
@@ -25,88 +25,88 @@ var p = 0;
 
 // Emit "   "
 <div>   </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // Emit "  ", p, "   "
 <div>  {p}    </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 >p : Symbol(p, Decl(file.tsx, 11, 3))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // Emit only p
 <div>  
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
       {p}    
 >p : Symbol(p, Decl(file.tsx, 11, 3))
 
       </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // Emit only p
 <div>
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
   {p}
 >p : Symbol(p, Decl(file.tsx, 11, 3))
 
     </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // Emit "  3"
 <div>  3  
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
   </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // Emit "  3  "
 <div>  3  </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // Emit "3"
 <div>   
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
    3    
    </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // Emit no args
 <div>   
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
    </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // Emit "foo bar"
 <div>  
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
    foo
 
  bar   
 
   </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // Emit "hello\\ world"
 <div>
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
     hello\
 
 world
 </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // Emit "  a b  c d  "
 <div>  a
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
     b  c
     d  </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
diff --git a/tests/baselines/reference/tsxReactEmitWhitespace2.symbols b/tests/baselines/reference/tsxReactEmitWhitespace2.symbols
index f8a9e57c667c7..2df31b45ee0c7 100644
--- a/tests/baselines/reference/tsxReactEmitWhitespace2.symbols
+++ b/tests/baselines/reference/tsxReactEmitWhitespace2.symbols
@@ -19,22 +19,22 @@ declare var React: any;
 
 // Emit ' word' in the last string
 <div>word <code>code</code> word</div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->code : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->code : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>code : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>code : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // Same here
 <div><code>code</code> word</div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->code : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->code : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>code : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>code : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 // And here
 <div><code /> word</div>;
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->code : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
->div : Symbol(JSX.IntrinsicElements, Decl(file.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>code : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(file.tsx, 2, 30))
 
 
diff --git a/tests/baselines/reference/tsxSpreadChildren.symbols b/tests/baselines/reference/tsxSpreadChildren.symbols
index d712d02d709f1..ae5e83619b057 100644
--- a/tests/baselines/reference/tsxSpreadChildren.symbols
+++ b/tests/baselines/reference/tsxSpreadChildren.symbols
@@ -40,7 +40,7 @@ function Todo(prop: { key: number, todo: string }) {
 >todo : Symbol(todo, Decl(tsxSpreadChildren.tsx, 15, 34))
 
     return <div>{prop.key.toString() + prop.todo}</div>;
->div : Symbol(JSX.IntrinsicElements, Decl(tsxSpreadChildren.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(tsxSpreadChildren.tsx, 2, 30))
 >prop.key.toString : Symbol(Number.toString, Decl(lib.es5.d.ts, --, --))
 >prop.key : Symbol(key, Decl(tsxSpreadChildren.tsx, 15, 21))
 >prop : Symbol(prop, Decl(tsxSpreadChildren.tsx, 15, 14))
@@ -49,7 +49,7 @@ function Todo(prop: { key: number, todo: string }) {
 >prop.todo : Symbol(todo, Decl(tsxSpreadChildren.tsx, 15, 34))
 >prop : Symbol(prop, Decl(tsxSpreadChildren.tsx, 15, 14))
 >todo : Symbol(todo, Decl(tsxSpreadChildren.tsx, 15, 34))
->div : Symbol(JSX.IntrinsicElements, Decl(tsxSpreadChildren.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(tsxSpreadChildren.tsx, 2, 30))
 }
 function TodoList({ todos }: TodoListProps) {
 >TodoList : Symbol(TodoList, Decl(tsxSpreadChildren.tsx, 17, 1))
@@ -57,7 +57,7 @@ function TodoList({ todos }: TodoListProps) {
 >TodoListProps : Symbol(TodoListProps, Decl(tsxSpreadChildren.tsx, 11, 1))
 
     return <div>
->div : Symbol(JSX.IntrinsicElements, Decl(tsxSpreadChildren.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(tsxSpreadChildren.tsx, 2, 30))
 
         {...todos.map(todo => <Todo key={todo.id} todo={todo.todo}/>)}
 >todos.map : Symbol(Array.map, Decl(lib.es5.d.ts, --, --))
@@ -75,7 +75,7 @@ function TodoList({ todos }: TodoListProps) {
 >todo : Symbol(TodoProp.todo, Decl(tsxSpreadChildren.tsx, 9, 15))
 
     </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(tsxSpreadChildren.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(tsxSpreadChildren.tsx, 2, 30))
 }
 let x: TodoListProps;
 >x : Symbol(x, Decl(tsxSpreadChildren.tsx, 23, 3))
diff --git a/tests/baselines/reference/tsxSpreadChildrenInvalidType(jsx=react,target=es2015).symbols b/tests/baselines/reference/tsxSpreadChildrenInvalidType(jsx=react,target=es2015).symbols
index 3df2056b35c28..4483c730fdb69 100644
--- a/tests/baselines/reference/tsxSpreadChildrenInvalidType(jsx=react,target=es2015).symbols
+++ b/tests/baselines/reference/tsxSpreadChildrenInvalidType(jsx=react,target=es2015).symbols
@@ -40,7 +40,7 @@ function Todo(prop: { key: number, todo: string }) {
 >todo : Symbol(todo, Decl(tsxSpreadChildrenInvalidType.tsx, 15, 34))
 
     return <div>{prop.key.toString() + prop.todo}</div>;
->div : Symbol(JSX.IntrinsicElements, Decl(tsxSpreadChildrenInvalidType.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(tsxSpreadChildrenInvalidType.tsx, 2, 30))
 >prop.key.toString : Symbol(Number.toString, Decl(lib.es5.d.ts, --, --))
 >prop.key : Symbol(key, Decl(tsxSpreadChildrenInvalidType.tsx, 15, 21))
 >prop : Symbol(prop, Decl(tsxSpreadChildrenInvalidType.tsx, 15, 14))
@@ -49,7 +49,7 @@ function Todo(prop: { key: number, todo: string }) {
 >prop.todo : Symbol(todo, Decl(tsxSpreadChildrenInvalidType.tsx, 15, 34))
 >prop : Symbol(prop, Decl(tsxSpreadChildrenInvalidType.tsx, 15, 14))
 >todo : Symbol(todo, Decl(tsxSpreadChildrenInvalidType.tsx, 15, 34))
->div : Symbol(JSX.IntrinsicElements, Decl(tsxSpreadChildrenInvalidType.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(tsxSpreadChildrenInvalidType.tsx, 2, 30))
 }
 function TodoList({ todos }: TodoListProps) {
 >TodoList : Symbol(TodoList, Decl(tsxSpreadChildrenInvalidType.tsx, 17, 1))
@@ -57,7 +57,7 @@ function TodoList({ todos }: TodoListProps) {
 >TodoListProps : Symbol(TodoListProps, Decl(tsxSpreadChildrenInvalidType.tsx, 11, 1))
 
     return <div>
->div : Symbol(JSX.IntrinsicElements, Decl(tsxSpreadChildrenInvalidType.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(tsxSpreadChildrenInvalidType.tsx, 2, 30))
 
         {...<Todo key={todos[0].id} todo={todos[0].todo} />}
 >Todo : Symbol(Todo, Decl(tsxSpreadChildrenInvalidType.tsx, 14, 1))
@@ -71,7 +71,7 @@ function TodoList({ todos }: TodoListProps) {
 >todo : Symbol(TodoProp.todo, Decl(tsxSpreadChildrenInvalidType.tsx, 9, 15))
 
     </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(tsxSpreadChildrenInvalidType.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(tsxSpreadChildrenInvalidType.tsx, 2, 30))
 }
 function TodoListNoError({ todos }: TodoListProps) {
 >TodoListNoError : Symbol(TodoListNoError, Decl(tsxSpreadChildrenInvalidType.tsx, 22, 1))
@@ -80,7 +80,7 @@ function TodoListNoError({ todos }: TodoListProps) {
 
     // any is not checked
     return <div>
->div : Symbol(JSX.IntrinsicElements, Decl(tsxSpreadChildrenInvalidType.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(tsxSpreadChildrenInvalidType.tsx, 2, 30))
 
         {...(<Todo key={todos[0].id} todo={todos[0].todo} /> as any)}
 >Todo : Symbol(Todo, Decl(tsxSpreadChildrenInvalidType.tsx, 14, 1))
@@ -94,7 +94,7 @@ function TodoListNoError({ todos }: TodoListProps) {
 >todo : Symbol(TodoProp.todo, Decl(tsxSpreadChildrenInvalidType.tsx, 9, 15))
 
     </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(tsxSpreadChildrenInvalidType.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(tsxSpreadChildrenInvalidType.tsx, 2, 30))
 }
 let x: TodoListProps;
 >x : Symbol(x, Decl(tsxSpreadChildrenInvalidType.tsx, 29, 3))
diff --git a/tests/baselines/reference/tsxSpreadChildrenInvalidType(jsx=react,target=es5).symbols b/tests/baselines/reference/tsxSpreadChildrenInvalidType(jsx=react,target=es5).symbols
index 3df2056b35c28..4483c730fdb69 100644
--- a/tests/baselines/reference/tsxSpreadChildrenInvalidType(jsx=react,target=es5).symbols
+++ b/tests/baselines/reference/tsxSpreadChildrenInvalidType(jsx=react,target=es5).symbols
@@ -40,7 +40,7 @@ function Todo(prop: { key: number, todo: string }) {
 >todo : Symbol(todo, Decl(tsxSpreadChildrenInvalidType.tsx, 15, 34))
 
     return <div>{prop.key.toString() + prop.todo}</div>;
->div : Symbol(JSX.IntrinsicElements, Decl(tsxSpreadChildrenInvalidType.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(tsxSpreadChildrenInvalidType.tsx, 2, 30))
 >prop.key.toString : Symbol(Number.toString, Decl(lib.es5.d.ts, --, --))
 >prop.key : Symbol(key, Decl(tsxSpreadChildrenInvalidType.tsx, 15, 21))
 >prop : Symbol(prop, Decl(tsxSpreadChildrenInvalidType.tsx, 15, 14))
@@ -49,7 +49,7 @@ function Todo(prop: { key: number, todo: string }) {
 >prop.todo : Symbol(todo, Decl(tsxSpreadChildrenInvalidType.tsx, 15, 34))
 >prop : Symbol(prop, Decl(tsxSpreadChildrenInvalidType.tsx, 15, 14))
 >todo : Symbol(todo, Decl(tsxSpreadChildrenInvalidType.tsx, 15, 34))
->div : Symbol(JSX.IntrinsicElements, Decl(tsxSpreadChildrenInvalidType.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(tsxSpreadChildrenInvalidType.tsx, 2, 30))
 }
 function TodoList({ todos }: TodoListProps) {
 >TodoList : Symbol(TodoList, Decl(tsxSpreadChildrenInvalidType.tsx, 17, 1))
@@ -57,7 +57,7 @@ function TodoList({ todos }: TodoListProps) {
 >TodoListProps : Symbol(TodoListProps, Decl(tsxSpreadChildrenInvalidType.tsx, 11, 1))
 
     return <div>
->div : Symbol(JSX.IntrinsicElements, Decl(tsxSpreadChildrenInvalidType.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(tsxSpreadChildrenInvalidType.tsx, 2, 30))
 
         {...<Todo key={todos[0].id} todo={todos[0].todo} />}
 >Todo : Symbol(Todo, Decl(tsxSpreadChildrenInvalidType.tsx, 14, 1))
@@ -71,7 +71,7 @@ function TodoList({ todos }: TodoListProps) {
 >todo : Symbol(TodoProp.todo, Decl(tsxSpreadChildrenInvalidType.tsx, 9, 15))
 
     </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(tsxSpreadChildrenInvalidType.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(tsxSpreadChildrenInvalidType.tsx, 2, 30))
 }
 function TodoListNoError({ todos }: TodoListProps) {
 >TodoListNoError : Symbol(TodoListNoError, Decl(tsxSpreadChildrenInvalidType.tsx, 22, 1))
@@ -80,7 +80,7 @@ function TodoListNoError({ todos }: TodoListProps) {
 
     // any is not checked
     return <div>
->div : Symbol(JSX.IntrinsicElements, Decl(tsxSpreadChildrenInvalidType.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(tsxSpreadChildrenInvalidType.tsx, 2, 30))
 
         {...(<Todo key={todos[0].id} todo={todos[0].todo} /> as any)}
 >Todo : Symbol(Todo, Decl(tsxSpreadChildrenInvalidType.tsx, 14, 1))
@@ -94,7 +94,7 @@ function TodoListNoError({ todos }: TodoListProps) {
 >todo : Symbol(TodoProp.todo, Decl(tsxSpreadChildrenInvalidType.tsx, 9, 15))
 
     </div>;
->div : Symbol(JSX.IntrinsicElements, Decl(tsxSpreadChildrenInvalidType.tsx, 1, 22))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(tsxSpreadChildrenInvalidType.tsx, 2, 30))
 }
 let x: TodoListProps;
 >x : Symbol(x, Decl(tsxSpreadChildrenInvalidType.tsx, 29, 3))
diff --git a/tests/baselines/reference/tsxSpreadInvalidType.symbols b/tests/baselines/reference/tsxSpreadInvalidType.symbols
index 223812737e150..99f4dcbd52900 100644
--- a/tests/baselines/reference/tsxSpreadInvalidType.symbols
+++ b/tests/baselines/reference/tsxSpreadInvalidType.symbols
@@ -21,16 +21,16 @@ const c = undefined;
 
 const d = <div { ...a } />
 >d : Symbol(d, Decl(a.tsx, 8, 5))
->div : Symbol(JSX.IntrinsicElements, Decl(a.tsx, 0, 15))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(a.tsx, 1, 40))
 >a : Symbol(a, Decl(a.tsx, 4, 5))
 
 const e = <div { ...b } />
 >e : Symbol(e, Decl(a.tsx, 9, 5))
->div : Symbol(JSX.IntrinsicElements, Decl(a.tsx, 0, 15))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(a.tsx, 1, 40))
 >b : Symbol(b, Decl(a.tsx, 5, 5))
 
 const f = <div { ...c } />
 >f : Symbol(f, Decl(a.tsx, 10, 5))
->div : Symbol(JSX.IntrinsicElements, Decl(a.tsx, 0, 15))
+>div : Symbol(JSX.IntrinsicElements.__index, Decl(a.tsx, 1, 40))
 >c : Symbol(c, Decl(a.tsx, 6, 5))
 
diff --git a/tests/cases/compiler/jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx b/tests/cases/compiler/jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx
new file mode 100644
index 0000000000000..9c344314a42e7
--- /dev/null
+++ b/tests/cases/compiler/jsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.tsx
@@ -0,0 +1,17 @@
+// @jsx: preserve
+// @noEmit: true
+
+// https://github.com/microsoft/TypeScript/issues/55240
+
+declare namespace JSX {
+  interface IntrinsicElements {
+    [k: `foo${string}`]: { prop: string };
+    [k: `foobar${string}`]: { prop: 'literal' };
+  }
+}
+
+<foobaz prop="smth" />;
+<foobaz prop={10} />;
+
+<foobarbaz prop="literal"/>;
+<foobarbaz prop="smth"/>;
diff --git a/tests/cases/fourslash/quickInfoOnJsxIntrinsicDeclaredUsingCatchCallIndexSignature.ts b/tests/cases/fourslash/quickInfoOnJsxIntrinsicDeclaredUsingCatchCallIndexSignature.ts
new file mode 100644
index 0000000000000..ad08b4974ddbd
--- /dev/null
+++ b/tests/cases/fourslash/quickInfoOnJsxIntrinsicDeclaredUsingCatchCallIndexSignature.ts
@@ -0,0 +1,13 @@
+/// <reference path="fourslash.ts" />
+
+// https://github.com/microsoft/TypeScript/issues/5984
+
+// @jsx: react
+
+// @filename: /a.tsx
+//// declare namespace JSX {
+////   interface IntrinsicElements { [elemName: string]: any; }
+//// }
+//// </**/div class="democlass" />;
+
+verify.baselineQuickInfo();
diff --git a/tests/cases/fourslash/quickInfoOnJsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.ts b/tests/cases/fourslash/quickInfoOnJsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.ts
new file mode 100644
index 0000000000000..a59ee0d8e16d8
--- /dev/null
+++ b/tests/cases/fourslash/quickInfoOnJsxIntrinsicDeclaredUsingTemplateLiteralTypeSignatures.ts
@@ -0,0 +1,17 @@
+/// <reference path="fourslash.ts" />
+
+// https://github.com/microsoft/TypeScript/issues/55240
+
+// @jsx: react
+
+// @filename: /a.tsx
+//// declare namespace JSX {
+////   interface IntrinsicElements {
+////     [k: `foo${string}`]: any;
+////     [k: `foobar${string}`]: any;
+////   }
+//// }
+//// </*1*/foobaz />;
+//// </*2*/foobarbaz />;
+
+verify.baselineQuickInfo();