test: add test case

qlik-oss · Mar 14, 2023 · 44880f1 · 44880f1
1 parent f15e74f
commit 44880f1
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 2 deletions.
diff --git a/apis/nucleus/src/components/listbox/ListBoxInline.jsx b/apis/nucleus/src/components/listbox/ListBoxInline.jsx
@@ -231,6 +231,7 @@ function ListBoxInline({ options, layout }) {
                       tabIndex={-1}
                       title={translator.get('Listbox.Search')}
                       size="large"
+                      data-testid="search-toggle-btn"
                     >
                       <SearchIcon style={{ fontSize: '12px' }} />
                     </IconButton>

diff --git a/apis/nucleus/src/components/listbox/__tests__/list-box-inline.test.jsx b/apis/nucleus/src/components/listbox/__tests__/list-box-inline.test.jsx
@@ -182,8 +182,9 @@ describe('<ListboxInline />', () => {
       const autoSizers = renderer.root.findAllByProps({ 'data-testid': 'virtualized-auto-sizer' });
       expect(autoSizers).toHaveLength(1);
 
-      const listBoxSearches = renderer.root.findAllByType(ListBoxSearch);
-      expect(listBoxSearches).toHaveLength(1);
+      expect(ListBoxSearch.mock.calls[0][0]).toMatchObject({
+        visible: true,
+      });
       expect(getListboxInlineKeyboardNavigation).toHaveBeenCalledTimes(2);
 
       // TODO: MUIv5
@@ -195,6 +196,20 @@ describe('<ListboxInline />', () => {
       expect(selections.off).not.toHaveBeenCalled();
     });
 
+    test('should render properly with search toggle option', async () => {
+      options.search = 'toggle';
+      await render();
+
+      const searchToggleBtns = renderer.root
+        .findAllByProps({ 'data-testid': 'search-toggle-btn' })
+        .filter((x) => typeof x.type === 'string'); // removes virtual dom elements
+
+      expect(searchToggleBtns).toHaveLength(1);
+      expect(ListBoxSearch.mock.calls[0][0]).toMatchObject({
+        visible: false,
+      });
+    });
+
     test('should render without toolbar', async () => {
       options.toolbar = false;
       await render();