fix(component and file): added datat id for filters and fixed broken …

…test cases of facets data id contains the encoded facet values, so its been added to the facet item component. fixed the brocken testcases of the facets
unbxd · Oct 18, 2021 · 2a75896 · 2a75896
1 parent 9c67abf
commit 2a75896
Show file tree

Hide file tree

Showing 8 changed files with 23 additions and 26 deletions.
diff --git a/package.json b/package.json
@@ -124,7 +124,7 @@
         "@semantic-release/git": "^9.0.0",
         "@semantic-release/release-notes-generator": "^9.0.1",
         "@storybook/theming": "^6.2.9",
-        "@unbxd-ui/unbxd-search-core": "^0.4.0",
+        "@unbxd-ui/unbxd-search-core": "^0.4.1",
         "prop-types": "^15.7.2",
         "semantic-release": "^17.3.0"
     },

diff --git a/src/UnbxdSearchWrapper.js b/src/UnbxdSearchWrapper.js
@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
 import UnbxdSearch from '@unbxd-ui/unbxd-search-core';
 //mapping for the local debug
 //import UnbxdSearch from '../../../search-JS-core/src/index';
+//import UnbxdSearch from '../src/core/unbxdSdk';
 
 import { AppContextProvider } from './common/context';
 import {

diff --git a/src/modules/combinedFacets/__tests__/CombinedFacets.test.js b/src/modules/combinedFacets/__tests__/CombinedFacets.test.js
@@ -114,7 +114,8 @@ test('Test Combined Facet text click', async () => {
                 'Scarpa Mont Blanc Pro GTX Goretex Unisex Mountaineering Boots'
             )
         ).toBeInTheDocument();
-        fireEvent.click(getByText('Clear'));
+        expect(getByText('Scarpa - 18')).toBeInTheDocument();
+        fireEvent.click(getByText('Scarpa - 18'));
     });
 });
 
@@ -146,7 +147,7 @@ test('Test Combined Facet category click', async () => {
         ).toBeInTheDocument();
     });
 });
-/*
+
 test('Test selected facet click on range Facet', async () => {
     const { getByText, container } = render(
         <>
@@ -194,10 +195,6 @@ test('Test selected facet click on text Facet', async () => {
         </>
     );
 
-    await waitFor(async () => {
-        expect(getByText('Scarpa - 18')).toBeInTheDocument();
-        fireEvent.click(getByText('Scarpa - 18'));
-    });
     await waitFor(() => {
         expect(
             container.getElementsByClassName('UNX-selectedFacets__container')
@@ -210,4 +207,3 @@ test('Test selected facet click on text Facet', async () => {
         ).toBe(0);
     });
 });
-*/
diff --git a/src/modules/combinedFacets/__tests__/__snapshots__/CombinedFacets.test.js.snap b/src/modules/combinedFacets/__tests__/__snapshots__/CombinedFacets.test.js.snap
@@ -516,7 +516,7 @@ Array [
           </button>
           <button
             className="UNX-facet__item -l2 "
-            data-id="All Products"
+            data-id="All%20Products"
             data-testid="UNX_multilevelFacet__facetItem"
             onClick={[Function]}
             tabIndex={0}
@@ -531,7 +531,7 @@ Array [
           </button>
           <button
             className="UNX-facet__item -l2 "
-            data-id="Camp & Hike"
+            data-id="Camp%20%26%20Hike"
             data-testid="UNX_multilevelFacet__facetItem"
             onClick={[Function]}
             tabIndex={0}
@@ -903,7 +903,7 @@ Array [
         >
           <button
             className="UNX-facet__item -l1 "
-            data-id="All Products"
+            data-id="All%20Products"
             data-testid="UNX_multilevelFacet__facetItem"
             onClick={[Function]}
             tabIndex={0}
@@ -918,7 +918,7 @@ Array [
           </button>
           <button
             className="UNX-facet__item -l1 "
-            data-id="Camp & Hike"
+            data-id="Camp%20%26%20Hike"
             data-testid="UNX_multilevelFacet__facetItem"
             onClick={[Function]}
             tabIndex={0}

diff --git a/src/modules/multilevelFacets/generateFacets/FacetItem.js b/src/modules/multilevelFacets/generateFacets/FacetItem.js
@@ -4,7 +4,7 @@ import PropTypes from 'prop-types';
 import { Button } from '../../../components';
 
 const FacetItem = ({ itemData, onClick }) => {
-    const { name, count, level, isSelected = false, fieldName } = itemData;
+    const { name, count, level, isSelected = false, fieldName, dataId } = itemData;
     const handleClick = () => {
         onClick(itemData);
     };
@@ -16,7 +16,7 @@ const FacetItem = ({ itemData, onClick }) => {
             onClick={handleClick}
             data-testid="UNX_multilevelFacet__facetItem"
             data-facet-name={fieldName}
-            data-id={name}
+            data-id={dataId}
         >
             {name} {count && <span>-{count}</span>}
         </Button>

diff --git a/src/modules/rangeFacets/__tests__/rangeFacets.test.js b/src/modules/rangeFacets/__tests__/rangeFacets.test.js
@@ -185,7 +185,6 @@ test('Test range facet click with FacetItemComponent', async () => {
         ).toBeInTheDocument();
     });
 });
-/*
 test('Test selected facet click on range Facet', async () => {
     const { getByText, container } = render(
         <>
@@ -205,12 +204,14 @@ test('Test selected facet click on range Facet', async () => {
     );
 
     await waitFor(async () => {
-        expect(getByText('$ 200 - $ 300 - 60')).toBeInTheDocument();
-        fireEvent.click(getByText('$ 200 - $ 300 - 60'));
+        const aRange = getByText('$ 200 - $ 300 - 60');
+        expect(aRange).toBeInTheDocument();
+        fireEvent.click(aRange);
+
     });
     await waitFor(() => {
         expect(
-            container.getElementsByClassName('UNX-selectedFacets__container')
+            container.getElementsByClassName('UNX-facet__item -selected')
                 .length
         ).toBe(1);
     });
@@ -241,9 +242,8 @@ test('Test selected facet click on range Facet with FacetItemComponent', async (
         fireEvent.click(getByText('$ 200 - $ 300 - 60'));
     });
     await waitFor(() => {
-        expect(container.getElementsByClassName('range-selected').length).toBe(
+        expect(container.getElementsByClassName('-selected').length).toBe(
             1
         );
     });
 });
-*/
diff --git a/src/modules/searchBox/__tests__/searchBox.test.js b/src/modules/searchBox/__tests__/searchBox.test.js
@@ -44,7 +44,7 @@ test('Search Box Input test', async () => {
                 siteKey="wildearthclone-neto-com-au808941566310465"
                 apiKey="e6959ae0b643d51b565dc3e01bf41ec1"
             >
-                <SearchBox />
+                <SearchBox defaultSearch="boots1" />
                 <Products attributesMap={attributesMap} />
             </UnbxdSearchWrapper>
         </>
@@ -65,7 +65,7 @@ test('Search Box Clearable test', async () => {
                 siteKey="wildearthclone-neto-com-au808941566310465"
                 apiKey="e6959ae0b643d51b565dc3e01bf41ec1"
             >
-                <SearchBox clearable={true} />
+                <SearchBox defaultSearch="boots1" clearable={true} />
                 <Products attributesMap={attributesMap} />
             </UnbxdSearchWrapper>
         </>

diff --git a/yarn.lock b/yarn.lock
@@ -2769,10 +2769,10 @@
   dependencies:
     "@types/yargs-parser" "*"
 
-"@unbxd-ui/unbxd-search-core@^0.4.0":
-  version "0.4.0"
-  resolved "https://registry.yarnpkg.com/@unbxd-ui/unbxd-search-core/-/unbxd-search-core-0.4.0.tgz#11bcee9f7004b48e4cc2cb5a5767f55c9c6020c0"
-  integrity sha512-eOyvdHQSkXeivBy/Y3uHaOmPDAFsysP6Ohxl8CANHIjZhlBC8hT6CcOc9ORNBaglBiyMKxol6sWT53/iHJ3UKQ==
+"@unbxd-ui/unbxd-search-core@^0.4.1":
+  version "0.4.1"
+  resolved "https://registry.yarnpkg.com/@unbxd-ui/unbxd-search-core/-/unbxd-search-core-0.4.1.tgz#de88d1d801deaadd320a185a9ecccde01b359d54"
+  integrity sha512-DmW8Wou7XXV1k/GQcI9g6qssYNBl9ZFieneolSDF4UueUH9wOe90QER8pSEbewotP4OxN5uFLOH/zjAKmPh86Q==
   dependencies:
     babel-polyfill "^6.26.0"
     babel-runtime "^6.26.0"