Fix more generally for dotted expressions

src/services/symbolDisplay.ts

@@ -89,9 +89,15 @@ namespace ts.SymbolDisplay {
                 case SyntaxKind.JsxOpeningElement:
                 case SyntaxKind.JsxElement:
                 case SyntaxKind.JsxSelfClosingElement:
-                    return location.kind === SyntaxKind.Identifier
-                            ? ScriptElementKind.memberVariableElement
-                            : location.kind === SyntaxKind.LessThanToken ? ScriptElementKind.jsxTagName : ScriptElementKind.jsxAttribute;
+                    switch (location.kind) {
+                        case SyntaxKind.Identifier:
+                            return ScriptElementKind.memberVariableElement;
+                        case SyntaxKind.LessThanToken:
+                        case SyntaxKind.SyntaxList:
+                            return ScriptElementKind.jsxTagName;
+                        default:
+                            return ScriptElementKind.jsxAttribute;
+                    }
                 case SyntaxKind.JsxAttribute:
                     return ScriptElementKind.jsxAttribute;
                 default:

tests/cases/fourslash/jsxTagNameDottedNoSnippet.ts

@@ -0,0 +1,53 @@
+/// <reference path="fourslash.ts" />
+//@Filename: file.tsx
+////interface NestedInterface {
+////    Foo: NestedInterface;
+////    (props: {}): any;
+////}
+////
+////declare const Foo: NestedInterface;
+////
+////function fn1() {
+////    return <Foo>
+////        </*1*/
+////    </Foo>
+////}
+////function fn2() {
+////    return <Foo>
+////        <Fo/*2*/
+////    </Foo>
+////}
+////function fn3() {
+////    return <Foo>
+////        <Foo./*3*/
+////    </Foo>
+////}
+////function fn4() {
+////    return <Foo>
+////        <Foo.F/*4*/
+////    </Foo>
+////}
+////function fn5() {
+////    return <Foo>
+////        <Foo.Foo./*5*/
+////    </Foo>
+////}
+////function fn6() {
+////    return <Foo>
+////        <Foo.Foo.F/*6*/
+////    </Foo>
+////}
+
+for (const marker of test.markers()) {
+    verify.completions({
+        marker,
+        includes: [
+            { name: "Foo", insertText: undefined, isSnippet: undefined }
+        ],
+        preferences: {
+            jsxAttributeCompletionStyle: "braces",
+            includeCompletionsWithSnippetText: true,
+            includeCompletionsWithInsertText: true,
+        },
+    })
+}