fix(DropDownGroup): disabled search when keywordSearch is false (#665)

Co-authored-by: Nikolay Yonchev <[email protected]>
ticketmaster · May 20, 2020 · b403eb1 · b403eb1
1 parent b01065c
commit b403eb1
Show file tree

Hide file tree

Showing 3 changed files with 112 additions and 315 deletions.
diff --git a/src/components/Input/DropDown/DropDownGroup.js b/src/components/Input/DropDown/DropDownGroup.js
@@ -62,6 +62,7 @@ class DropDownGroup extends React.Component {
 
   onKeyDown = e => {
     const { keyCode } = e;
+    const { keywordSearch } = this.props;
     const { isOpen } = this.state;
 
     switch (keyCode) {
@@ -88,7 +89,7 @@ class DropDownGroup extends React.Component {
         this.toggleDropdown();
         break;
       default:
-        if (!isOpen) {
+        if (!isOpen && keywordSearch) {
           this.searchKeyWord(e);
         }
         break;
@@ -292,7 +293,7 @@ class DropDownGroup extends React.Component {
                           }
                         )}
                       >
-                        {/* HiddenLabel is required for correct screen readers 
+                        {/* HiddenLabel is required for correct screen readers
                         readings when an option is selected */}
                         <HiddenLabel id={hiddenLabelId}>
                           {placeholder || label}

diff --git a/src/components/Input/__tests__/DropDownGroup.spec.js b/src/components/Input/__tests__/DropDownGroup.spec.js
@@ -169,14 +169,27 @@ describe("DropDownGroup", () => {
   });
 
   it("Typing search word should select proper value", () => {
-    const { container, getByTestId } = renderTestComponentOne();
+    const { getByTestId, queryAllByText } = renderTestComponentOne();
 
     fireEvent.keyDown(getByTestId("test-dropContainer"), {
       key: "s",
       keyCode: 83,
       which: 83
     });
-    expect(container.firstChild).toMatchSnapshot();
+    expect(queryAllByText("Second Option")).toMatchSnapshot();
+  });
+
+  it("When search disabled typing search word should NOT select any value", () => {
+    const { getByTestId, queryAllByText } = renderTestComponentOne({
+      keywordSearch: false
+    });
+
+    fireEvent.keyDown(getByTestId("test-dropContainer"), {
+      key: "s",
+      keyCode: 83,
+      which: 83
+    });
+    expect(queryAllByText("Second Option")).toMatchSnapshot();
   });
 
   it("Click outside should close the dropdown", () => {