@blaze-cms/react-page-builder 0.123.0-alpha.9 → 0.123.0

package/tests/unit/src/components/Card/__snapshots__/CardContainer.test.js.snap

@@ -26,7 +26,7 @@ exports[`CardContainer component should render with carousel if option is enable
           />
         </div>
         <div
-          class="card__content-wrapper card__content-wrapper--portrait"
+          class="card__content-wrapper card__content-wrapper--portrait "
         >
           <div
             class="card__content card__content--portrait"
@@ -37,7 +37,7 @@ exports[`CardContainer component should render with carousel if option is enable
               page
             </div>
             <h2
-              class="card__title card__title--portrait"
+              class="card__title card__title--portrait "
             >
               <a
                 href="/nautors-swan/swan-78"
@@ -63,7 +63,7 @@ exports[`CardContainer component should render with carousel if option is enable
           />
         </div>
         <div
-          class="card__content-wrapper card__content-wrapper--portrait"
+          class="card__content-wrapper card__content-wrapper--portrait "
         >
           <div
             class="card__content card__content--portrait"
@@ -74,7 +74,7 @@ exports[`CardContainer component should render with carousel if option is enable
               page
             </div>
             <h2
-              class="card__title card__title--portrait"
+              class="card__title card__title--portrait "
             >
               <a
                 href="/nautors-swan/swan-98"
@@ -110,7 +110,7 @@ exports[`CardContainer component should render without throwing error and match
         />
       </div>
       <div
-        class="card__content-wrapper card__content-wrapper--portrait"
+        class="card__content-wrapper card__content-wrapper--portrait "
       >
         <div
           class="card__content card__content--portrait"
@@ -121,7 +121,7 @@ exports[`CardContainer component should render without throwing error and match
             page
           </div>
           <h2
-            class="card__title card__title--portrait"
+            class="card__title card__title--portrait "
           >
             <a
               href="/nautors-swan/swan-78"
@@ -147,7 +147,7 @@ exports[`CardContainer component should render without throwing error and match
         />
       </div>
       <div
-        class="card__content-wrapper card__content-wrapper--portrait"
+        class="card__content-wrapper card__content-wrapper--portrait "
       >
         <div
           class="card__content card__content--portrait"
@@ -158,7 +158,7 @@ exports[`CardContainer component should render without throwing error and match
             page
           </div>
           <h2
-            class="card__title card__title--portrait"
+            class="card__title card__title--portrait "
           >
             <a
               href="/nautors-swan/swan-98"

package/tests/unit/src/components/Card/__snapshots__/CardRender.test.js.snap

@@ -21,7 +21,7 @@ exports[`CardRender component should render without throwing an error and match
         </a>
       </div>
       <div
-        class="card__content-wrapper card__content-wrapper--portrait"
+        class="card__content-wrapper card__content-wrapper--portrait "
       >
         <div
           class="card__content card__content--portrait"
@@ -33,7 +33,7 @@ exports[`CardRender component should render without throwing an error and match
             Card page cat
           </a>
           <h2
-            class="card__title card__title--portrait"
+            class="card__title card__title--portrait "
           >
             <a
               href="/card-page"

package/tests/unit/src/components/Card/mockData.js

@@ -12,6 +12,7 @@ const cardDataMockedOptions = {
           caption: ''
         }
       },
+      arrowSize: 14,
       yacht: {
         builders_list: "| Nautor's Swan |",
         length_overall: 23.99,
@@ -24,6 +25,7 @@ const cardDataMockedOptions = {
       name: 'Swan 98',
       url: '/nautors-swan/swan-98',
       category: null,
+      arrowSize: 14,
       image: {
         url:
           'https://cdn-events.boatinternational.com/files/2020/04/2f8c4030-879c-11ea-aab3-6d01477a82d7-Swan 98 - 1.jpg',

package/tests/unit/src/components/DataSummary/helpers/get-link-based-on-value.test.js

@@ -26,4 +26,33 @@ describe('Get link based on value', () => {
     });
     expect.hasAssertions();
   });
+
+  it('should return tel: link for phone numbers', () => {
+    const examples = [
+      '+385 (0) 98 398 831',
+      '123456781211',
+      '+44123123566345',
+      '07789793111',
+      '555-456',
+      '123/1123',
+      '+32 (0) 3231 5055',
+      '+32 3 219 08 91'
+    ];
+    examples.forEach(example => {
+      expect(getLinkBasedOnValue(example)).toEqual(`tel:${example}`);
+    });
+  });
+
+  it('should not add tel: link for short numbers', () => {
+    const examples = [
+      '123',
+      '2010',
+      '123456',
+      '11m',
+      'string with number +44123123566345 in the middle'
+    ];
+    examples.forEach(example => {
+      expect(getLinkBasedOnValue(example)).toEqual('');
+    });
+  });
 });

package/tests/unit/src/components/List/components/Cards/__snapshots__/CardsRender.test.js.snap

@@ -20,13 +20,13 @@ exports[`CardsRender component should render based on listData received 1`] = `
           class="card card--portrait"
         >
           <div
-            class="card__content-wrapper card__content-wrapper--portrait"
+            class="card__content-wrapper card__content-wrapper--portrait "
           >
             <div
               class="card__content card__content--portrait"
             >
               <h2
-                class="card__title card__title--portrait"
+                class="card__title card__title--portrait "
               >
                 item 1
               </h2>
@@ -41,13 +41,13 @@ exports[`CardsRender component should render based on listData received 1`] = `
           class="card card--portrait"
         >
           <div
-            class="card__content-wrapper card__content-wrapper--portrait"
+            class="card__content-wrapper card__content-wrapper--portrait "
           >
             <div
               class="card__content card__content--portrait"
             >
               <h2
-                class="card__title card__title--portrait"
+                class="card__title card__title--portrait "
               >
                 item 1
               </h2>
@@ -62,13 +62,13 @@ exports[`CardsRender component should render based on listData received 1`] = `
           class="card card--portrait"
         >
           <div
-            class="card__content-wrapper card__content-wrapper--portrait"
+            class="card__content-wrapper card__content-wrapper--portrait "
           >
             <div
               class="card__content card__content--portrait"
             >
               <h2
-                class="card__title card__title--portrait"
+                class="card__title card__title--portrait "
               >
                 item 1
               </h2>
@@ -95,13 +95,13 @@ exports[`CardsRender component should render without wrapper, when requested 1`]
       class="card card--portrait"
     >
       <div
-        class="card__content-wrapper card__content-wrapper--portrait"
+        class="card__content-wrapper card__content-wrapper--portrait "
       >
         <div
           class="card__content card__content--portrait"
         >
           <h2
-            class="card__title card__title--portrait"
+            class="card__title card__title--portrait "
           >
             item 1
           </h2>
@@ -116,13 +116,13 @@ exports[`CardsRender component should render without wrapper, when requested 1`]
       class="card card--portrait"
     >
       <div
-        class="card__content-wrapper card__content-wrapper--portrait"
+        class="card__content-wrapper card__content-wrapper--portrait "
       >
         <div
           class="card__content card__content--portrait"
         >
           <h2
-            class="card__title card__title--portrait"
+            class="card__title card__title--portrait "
           >
             item 1
           </h2>
@@ -137,13 +137,13 @@ exports[`CardsRender component should render without wrapper, when requested 1`]
       class="card card--portrait"
     >
       <div
-        class="card__content-wrapper card__content-wrapper--portrait"
+        class="card__content-wrapper card__content-wrapper--portrait "
       >
         <div
           class="card__content card__content--portrait"
         >
           <h2
-            class="card__title card__title--portrait"
+            class="card__title card__title--portrait "
           >
             item 1
           </h2>

package/tests/unit/src/components/Menu/Menu.test.js

@@ -3,6 +3,8 @@ import { render } from '@blaze-cms/tools/test-helpers/test-functions';
 import '@testing-library/jest-dom/extend-expect';
 import Menu from '../../../../../src/components/Menu';
 
+jest.mock('../../../../../src/components/SearchContent', () => () => 'Search Component');
+
 const props = {
   collapse: false,
   modifier: 'menu-mod',
@@ -10,7 +12,7 @@ const props = {
 };
 
 describe('Menu component', () => {
-  it('should render without throwing an error and match snapshot', () => {
+  it.skip('should render without throwing an error and match snapshot', () => {
     const { asFragment } = render(Menu, props);
     expect(asFragment()).toMatchSnapshot();
   });

package/tests/unit/src/components/Menu/__snapshots__/Menu.test.js.snap

@@ -13,6 +13,9 @@ exports[`Menu component should render without throwing an error and match snapsh
       >
         only child
       </div>
+      <li>
+        Search Component
+      </li>
     </ul>
   </div>
 </DocumentFragment>

package/tests/unit/src/components/SearchFilter/SearchFilter/SearchFilter.test.js

@@ -1,8 +1,7 @@
 import React from 'react';
-import { render, screen, fireEvent } from '@testing-library/react';
+import { render, screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
 import SearchFilter from '../../../../../../src/components/SearchFilter/SearchFilter';
-import { TABLET_WIDTH } from '../../../../../../src/components/SearchFilter/constants';
 
 // TODO DELETE WHEN UTIL WILL BE MERGED & USE IMPORT COMMENTED ABOVE
 const renderComponent = (Component, props) => {
@@ -28,118 +27,97 @@ const mockedProps = {
   displaySearchFilter: false
 };
 
-const customGlobal = global;
-const defaultWidth = global.innerWidth;
-
-afterAll(() => {
-  customGlobal.innerWidth = defaultWidth;
-});
-
 describe('SearchFilter component', () => {
   it('should be defined', () => {
     expect(SearchFilter).toBeDefined();
   });
 
-  describe('when the device is mobile', () => {
-    beforeEach(() => {
-      customGlobal.innerWidth = TABLET_WIDTH;
-      fireEvent(customGlobal, new Event('resize'));
+  describe('when isCollapsedOnResponsive = true, displaySearchFilter = false', () => {
+    const specificMockedProps = {
+      ...mockedProps,
+      isCollapsedOnResponsive: true,
+      displaySearchFilter: false
+    };
+
+    it('should NOT render form', () => {
+      renderComponent(SearchFilter, specificMockedProps);
+      expect(screen.queryByRole('form')).not.toBeInTheDocument();
     });
 
-    describe('when isCollapsedOnResponsive = true, displaySearchFilter = false', () => {
-      const specificMockedProps = {
-        ...mockedProps,
-        isCollapsedOnResponsive: true,
-        displaySearchFilter: false
-      };
-
-      it('should NOT render form', () => {
-        renderComponent(SearchFilter, specificMockedProps);
-        expect(screen.queryByRole('form')).not.toBeInTheDocument();
-      });
-
-      it('should render the mobile refine button', () => {
-        renderComponent(SearchFilter, specificMockedProps);
-        expect(screen.queryByTestId('refine-mobile')).toBeInTheDocument();
-      });
+    it('should render the mobile refine button', () => {
+      renderComponent(SearchFilter, specificMockedProps);
+      expect(screen.queryByTestId('refine-mobile')).toBeInTheDocument();
     });
+  });
 
-    describe('when isCollapsedOnResponsive = false, displaySearchFilter = true', () => {
-      const specificMockedProps = {
-        ...mockedProps,
-        isCollapsedOnResponsive: false,
-        displaySearchFilter: true
-      };
-
-      it('should NOT render form', () => {
-        renderComponent(SearchFilter, specificMockedProps);
-        expect(screen.queryByRole('form')).not.toBeInTheDocument();
-      });
+  describe('when isCollapsedOnResponsive = false, displaySearchFilter = true', () => {
+    const specificMockedProps = {
+      ...mockedProps,
+      isCollapsedOnResponsive: false,
+      displaySearchFilter: true
+    };
+
+    it('should NOT render form', () => {
+      renderComponent(SearchFilter, specificMockedProps);
+      expect(screen.queryByRole('form')).not.toBeInTheDocument();
     });
+  });
+
+  describe('when isCollapsedOnResponsive = false, displaySearchFilter = false', () => {
+    const specificMockedProps = {
+      ...mockedProps,
+      isCollapsedOnResponsive: false,
+      displaySearchFilter: false
+    };
 
-    describe('when isCollapsedOnResponsive = false, displaySearchFilter = false', () => {
-      const specificMockedProps = {
-        ...mockedProps,
-        isCollapsedOnResponsive: false,
-        displaySearchFilter: false
-      };
-
-      it('should render without throwing error and match snapshot', () => {
-        const { asFragment } = renderComponent(SearchFilter, specificMockedProps);
-        expect(asFragment()).toMatchSnapshot();
-      });
-
-      it('should render form', () => {
-        renderComponent(SearchFilter, specificMockedProps);
-
-        const formId = `filter-${specificMockedProps.name}-form`;
-        const form = screen.getByTestId(formId);
-        expect(form).toBeInTheDocument();
-      });
+    it('should render without throwing error and match snapshot', () => {
+      const { asFragment } = renderComponent(SearchFilter, specificMockedProps);
+      expect(asFragment()).toMatchSnapshot();
     });
 
-    describe('when isCollapsedOnResponsive = true, displaySearchFilter = true', () => {
-      const specificMockedProps = {
-        ...mockedProps,
-        isCollapsedOnResponsive: true,
-        displaySearchFilter: true
-      };
-
-      it('should render without throwing error and match snapshot', () => {
-        const { asFragment } = renderComponent(SearchFilter, specificMockedProps);
-        expect(asFragment()).toMatchSnapshot();
-      });
-
-      it('should render form', () => {
-        renderComponent(SearchFilter, specificMockedProps);
-
-        const formId = `filter-${specificMockedProps.name}-form`;
-        const form = screen.getByTestId(formId);
-        expect(form).toBeInTheDocument();
-      });
+    it('should render form', () => {
+      renderComponent(SearchFilter, specificMockedProps);
+
+      const formId = `filter-${specificMockedProps.name}-form`;
+      const form = screen.getByTestId(formId);
+      expect(form).toBeInTheDocument();
     });
   });
 
-  describe('when the device is desktop', () => {
-    beforeEach(() => {
-      customGlobal.innerWidth = TABLET_WIDTH + 10;
-      fireEvent(customGlobal, new Event('resize'));
-    });
+  describe('when isCollapsedOnResponsive = true, displaySearchFilter = true', () => {
+    const specificMockedProps = {
+      ...mockedProps,
+      isCollapsedOnResponsive: true,
+      displaySearchFilter: true
+    };
 
     it('should render without throwing error and match snapshot', () => {
-      const { asFragment } = renderComponent(SearchFilter, mockedProps);
+      const { asFragment } = renderComponent(SearchFilter, specificMockedProps);
       expect(asFragment()).toMatchSnapshot();
     });
 
     it('should render form', () => {
-      renderComponent(SearchFilter, mockedProps);
+      renderComponent(SearchFilter, specificMockedProps);
 
-      const formId = `filter-${mockedProps.name}-form`;
+      const formId = `filter-${specificMockedProps.name}-form`;
       const form = screen.getByTestId(formId);
       expect(form).toBeInTheDocument();
     });
   });
 
+  it('should render without throwing error and match snapshot', () => {
+    const { asFragment } = renderComponent(SearchFilter, mockedProps);
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  it('should render form', () => {
+    renderComponent(SearchFilter, mockedProps);
+
+    const formId = `filter-${mockedProps.name}-form`;
+    const form = screen.getByTestId(formId);
+    expect(form).toBeInTheDocument();
+  });
+
   describe('when groupAfterMobile > 0 and groupAfterDesktop = 0', () => {
     const specificMockedProps = {
       ...mockedProps,