SONAR-10861 Searching a branch/PR by name is not working correctly (#337)

4 files changed, 38 insertions, 2 deletions

diff --git a/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.css b/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.css
index 8be68d6447c..fb8757538d2 100644
--- a/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.css
+++ b/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.css
@@ -29,6 +29,10 @@
   font-size: var(--baseFontSize);
 }
 
+.navbar-context-branches .popup {
+  min-width: 430px;
+}
+
 .navbar-context-meta-branch-menu-title {
   padding-left: calc(3 * var(--gridSize));
 }
diff --git a/server/sonar-web/src/main/js/app/components/nav/component/ComponentNavBranchesMenu.tsx b/server/sonar-web/src/main/js/app/components/nav/component/ComponentNavBranchesMenu.tsx
index 98f8de579cf..c599dda07d9 100644
--- a/server/sonar-web/src/main/js/app/components/nav/component/ComponentNavBranchesMenu.tsx
+++ b/server/sonar-web/src/main/js/app/components/nav/component/ComponentNavBranchesMenu.tsx
@@ -84,7 +84,8 @@ export default class ComponentNavBranchesMenu extends React.PureComponent<Props,
       const matchBranchName = isBranch(branchLike) && branchLike.name.toLowerCase().includes(query);
       const matchPullRequestTitleOrId =
         isPullRequest(branchLike) &&
-        (branchLike.title.includes(query) || branchLike.key.includes(query));
+        (branchLike.title.toLowerCase().includes(query) ||
+          branchLike.key.toLowerCase().includes(query));
       return matchBranchName || matchPullRequestTitleOrId;
     });
   };
diff --git a/server/sonar-web/src/main/js/app/components/nav/component/__tests__/ComponentNavBranchesMenu-test.tsx b/server/sonar-web/src/main/js/app/components/nav/component/__tests__/ComponentNavBranchesMenu-test.tsx
index 5a318153fb9..6864f33d8bf 100644
--- a/server/sonar-web/src/main/js/app/components/nav/component/__tests__/ComponentNavBranchesMenu-test.tsx
+++ b/server/sonar-web/src/main/js/app/components/nav/component/__tests__/ComponentNavBranchesMenu-test.tsx
@@ -54,7 +54,13 @@ it('renders list', () => {
 it('searches', () => {
   const wrapper = shallow(
     <ComponentNavBranchesMenu
-      branchLikes={[mainBranch(), shortBranch('foo'), shortBranch('foobar'), longBranch('bar')]}
+      branchLikes={[
+        mainBranch(),
+        shortBranch('foo'),
+        shortBranch('foobar'),
+        longBranch('bar'),
+        longBranch('BARBAZ')
+      ]}
       component={component}
       currentBranchLike={mainBranch()}
       onClose={jest.fn()}
diff --git a/server/sonar-web/src/main/js/app/components/nav/component/__tests__/__snapshots__/ComponentNavBranchesMenu-test.tsx.snap b/server/sonar-web/src/main/js/app/components/nav/component/__tests__/__snapshots__/ComponentNavBranchesMenu-test.tsx.snap
index 3296a5ced18..3109d76afb4 100644
--- a/server/sonar-web/src/main/js/app/components/nav/component/__tests__/__snapshots__/ComponentNavBranchesMenu-test.tsx.snap
+++ b/server/sonar-web/src/main/js/app/components/nav/component/__tests__/__snapshots__/ComponentNavBranchesMenu-test.tsx.snap
@@ -278,6 +278,31 @@ exports[`searches 1`] = `
       />
     </React.Fragment>
     <React.Fragment
+      key="branch-BARBAZ"
+    >
+      <li
+        className="divider"
+      />
+      <ComponentNavBranchesMenuItem
+        branchLike={
+          Object {
+            "isMain": false,
+            "name": "BARBAZ",
+            "type": "LONG",
+          }
+        }
+        component={
+          Object {
+            "key": "component",
+          }
+        }
+        innerRef={[Function]}
+        key="branch-BARBAZ"
+        onSelect={[Function]}
+        selected={false}
+      />
+    </React.Fragment>
+    <React.Fragment
       key="branch-bar"
     >
       <li