@shopgate/pwa-ui-shared 7.32.0-beta.9 → 7.32.1-beta.1

package/FormElement/spec.js

@@ -1,68 +0,0 @@
-import React from 'react';
-import { mount } from 'enzyme';
-import FormElement from "./index";
-import { jsx as _jsx } from "react/jsx-runtime";
-const inputProps = {
-  htmlFor: 'test-input'
-};
-describe('<FormElement />', () => {
-  // Simple tests for snapshots
-  const tests = {
-    'should render a form element with no children': {
-      props: {}
-    },
-    'should render a form element with 1 child': {
-      props: {
-        children: [/*#__PURE__*/_jsx("input", {}, "test-key")]
-      }
-    },
-    'should render a focused form element': {
-      props: {
-        isFocused: true
-      }
-    },
-    'should show the label': {
-      props: {
-        label: 'The label'
-      },
-      find: 'Label',
-      equal: 'The label'
-    },
-    'should show the error message': {
-      props: {
-        errorText: 'The error text'
-      },
-      find: 'ErrorText',
-      equal: 'The error text'
-    },
-    'should show the placeholder text': {
-      props: {
-        placeholder: 'The placeholder'
-      },
-      find: 'Placeholder',
-      equal: 'The placeholder'
-    }
-  };
-  Object.keys(tests).forEach(test => {
-    it(test, () => {
-      const testFixtures = tests[test];
-      const wrapper = mount(/*#__PURE__*/_jsx(FormElement, {
-        ...inputProps,
-        ...testFixtures.props
-      }));
-      expect(wrapper).toMatchSnapshot();
-      if (testFixtures.find) {
-        expect(wrapper.find(testFixtures.find).find('Translate').props().string).toEqual(testFixtures.equal);
-      }
-    });
-  });
-  it('Should hide placeholder with hasValue', () => {
-    const wrapper = mount(/*#__PURE__*/_jsx(FormElement, {
-      label: "testlabel",
-      ...inputProps,
-      hasValue: true
-    }));
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find('Placeholder').props().visible).toEqual(false);
-  });
-});

package/Glow/spec.js

@@ -1,14 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import Glow from "./index";
-import { jsx as _jsx } from "react/jsx-runtime";
-describe('<Glow />', () => {
-  it('should render with a smile', () => {
-    const wrapper = render(/*#__PURE__*/_jsx(Glow, {
-      children: /*#__PURE__*/_jsx("p", {
-        children: "Glowing!"
-      })
-    }));
-    expect(wrapper.asFragment()).toMatchSnapshot();
-  });
-});

package/IndicatorCircle/spec.js

@@ -1,26 +0,0 @@
-import React from 'react';
-import { shallow, mount } from 'enzyme';
-import IndicatorCircle from "./index";
-import { jsx as _jsx } from "react/jsx-runtime";
-describe('<IndicatorCircle />', () => {
-  it('should apply the given size', () => {
-    const wrapper = shallow(/*#__PURE__*/_jsx(IndicatorCircle, {
-      size: 32
-    }));
-    expect(wrapper).toMatchSnapshot();
-    const svg = wrapper.find('svg');
-    expect(svg.props().width).toBe(32);
-    expect(svg.props().height).toBe(32);
-  });
-  it('should apply the given color', () => {
-    const wrapper = mount(/*#__PURE__*/_jsx(IndicatorCircle, {
-      size: 32,
-      color: "#fff",
-      strokeWidth: 4
-    }));
-    expect(wrapper).toMatchSnapshot();
-    const circleHtml = wrapper.find('circle');
-    expect(circleHtml.html()).toMatch(/class="[^"]*"/);
-    expect(circleHtml.html()).not.toEqual('');
-  });
-});

package/PlaceholderLabel/spec.js

@@ -1,26 +0,0 @@
-import React from 'react';
-import { mount } from 'enzyme';
-import PlaceholderLabel from "./index";
-import { jsx as _jsx } from "react/jsx-runtime";
-describe('<PlaceholderLabel />', () => {
-  it('should render placeholder ', () => {
-    const wrapper = mount(/*#__PURE__*/_jsx(PlaceholderLabel, {
-      ready: false,
-      children: /*#__PURE__*/_jsx("h1", {
-        children: "foo"
-      })
-    }));
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find('h1').length).toEqual(0);
-  });
-  it('should render children', () => {
-    const wrapper = mount(/*#__PURE__*/_jsx(PlaceholderLabel, {
-      ready: true,
-      children: /*#__PURE__*/_jsx("h1", {
-        children: "foo"
-      })
-    }));
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find('h1').length).toEqual(1);
-  });
-});

package/PlaceholderParagraph/spec.js

@@ -1,26 +0,0 @@
-import React from 'react';
-import { mount } from 'enzyme';
-import PlaceholderParagraph from "./index";
-import { jsx as _jsx } from "react/jsx-runtime";
-describe('<PlaceholderParagraph />', () => {
-  it('should render placeholder ', () => {
-    const wrapper = mount(/*#__PURE__*/_jsx(PlaceholderParagraph, {
-      ready: false,
-      children: /*#__PURE__*/_jsx("h1", {
-        children: "foo"
-      })
-    }));
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find('h1').length).toEqual(0);
-  });
-  it('should render children', () => {
-    const wrapper = mount(/*#__PURE__*/_jsx(PlaceholderParagraph, {
-      ready: true,
-      children: /*#__PURE__*/_jsx("h1", {
-        children: "foo"
-      })
-    }));
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find('h1').length).toEqual(1);
-  });
-});

package/ProgressBar/spec.js

@@ -1,14 +0,0 @@
-import React from 'react';
-import { shallow } from 'enzyme';
-import Transition from 'react-transition-group/Transition';
-import ProgressBar from "./index";
-import { jsx as _jsx } from "react/jsx-runtime";
-describe('<ProgressBar />', () => {
-  it('renders an indeterminate progress bar.', () => {
-    const wrapper = shallow(/*#__PURE__*/_jsx(ProgressBar, {
-      isVisible: true
-    }));
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find(Transition).length).toBe(1);
-  });
-});

package/RadioButton/spec.js

@@ -1,22 +0,0 @@
-import React from 'react';
-import { mount } from 'enzyme';
-import CheckedIcon from "../icons/RadioCheckedIcon";
-import UncheckedIcon from "../icons/RadioUncheckedIcon";
-import RadioButton from "./index";
-import { jsx as _jsx } from "react/jsx-runtime";
-describe('RadioButton', () => {
-  it('should render selected RadioButton', () => {
-    const wrapper = mount(/*#__PURE__*/_jsx(RadioButton, {
-      checked: true
-    }));
-    expect(wrapper.find(CheckedIcon).exists()).toBe(true);
-    expect(wrapper.find(UncheckedIcon).exists()).toBe(false);
-    expect(wrapper).toMatchSnapshot();
-  });
-  it('should render unselected RadioButton', () => {
-    const wrapper = mount(/*#__PURE__*/_jsx(RadioButton, {}));
-    expect(wrapper.find(CheckedIcon).exists()).toBe(false);
-    expect(wrapper.find(UncheckedIcon).exists()).toBe(true);
-    expect(wrapper).toMatchSnapshot();
-  });
-});

package/RatingStars/spec.js

@@ -1,94 +0,0 @@
-import React from 'react';
-import { shallow } from 'enzyme';
-import mockRenderOptions from '@shopgate/pwa-common/helpers/mocks/mockRenderOptions';
-import StarIcon from "../icons/StarIcon";
-import StarHalfIcon from "../icons/StarHalfIcon";
-import RatingStars from "./index";
-import { jsx as _jsx } from "react/jsx-runtime";
-const numEmptyStars = 5;
-describe('<RatingStars />', () => {
-  it('renders with value of 50', () => {
-    const wrapper = shallow(/*#__PURE__*/_jsx(RatingStars, {
-      value: 50
-    }), mockRenderOptions);
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find(StarIcon).length).toBe(numEmptyStars + 2);
-    expect(wrapper.find(StarHalfIcon).length).toBe(1);
-  });
-  it('renders with value of 0', () => {
-    const wrapper = shallow(/*#__PURE__*/_jsx(RatingStars, {
-      value: 0
-    }), mockRenderOptions);
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find(StarIcon).length).toBe(numEmptyStars);
-    expect(wrapper.find(StarHalfIcon).length).toBe(0);
-  });
-  it('renders with value of 100', () => {
-    const wrapper = shallow(/*#__PURE__*/_jsx(RatingStars, {
-      value: 100
-    }), mockRenderOptions);
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find(StarIcon).length).toBe(numEmptyStars + 5);
-    expect(wrapper.find(StarHalfIcon).length).toBe(0);
-  });
-  it('should change rating on click', () => {
-    const wrapper = shallow(/*#__PURE__*/_jsx(RatingStars, {
-      value: 100,
-      isSelectable: true
-    }), mockRenderOptions);
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find(StarIcon).length).toBe(10);
-    wrapper.setProps({
-      value: 20
-    });
-    expect(wrapper.find(StarIcon).length).toBe(6);
-    wrapper.setProps({
-      value: 70
-    });
-    expect(wrapper.find(StarIcon).length).toBe(8);
-    expect(wrapper.find(StarHalfIcon).length).toBe(1);
-    expect(wrapper).toMatchSnapshot();
-  });
-  it('should call onSelection with the clicked rating in selectable mode', () => {
-    const selections = [];
-    const wrapper = shallow(/*#__PURE__*/_jsx(RatingStars, {
-      value: 20,
-      isSelectable: true,
-      onSelection: e => {
-        selections.push(e.target.value);
-        wrapper.setProps({
-          value: e.target.value
-        });
-      }
-    }), mockRenderOptions);
-
-    // Only the empty-star layer is interactive: one button per position, always five.
-    // The decorative filled overlay is pointer-transparent and carries no buttons.
-    expect(wrapper.find('[role="button"]').length).toBe(numEmptyStars);
-
-    // Regression: at a low rating the higher positions used to be covered by the
-    // filled layer's invisible placeholders, which swallowed the click. Clicking the
-    // 5th star must still raise the rating to the full 5 stars.
-    wrapper.find('[role="button"]').at(4).simulate('click', {
-      target: {}
-    });
-    expect(selections).toEqual([100]);
-
-    // The interactive layer is unaffected by the rating; clicking the 1st star lowers it.
-    expect(wrapper.find('[role="button"]').length).toBe(numEmptyStars);
-    wrapper.find('[role="button"]').at(0).simulate('click', {
-      target: {}
-    });
-    expect(selections).toEqual([100, 20]);
-  });
-  it('should NOT call onSelection callback when component is NOT selectable', () => {
-    const spy = jest.fn();
-    const wrapper = shallow(/*#__PURE__*/_jsx(RatingStars, {
-      value: 100,
-      onSelection: spy
-    }), mockRenderOptions);
-    wrapper.find(StarIcon).at(5).parent('div').simulate('click');
-    expect(wrapper.find('[role="button"]').length).toBe(0);
-    expect(spy.mock.calls.length).toBe(0);
-  });
-});

package/RippleButton/spec.js

@@ -1,58 +0,0 @@
-import trim from 'lodash/trim';
-import React from 'react';
-import { mount } from 'enzyme';
-import BaseButton from '@shopgate/pwa-common/components/Button';
-import Ripple from "../Ripple";
-import RippleButton from "./index";
-import { jsx as _jsx } from "react/jsx-runtime";
-describe('<RippleButton />', () => {
-  it('should render as a regular ripple button effect if type is omitted', () => {
-    const wrapper = mount(/*#__PURE__*/_jsx(RippleButton, {
-      children: "Press me"
-    }));
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find(Ripple).text()).toEqual('Press me');
-  });
-  it('should render as a regular ripple button if type is explicitly defined', () => {
-    const wrapper = mount(/*#__PURE__*/_jsx(RippleButton, {
-      type: "regular",
-      children: "Press me"
-    }));
-    const base = wrapper.find(BaseButton);
-    expect(base.exists()).toBe(true);
-    expect(trim(base.props().className)).toMatch(/^ui-shared__button /);
-    expect(trim(base.props().className)).toContain('ui-shared__ripple-button');
-    expect(wrapper.find(Ripple).render().text()).toEqual('Press me');
-    expect(wrapper).toMatchSnapshot();
-  });
-  it('should render as a primary ripple button', () => {
-    const wrapper = mount(/*#__PURE__*/_jsx(RippleButton, {
-      type: "primary",
-      children: "Press me"
-    }));
-    const base = wrapper.find(BaseButton);
-    expect(trim(base.props().className)).toMatch(/^ui-shared__button /);
-    expect(trim(base.props().className)).toContain('ui-shared__ripple-button');
-    expect(wrapper.find(Ripple).render().text()).toEqual('Press me');
-    expect(wrapper).toMatchSnapshot();
-  });
-  it('should render as a secondary ripple button', () => {
-    const wrapper = mount(/*#__PURE__*/_jsx(RippleButton, {
-      type: "secondary",
-      children: "Press me"
-    }));
-    const base = wrapper.find(BaseButton);
-    expect(trim(base.props().className)).toMatch(/^ui-shared__button /);
-    expect(trim(base.props().className)).toContain('ui-shared__ripple-button');
-    expect(wrapper.find(Ripple).render().text()).toEqual('Press me');
-    expect(wrapper).toMatchSnapshot();
-  });
-  it('should render as a disabled ripple button', () => {
-    const wrapper = mount(/*#__PURE__*/_jsx(RippleButton, {
-      disabled: true,
-      children: "Press me"
-    }));
-    expect(wrapper.find(BaseButton).props().disabled).toBe(true);
-    expect(wrapper).toMatchSnapshot();
-  });
-});

package/Sheet/components/Header/components/SearchBar/spec.js

@@ -1,22 +0,0 @@
-import React from 'react';
-import { mount } from 'enzyme';
-import SearchBar from "./index";
-import { jsx as _jsx } from "react/jsx-runtime";
-describe('<SearchBar />', () => {
-  it('should call handleChange on input', async () => {
-    const handleChange = jest.fn();
-    const wrapper = await mount(/*#__PURE__*/_jsx(SearchBar, {
-      handleChange: handleChange
-    }));
-    expect(wrapper).toMatchSnapshot();
-    // Update input
-    wrapper.find('input').first().simulate('change', {
-      target: {
-        name: 'search',
-        value: 'asdf'
-      }
-    });
-    // Should call with updated state.
-    expect(handleChange).toHaveBeenCalledWith('asdf');
-  });
-});

package/Sheet/components/Header/spec.js

@@ -1,17 +0,0 @@
-import React from 'react';
-import { shallow } from 'enzyme';
-import mockRenderOptions from '@shopgate/pwa-common/helpers/mocks/mockRenderOptions';
-import Header from "./index";
-import { jsx as _jsx } from "react/jsx-runtime";
-describe('<Header />', () => {
-  it('should render with correct title', () => {
-    const title = 'My Title';
-    const wrapper = shallow(/*#__PURE__*/_jsx(Header, {
-      title: title
-    }), mockRenderOptions);
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find({
-      variant: 'h3'
-    }).first().props().children).toEqual(title);
-  });
-});

package/Sheet/spec.js

@@ -1,100 +0,0 @@
-import React from 'react';
-import { shallow, mount } from 'enzyme';
-import Drawer from '@shopgate/pwa-common/components/Drawer';
-import mockRenderOptions from '@shopgate/pwa-common/helpers/mocks/mockRenderOptions';
-import UIEvents from '@shopgate/pwa-core/emitters/ui';
-import Sheet, { SHEET_EVENTS } from "./index";
-import { jsx as _jsx } from "react/jsx-runtime";
-window.requestAnimationFrame = () => {};
-jest.mock('@shopgate/pwa-core/emitters/ui', () => ({
-  emit: jest.fn()
-}));
-jest.mock('@shopgate/engage/a11y/components');
-describe('<Sheet />', () => {
-  it('should render closed without content', () => {
-    const wrapper = shallow(/*#__PURE__*/_jsx(Sheet, {}));
-    expect(wrapper).toMatchSnapshot();
-  });
-  it('should render opened without content', () => {
-    const wrapper = shallow(/*#__PURE__*/_jsx(Sheet, {
-      isOpen: true
-    }));
-    expect(wrapper).toMatchSnapshot();
-  });
-  it('should render with content and title', () => {
-    const wrapper = shallow(/*#__PURE__*/_jsx(Sheet, {
-      isOpen: true,
-      title: "Test-Title",
-      children: /*#__PURE__*/_jsx("div", {
-        children: "Test"
-      })
-    }));
-    expect(wrapper).toMatchSnapshot();
-  });
-  it('should call onDidOpen callback when the Sheet was opened', () => {
-    const onOpen = jest.fn();
-    const onDidOpen = jest.fn();
-    const wrapper = mount(/*#__PURE__*/_jsx(Sheet, {
-      isOpen: false,
-      onOpen: onOpen,
-      onDidOpen: onDidOpen,
-      children: /*#__PURE__*/_jsx("div", {
-        children: "Test"
-      })
-    }), mockRenderOptions);
-    expect(onOpen).not.toHaveBeenCalled();
-    expect(onDidOpen).not.toHaveBeenCalled();
-    wrapper.setProps({
-      isOpen: true
-    });
-    wrapper.update();
-    expect(onOpen).toHaveBeenCalled();
-    wrapper.find(Drawer).simulate('animationEnd');
-    expect(onDidOpen).toHaveBeenCalled();
-    expect(UIEvents.emit).nthCalledWith(1, SHEET_EVENTS.OPEN);
-  });
-  it('should trigger onClose callback and close the Sheet', () => {
-    const onCloseSpy = jest.fn();
-    const wrapper = mount(/*#__PURE__*/_jsx(Sheet, {
-      isOpen: true,
-      title: "Test-Title",
-      onClose: onCloseSpy,
-      children: /*#__PURE__*/_jsx("div", {
-        children: "Test"
-      })
-    }), mockRenderOptions);
-
-    // Trigger a click on the close button of the Sheet.
-    wrapper.find('button').first().simulate('click');
-    return new Promise(resolve => {
-      // Wait until the drawer is closed and has updated it's state.
-      setTimeout(() => {
-        resolve();
-      }, wrapper.find(Drawer).prop('animation').duration);
-    }).then(() => {
-      // Check if onClose callback was called.
-      expect(onCloseSpy).toHaveBeenCalled();
-
-      // Check if the Drawer component was closed.
-      expect(wrapper.find(Drawer).prop('isOpen')).not.toBeTruthy();
-      expect(wrapper).toMatchSnapshot();
-      wrapper.find(Drawer).simulate('animationEnd');
-      expect(UIEvents.emit).lastCalledWith(SHEET_EVENTS.CLOSE);
-    });
-  });
-  it('should open', () => {
-    const wrapper = mount(/*#__PURE__*/_jsx(Sheet, {
-      isOpen: false,
-      title: "Test-Title",
-      children: /*#__PURE__*/_jsx("div", {
-        children: "Test"
-      })
-    }), mockRenderOptions);
-    wrapper.setProps({
-      isOpen: true
-    });
-    wrapper.update();
-    expect(wrapper.find(Drawer).prop('isOpen')).toBeTruthy();
-    expect(wrapper).toMatchSnapshot();
-  });
-});

package/TaxDisclaimer/spec.js

@@ -1,44 +0,0 @@
-import React from 'react';
-import { shallow } from 'enzyme';
-import { I18n } from '@shopgate/engage/components';
-import { jsx as _jsx } from "react/jsx-runtime";
-jest.mock('@shopgate/engage/components');
-jest.mock('@shopgate/engage/styles', () => ({
-  makeStyles: () => function mockUseStylesFactory() {
-    return function useStylesMock() {
-      return {
-        classes: {
-          text: 'mock-class-text'
-        },
-        cx: (...classes) => classes.filter(Boolean).join(' ')
-      };
-    };
-  },
-  keyframes: () => ({})
-}));
-jest.mock('@shopgate/engage/core/hooks/useWidgetSettings', () => ({
-  useWidgetSettings: jest.fn().mockReturnValue({
-    show: null,
-    hint: '*',
-    text: null
-  })
-}));
-describe('<TaxDisclaimer />', () => {
-  afterEach(() => {
-    jest.resetModules();
-  });
-  it('should display the component', () => {
-    jest.mock('@shopgate/pwa-common-commerce/market/helpers/showTaxDisclaimer', () => true);
-    const TaxDisclaimer = jest.requireActual("./index").default;
-    const wrapper = shallow(/*#__PURE__*/_jsx(TaxDisclaimer, {}));
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find(I18n.Text).exists()).toBe(true);
-  });
-  it('should display null', () => {
-    jest.mock('@shopgate/pwa-common-commerce/market/helpers/showTaxDisclaimer', () => false);
-    const TaxDisclaimer = jest.requireActual("./index").default;
-    const wrapper = shallow(/*#__PURE__*/_jsx(TaxDisclaimer, {}));
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find(I18n.Text).exists()).toBe(false);
-  });
-});