fix(42259): omit merging modules with different names

src/services/navigationBar.ts

@@ -605,7 +605,8 @@ namespace ts.NavigationBar {
             case SyntaxKind.SetAccessor:
                 return hasSyntacticModifier(a, ModifierFlags.Static) === hasSyntacticModifier(b, ModifierFlags.Static);
             case SyntaxKind.ModuleDeclaration:
-                return areSameModule(<ModuleDeclaration>a, <ModuleDeclaration>b);
+                return areSameModule(<ModuleDeclaration>a, <ModuleDeclaration>b)
+                    && getFullyQualifiedModuleName(<ModuleDeclaration>a) === getFullyQualifiedModuleName(<ModuleDeclaration>b);
             default:
                 return true;
         }
@@ -625,7 +626,6 @@ namespace ts.NavigationBar {
     // We use 1 NavNode to represent 'A.B.C', but there are multiple source nodes.
     // Only merge module nodes that have the same chain. Don't merge 'A.B.C' with 'A'!
     function areSameModule(a: ModuleDeclaration, b: ModuleDeclaration): boolean {
-        // TODO: GH#18217
         return a.body!.kind === b.body!.kind && (a.body!.kind !== SyntaxKind.ModuleDeclaration || areSameModule(<ModuleDeclaration>a.body, <ModuleDeclaration>b.body));
     }
 
@@ -845,6 +845,10 @@ namespace ts.NavigationBar {
             return getTextOfNode(moduleDeclaration.name);
         }
 
+        return getFullyQualifiedModuleName(moduleDeclaration);
+    }
+
+    function getFullyQualifiedModuleName(moduleDeclaration: ModuleDeclaration): string {
         // Otherwise, we need to aggregate each identifier to build up the qualified name.
         const result = [getTextOfIdentifierOrLiteral(moduleDeclaration.name)];
         while (moduleDeclaration.body && moduleDeclaration.body.kind === SyntaxKind.ModuleDeclaration) {

tests/cases/fourslash/navigationBarItemsModules2.ts

@@ -0,0 +1,66 @@
+/// <reference path="fourslash.ts"/>
+
+////namespace Test.A { }
+////
+////namespace Test.B {
+////    class Foo { }
+////}
+
+verify.navigationTree({
+    text: "<global>",
+    kind: "script",
+    childItems: [
+        {
+            text: "Test.A",
+            kind: "module"
+        },
+        {
+            text: "Test.B",
+            kind: "module",
+            childItems: [
+                {
+                    text: "Foo",
+                    kind: "class"
+                }
+            ]
+        }
+    ]
+});
+
+verify.navigationBar([
+    {
+        text: "<global>",
+        kind: "script",
+        childItems: [
+            {
+                text: "Test.A",
+                kind: "module"
+            },
+            {
+                text: "Test.B",
+                kind: "module"
+            }
+        ]
+    },
+    {
+        text: "Test.A",
+        kind: "module",
+        indent: 1
+    },
+    {
+        text: "Test.B",
+        kind: "module",
+        childItems: [
+            {
+                text: "Foo",
+                kind: "class"
+            }
+        ],
+        indent: 1
+    },
+    {
+        text: "Foo",
+        kind: "class",
+        indent: 2
+    }
+]);