@shopgate/pwa-common 7.31.5 → 7.31.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/helpers/mocks/mockRenderOptions.js +21 -0
- package/package.json +3 -3
- package/action-creators/app/spec.js +0 -96
- package/action-creators/client/spec.js +0 -44
- package/action-creators/menu/spec.js +0 -37
- package/action-creators/modal/spec.js +0 -26
- package/action-creators/page/spec.js +0 -38
- package/action-creators/url/spec.js +0 -45
- package/action-creators/user/spec.js +0 -186
- package/components/Backdrop/spec.js +0 -24
- package/components/Button/spec.js +0 -42
- package/components/Checkbox/spec.js +0 -111
- package/components/CountdownTimer/spec.js +0 -141
- package/components/Drawer/spec.js +0 -79
- package/components/Ellipsis/spec.js +0 -15
- package/components/EmbeddedMedia/spec.js +0 -61
- package/components/Grid/components/Item/spec.js +0 -24
- package/components/Grid/spec.js +0 -24
- package/components/HtmlSanitizer/spec.js +0 -229
- package/components/I18n/components/FormatDate/spec.js +0 -54
- package/components/I18n/components/FormatNumber/spec.js +0 -51
- package/components/I18n/components/FormatPrice/spec.js +0 -54
- package/components/I18n/components/FormatTime/spec.js +0 -51
- package/components/I18n/components/I18nProvider/spec.js +0 -40
- package/components/I18n/components/Placeholder/spec.js +0 -37
- package/components/I18n/components/Translate/spec.js +0 -33
- package/components/InfiniteContainer/spec.js +0 -204
- package/components/Input/spec.js +0 -123
- package/components/Link/spec.js +0 -60
- package/components/List/spec.js +0 -26
- package/components/ModalContainer/spec.js +0 -115
- package/components/Select/spec.js +0 -122
- package/components/SelectBox/spec.js +0 -68
- package/components/Swiper/components/SwiperItem/spec.js +0 -26
- package/components/Widgets/components/Widget/spec.js +0 -75
- package/components/Widgets/components/WidgetGrid/spec.js +0 -53
- package/components/Widgets/spec.js +0 -234
- package/helpers/data/spec.js +0 -194
- package/helpers/date/spec.js +0 -92
- package/helpers/style/spec.js +0 -108
- package/helpers/validation/spec.js +0 -10
- package/providers/toast/spec.js +0 -105
- package/tsconfig.build.json +0 -16
- package/tsconfig.json +0 -3
|
@@ -1,111 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { shallow } from 'enzyme';
|
|
3
|
-
import Checkbox from "./index";
|
|
4
|
-
|
|
5
|
-
/**
|
|
6
|
-
* Checked Icon
|
|
7
|
-
* @returns {JSX}
|
|
8
|
-
*/
|
|
9
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
10
|
-
const Checked = () => /*#__PURE__*/_jsx("div", {});
|
|
11
|
-
|
|
12
|
-
/**
|
|
13
|
-
* Unchecked Icon
|
|
14
|
-
* @returns {JSX}
|
|
15
|
-
*/
|
|
16
|
-
const Unchecked = () => /*#__PURE__*/_jsx("div", {});
|
|
17
|
-
describe('<Checkbox />', () => {
|
|
18
|
-
it('should render the checkbox with the label before the icon', () => {
|
|
19
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(Checkbox, {
|
|
20
|
-
label: /*#__PURE__*/_jsx("span", {
|
|
21
|
-
children: "Test Label Deluxe"
|
|
22
|
-
}),
|
|
23
|
-
labelPosition: "left",
|
|
24
|
-
checkedIcon: /*#__PURE__*/_jsx(Checked, {}),
|
|
25
|
-
uncheckedIcon: /*#__PURE__*/_jsx(Unchecked, {}),
|
|
26
|
-
checked: false
|
|
27
|
-
}));
|
|
28
|
-
const expected = /*#__PURE__*/_jsxs("div", {
|
|
29
|
-
children: [/*#__PURE__*/_jsx("span", {
|
|
30
|
-
children: "Test Label Deluxe"
|
|
31
|
-
}), /*#__PURE__*/_jsx(Unchecked, {})]
|
|
32
|
-
});
|
|
33
|
-
expect(wrapper).toMatchSnapshot();
|
|
34
|
-
expect(wrapper.matchesElement(expected)).toBeTruthy();
|
|
35
|
-
});
|
|
36
|
-
it('should render the checkbox with the label after the icon', () => {
|
|
37
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(Checkbox, {
|
|
38
|
-
label: /*#__PURE__*/_jsx("span", {
|
|
39
|
-
children: "Test Label Deluxe"
|
|
40
|
-
}),
|
|
41
|
-
labelPosition: "right",
|
|
42
|
-
checkedIcon: /*#__PURE__*/_jsx(Checked, {}),
|
|
43
|
-
uncheckedIcon: /*#__PURE__*/_jsx(Unchecked, {}),
|
|
44
|
-
checked: false
|
|
45
|
-
}));
|
|
46
|
-
const expected = /*#__PURE__*/_jsxs("div", {
|
|
47
|
-
children: [/*#__PURE__*/_jsx(Unchecked, {}), /*#__PURE__*/_jsx("span", {
|
|
48
|
-
children: "Test Label Deluxe"
|
|
49
|
-
})]
|
|
50
|
-
});
|
|
51
|
-
expect(wrapper).toMatchSnapshot();
|
|
52
|
-
expect(wrapper.matchesElement(expected)).toBeTruthy();
|
|
53
|
-
});
|
|
54
|
-
it('should render the unchecked icon if "checked" is false', () => {
|
|
55
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(Checkbox, {
|
|
56
|
-
checked: false,
|
|
57
|
-
label: "Test Label Deluxe",
|
|
58
|
-
checkedIcon: /*#__PURE__*/_jsx(Checked, {}),
|
|
59
|
-
uncheckedIcon: /*#__PURE__*/_jsx(Unchecked, {})
|
|
60
|
-
}));
|
|
61
|
-
expect(wrapper).toMatchSnapshot();
|
|
62
|
-
expect(wrapper.find(Checked).length).toBe(0);
|
|
63
|
-
expect(wrapper.find(Unchecked).length).toBe(1);
|
|
64
|
-
});
|
|
65
|
-
it('should render the unchecked icon if "checked" is false', () => {
|
|
66
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(Checkbox, {
|
|
67
|
-
checked: true,
|
|
68
|
-
label: "Test Label Deluxe",
|
|
69
|
-
checkedIcon: /*#__PURE__*/_jsx(Checked, {}),
|
|
70
|
-
uncheckedIcon: /*#__PURE__*/_jsx(Unchecked, {})
|
|
71
|
-
}));
|
|
72
|
-
expect(wrapper).toMatchSnapshot();
|
|
73
|
-
expect(wrapper.find(Checked).length).toBe(1);
|
|
74
|
-
expect(wrapper.find(Unchecked).length).toBe(0);
|
|
75
|
-
});
|
|
76
|
-
it('should call the callback with the inverted value', () => {
|
|
77
|
-
const spy = jest.fn();
|
|
78
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(Checkbox, {
|
|
79
|
-
label: "Test Label Deluxe",
|
|
80
|
-
checkedIcon: /*#__PURE__*/_jsx(Checked, {}),
|
|
81
|
-
uncheckedIcon: /*#__PURE__*/_jsx(Unchecked, {}),
|
|
82
|
-
checked: false,
|
|
83
|
-
onCheck: spy
|
|
84
|
-
}));
|
|
85
|
-
wrapper.simulate('click');
|
|
86
|
-
expect(spy).toHaveBeenCalledWith(true);
|
|
87
|
-
});
|
|
88
|
-
it('should render an <input> element if a name prop is provided', () => {
|
|
89
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(Checkbox, {
|
|
90
|
-
label: "Test Label Deluxe",
|
|
91
|
-
checkedIcon: /*#__PURE__*/_jsx(Checked, {}),
|
|
92
|
-
uncheckedIcon: /*#__PURE__*/_jsx(Unchecked, {}),
|
|
93
|
-
defaultChecked: false,
|
|
94
|
-
name: "myCheckbox"
|
|
95
|
-
}));
|
|
96
|
-
const input = wrapper.find('input');
|
|
97
|
-
expect(input.length).toBe(1);
|
|
98
|
-
expect(input.prop('name')).toEqual('myCheckbox');
|
|
99
|
-
expect(input.prop('value')).toEqual(0);
|
|
100
|
-
});
|
|
101
|
-
it('should work as an uncontrolled input', () => {
|
|
102
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(Checkbox, {
|
|
103
|
-
label: "Test Label Deluxe",
|
|
104
|
-
checkedIcon: /*#__PURE__*/_jsx(Checked, {}),
|
|
105
|
-
uncheckedIcon: /*#__PURE__*/_jsx(Unchecked, {}),
|
|
106
|
-
defaultChecked: false
|
|
107
|
-
}));
|
|
108
|
-
wrapper.simulate('click');
|
|
109
|
-
expect(wrapper.state('checked')).toBe(true);
|
|
110
|
-
});
|
|
111
|
-
});
|
|
@@ -1,141 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { shallow } from 'enzyme';
|
|
3
|
-
import { act } from 'react-dom/test-utils';
|
|
4
|
-
import CountdownTimer, { getFormattedTimeString } from "./index";
|
|
5
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
6
|
-
describe('<CountdownTimer>', () => {
|
|
7
|
-
jest.useFakeTimers();
|
|
8
|
-
|
|
9
|
-
/**
|
|
10
|
-
* Creates a new countdown timer element.
|
|
11
|
-
* @param {number} remainingDays The remaining days.
|
|
12
|
-
* @param {number} remainingHours The remaining hours.
|
|
13
|
-
* @param {number} remainingMinutes The remaining minutes.
|
|
14
|
-
* @param {number} remainingSeconds The remaining seconds.
|
|
15
|
-
* @param {Function} callback The expiration callback.
|
|
16
|
-
* @return {JSX}
|
|
17
|
-
*/
|
|
18
|
-
const createTimerElement = (remainingDays, remainingHours, remainingMinutes, remainingSeconds, callback) => {
|
|
19
|
-
const timeout = Math.floor(Date.now() / 1000) + remainingDays * 86400 + remainingHours * 3600 + remainingMinutes * 60 + remainingSeconds;
|
|
20
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(CountdownTimer, {
|
|
21
|
-
timeout: timeout,
|
|
22
|
-
onExpire: callback
|
|
23
|
-
}));
|
|
24
|
-
let currentTimeOffset = timeout - Math.floor(Date.now() / 1000);
|
|
25
|
-
wrapper.instance().getRemainingTime = () => {
|
|
26
|
-
currentTimeOffset -= 1;
|
|
27
|
-
return currentTimeOffset;
|
|
28
|
-
};
|
|
29
|
-
return wrapper;
|
|
30
|
-
};
|
|
31
|
-
|
|
32
|
-
/**
|
|
33
|
-
* Performs a time format check for a specific remaining time.
|
|
34
|
-
* @param {number} remainingDays The remaining days.
|
|
35
|
-
* @param {number} remainingHours The remaining hours.
|
|
36
|
-
* @param {number} remainingMinutes The remaining minutes.
|
|
37
|
-
* @param {number} remainingSeconds The remaining seconds.
|
|
38
|
-
*/
|
|
39
|
-
const performFormatCheck = (remainingDays, remainingHours, remainingMinutes, remainingSeconds) => {
|
|
40
|
-
jest.clearAllTimers();
|
|
41
|
-
const intervalSpy = jest.spyOn(global, 'setInterval');
|
|
42
|
-
const wrapper = createTimerElement(remainingDays, remainingHours, remainingMinutes, remainingSeconds, null);
|
|
43
|
-
const expectedTimeFormat = getFormattedTimeString(remainingDays, remainingHours, remainingMinutes, remainingSeconds - 1);
|
|
44
|
-
expect(intervalSpy).toHaveBeenCalledTimes(1);
|
|
45
|
-
act(() => {
|
|
46
|
-
jest.advanceTimersByTime(1000);
|
|
47
|
-
});
|
|
48
|
-
wrapper.update();
|
|
49
|
-
const {
|
|
50
|
-
params,
|
|
51
|
-
string
|
|
52
|
-
} = wrapper.props();
|
|
53
|
-
expect({
|
|
54
|
-
params,
|
|
55
|
-
string
|
|
56
|
-
}).toEqual(expectedTimeFormat);
|
|
57
|
-
intervalSpy.mockRestore();
|
|
58
|
-
};
|
|
59
|
-
it('should render the correct time for < 24h', () => performFormatCheck(0, 0, 0, 5));
|
|
60
|
-
it('should render the correct time for 24h - 48h', () => performFormatCheck(1, 12, 6, 5));
|
|
61
|
-
it('should render the correct time for > 2d', () => performFormatCheck(30, 1, 2, 3));
|
|
62
|
-
it('should not render negative durations', () => {
|
|
63
|
-
jest.clearAllTimers();
|
|
64
|
-
const wrapper = createTimerElement(-1, -2, -3, -5, null);
|
|
65
|
-
const expectedTimeFormat = getFormattedTimeString(0, 0, 0, 0);
|
|
66
|
-
act(() => {
|
|
67
|
-
jest.advanceTimersByTime(1000);
|
|
68
|
-
});
|
|
69
|
-
const {
|
|
70
|
-
params,
|
|
71
|
-
string
|
|
72
|
-
} = wrapper.props();
|
|
73
|
-
expect({
|
|
74
|
-
params,
|
|
75
|
-
string
|
|
76
|
-
}).toEqual(expectedTimeFormat);
|
|
77
|
-
});
|
|
78
|
-
it('should stop at 00:00:00 when the timer expires', () => {
|
|
79
|
-
const wrapper = createTimerElement(0, 0, 0, 1, null);
|
|
80
|
-
const expectedTimeFormat = getFormattedTimeString(0, 0, 0, 0);
|
|
81
|
-
act(() => {
|
|
82
|
-
jest.advanceTimersByTime(1000);
|
|
83
|
-
});
|
|
84
|
-
wrapper.update();
|
|
85
|
-
let {
|
|
86
|
-
params,
|
|
87
|
-
string
|
|
88
|
-
} = wrapper.props();
|
|
89
|
-
expect({
|
|
90
|
-
params,
|
|
91
|
-
string
|
|
92
|
-
}).toEqual(expectedTimeFormat);
|
|
93
|
-
act(() => {
|
|
94
|
-
jest.advanceTimersByTime(1000);
|
|
95
|
-
});
|
|
96
|
-
({
|
|
97
|
-
params,
|
|
98
|
-
string
|
|
99
|
-
} = wrapper.props());
|
|
100
|
-
expect({
|
|
101
|
-
params,
|
|
102
|
-
string
|
|
103
|
-
}).toEqual(expectedTimeFormat);
|
|
104
|
-
});
|
|
105
|
-
it('should invoke the callback when the timer expires', () => {
|
|
106
|
-
let timesCallbackInvoked = 0;
|
|
107
|
-
/**
|
|
108
|
-
* The callback method will just increment a counter when invoked.
|
|
109
|
-
*/
|
|
110
|
-
const callback = () => {
|
|
111
|
-
timesCallbackInvoked += 1;
|
|
112
|
-
};
|
|
113
|
-
createTimerElement(0, 0, 0, 2, callback);
|
|
114
|
-
act(() => {
|
|
115
|
-
jest.advanceTimersByTime(1000);
|
|
116
|
-
});
|
|
117
|
-
expect(timesCallbackInvoked).toBe(0);
|
|
118
|
-
act(() => {
|
|
119
|
-
jest.advanceTimersByTime(1000);
|
|
120
|
-
});
|
|
121
|
-
expect(timesCallbackInvoked).toBe(1);
|
|
122
|
-
act(() => {
|
|
123
|
-
jest.advanceTimersByTime(1000);
|
|
124
|
-
});
|
|
125
|
-
expect(timesCallbackInvoked).toBe(1);
|
|
126
|
-
});
|
|
127
|
-
it('should not invoke the callback when the timeout is already expired.', () => {
|
|
128
|
-
let timesCallbackInvoked = 0;
|
|
129
|
-
/**
|
|
130
|
-
* The callback method will just increment a counter when invoked.
|
|
131
|
-
*/
|
|
132
|
-
const callback = () => {
|
|
133
|
-
timesCallbackInvoked += 1;
|
|
134
|
-
};
|
|
135
|
-
createTimerElement(0, 0, 0, 0, callback);
|
|
136
|
-
act(() => {
|
|
137
|
-
jest.advanceTimersByTime(1000);
|
|
138
|
-
});
|
|
139
|
-
expect(timesCallbackInvoked).toBe(0);
|
|
140
|
-
});
|
|
141
|
-
});
|
|
@@ -1,79 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { mount, shallow } from 'enzyme';
|
|
3
|
-
import Drawer from "./index";
|
|
4
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
5
|
-
jest.mock('@shopgate/engage/a11y/components');
|
|
6
|
-
describe('<Drawer />', () => {
|
|
7
|
-
const onOpen = jest.fn();
|
|
8
|
-
const onClose = jest.fn();
|
|
9
|
-
const onDidOpen = jest.fn();
|
|
10
|
-
const onDidClose = jest.fn();
|
|
11
|
-
beforeEach(() => {
|
|
12
|
-
jest.clearAllMocks();
|
|
13
|
-
});
|
|
14
|
-
it('should render', () => {
|
|
15
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(Drawer, {}));
|
|
16
|
-
expect(wrapper).toMatchSnapshot();
|
|
17
|
-
});
|
|
18
|
-
it('should execute callback when drawer is opened', () => {
|
|
19
|
-
const wrapper = mount(/*#__PURE__*/_jsx(Drawer, {
|
|
20
|
-
onOpen: onOpen
|
|
21
|
-
}));
|
|
22
|
-
wrapper.setProps({
|
|
23
|
-
isOpen: true
|
|
24
|
-
});
|
|
25
|
-
expect(onOpen).toBeCalled();
|
|
26
|
-
});
|
|
27
|
-
it('should execute callback when drawer is closed', () => {
|
|
28
|
-
const wrapper = mount(/*#__PURE__*/_jsx(Drawer, {
|
|
29
|
-
isOpen: true,
|
|
30
|
-
onClose: onClose
|
|
31
|
-
}));
|
|
32
|
-
wrapper.setProps({
|
|
33
|
-
isOpen: false
|
|
34
|
-
});
|
|
35
|
-
expect(onClose).toBeCalled();
|
|
36
|
-
});
|
|
37
|
-
it('should add custom classes', () => {
|
|
38
|
-
const wrapper = mount(/*#__PURE__*/_jsx(Drawer, {
|
|
39
|
-
className: "custom-class-name",
|
|
40
|
-
isOpen: true
|
|
41
|
-
}));
|
|
42
|
-
expect(wrapper).toMatchSnapshot();
|
|
43
|
-
expect(wrapper.hasClass('custom-class-name')).toEqual(true);
|
|
44
|
-
});
|
|
45
|
-
it('should execute callback when drawer open animation did end', () => {
|
|
46
|
-
const wrapper = mount(/*#__PURE__*/_jsx(Drawer, {
|
|
47
|
-
className: "custom-class-name",
|
|
48
|
-
isOpen: false,
|
|
49
|
-
onOpen: onOpen,
|
|
50
|
-
onDidOpen: onDidOpen
|
|
51
|
-
}));
|
|
52
|
-
expect(wrapper).toMatchSnapshot();
|
|
53
|
-
wrapper.setProps({
|
|
54
|
-
isOpen: true
|
|
55
|
-
});
|
|
56
|
-
wrapper.update();
|
|
57
|
-
expect(onOpen).toBeCalled();
|
|
58
|
-
expect(onDidOpen).not.toBeCalled();
|
|
59
|
-
wrapper.find('[role="dialog"]').simulate('animationEnd');
|
|
60
|
-
expect(onDidOpen).toBeCalled();
|
|
61
|
-
});
|
|
62
|
-
it('should execute callback when drawer close animation did end', () => {
|
|
63
|
-
const wrapper = mount(/*#__PURE__*/_jsx(Drawer, {
|
|
64
|
-
className: "custom-class-name",
|
|
65
|
-
isOpen: true,
|
|
66
|
-
onClose: onClose,
|
|
67
|
-
onDidClose: onDidClose
|
|
68
|
-
}));
|
|
69
|
-
expect(wrapper).toMatchSnapshot();
|
|
70
|
-
wrapper.setProps({
|
|
71
|
-
isOpen: false
|
|
72
|
-
});
|
|
73
|
-
wrapper.update();
|
|
74
|
-
expect(onClose).toBeCalled();
|
|
75
|
-
expect(onDidClose).not.toBeCalled();
|
|
76
|
-
wrapper.find('[role="dialog"]').simulate('animationEnd');
|
|
77
|
-
expect(onDidClose).toBeCalled();
|
|
78
|
-
});
|
|
79
|
-
});
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { shallow } from 'enzyme';
|
|
3
|
-
import Ellipsis from "./index";
|
|
4
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
5
|
-
const clamp = 3;
|
|
6
|
-
const text = 'Some very long text that should be cut off by this ellipsis component.';
|
|
7
|
-
describe('<Ellipsis />', () => {
|
|
8
|
-
it('should render', () => {
|
|
9
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(Ellipsis, {
|
|
10
|
-
rows: clamp,
|
|
11
|
-
children: text
|
|
12
|
-
}));
|
|
13
|
-
expect(wrapper).toMatchSnapshot();
|
|
14
|
-
});
|
|
15
|
-
});
|
|
@@ -1,61 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { shallow } from 'enzyme';
|
|
3
|
-
import { embeddedMedia } from '@shopgate/pwa-common/collections';
|
|
4
|
-
import EmbeddedMedia from "./index";
|
|
5
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
6
|
-
jest.mock('@shopgate/pwa-common/collections', () => ({
|
|
7
|
-
embeddedMedia: {
|
|
8
|
-
getHasPendingProviders: jest.fn(),
|
|
9
|
-
providers: new Set([{
|
|
10
|
-
isPending: false,
|
|
11
|
-
remoteScriptUrl: 'http://foo.bar'
|
|
12
|
-
}, {
|
|
13
|
-
isPending: true,
|
|
14
|
-
remoteScriptUrl: 'http://bar.foo',
|
|
15
|
-
onScriptLoaded: jest.fn()
|
|
16
|
-
}])
|
|
17
|
-
}
|
|
18
|
-
}));
|
|
19
|
-
describe('<EmbeddedMedia />', () => {
|
|
20
|
-
beforeEach(() => {
|
|
21
|
-
jest.clearAllMocks();
|
|
22
|
-
});
|
|
23
|
-
it('should return children', () => {
|
|
24
|
-
embeddedMedia.getHasPendingProviders.mockReturnValueOnce(false);
|
|
25
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(EmbeddedMedia, {
|
|
26
|
-
children: /*#__PURE__*/_jsx("div", {
|
|
27
|
-
children: "Children"
|
|
28
|
-
})
|
|
29
|
-
}));
|
|
30
|
-
expect(wrapper.html()).toEqual('<div>Children</div>');
|
|
31
|
-
});
|
|
32
|
-
it.skip('should render Helmet with a script', () => {
|
|
33
|
-
embeddedMedia.getHasPendingProviders.mockReturnValueOnce(true);
|
|
34
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(EmbeddedMedia, {
|
|
35
|
-
children: /*#__PURE__*/_jsx("div", {
|
|
36
|
-
children: "Content with embedded media (youtube, vimeo, etc)"
|
|
37
|
-
})
|
|
38
|
-
}));
|
|
39
|
-
const helmetProps = wrapper.find('HelmetWrapper').props();
|
|
40
|
-
expect(helmetProps).toEqual({
|
|
41
|
-
defer: true,
|
|
42
|
-
encodeSpecialCharacters: true,
|
|
43
|
-
onChangeClientState() {},
|
|
44
|
-
script: []
|
|
45
|
-
});
|
|
46
|
-
const scriptTags = [{
|
|
47
|
-
onload: jest.fn(),
|
|
48
|
-
getAttribute: jest.fn().mockReturnValue('http://bar.foo')
|
|
49
|
-
}];
|
|
50
|
-
|
|
51
|
-
// Invoke helmet cb
|
|
52
|
-
helmetProps.onChangeClientState(null, {
|
|
53
|
-
scriptTags
|
|
54
|
-
});
|
|
55
|
-
|
|
56
|
-
// Invoke onload on script
|
|
57
|
-
scriptTags[0].onload();
|
|
58
|
-
const [, secondProvider] = embeddedMedia.providers;
|
|
59
|
-
expect(secondProvider.onScriptLoaded).toHaveBeenCalledTimes(1);
|
|
60
|
-
});
|
|
61
|
-
});
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { shallow } from 'enzyme';
|
|
3
|
-
import GridItem from "./index";
|
|
4
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
5
|
-
describe('<GridItem />', () => {
|
|
6
|
-
it('should render without any further props', () => {
|
|
7
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(GridItem, {}));
|
|
8
|
-
expect(wrapper).toMatchSnapshot();
|
|
9
|
-
});
|
|
10
|
-
it('should be able to render a custom tag', () => {
|
|
11
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(GridItem, {
|
|
12
|
-
component: "section"
|
|
13
|
-
}));
|
|
14
|
-
expect(wrapper).toMatchSnapshot();
|
|
15
|
-
expect(wrapper.type()).toEqual('section');
|
|
16
|
-
});
|
|
17
|
-
it('should add custom classes on demand', () => {
|
|
18
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(GridItem, {
|
|
19
|
-
className: "custom-class-name"
|
|
20
|
-
}));
|
|
21
|
-
expect(wrapper).toMatchSnapshot();
|
|
22
|
-
expect(wrapper.hasClass('custom-class-name')).toEqual(true);
|
|
23
|
-
});
|
|
24
|
-
});
|
package/components/Grid/spec.js
DELETED
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { shallow } from 'enzyme';
|
|
3
|
-
import Grid from "./index";
|
|
4
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
5
|
-
describe('<Grid />', () => {
|
|
6
|
-
it('should render without any further props', () => {
|
|
7
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(Grid, {}));
|
|
8
|
-
expect(wrapper).toMatchSnapshot();
|
|
9
|
-
});
|
|
10
|
-
it('should be able to render a custom tag', () => {
|
|
11
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(Grid, {
|
|
12
|
-
component: "article"
|
|
13
|
-
}));
|
|
14
|
-
expect(wrapper).toMatchSnapshot();
|
|
15
|
-
expect(wrapper.type()).toEqual('article');
|
|
16
|
-
});
|
|
17
|
-
it('should add custom classes on demand', () => {
|
|
18
|
-
const wrapper = shallow(/*#__PURE__*/_jsx(Grid, {
|
|
19
|
-
className: "custom-class-name"
|
|
20
|
-
}));
|
|
21
|
-
expect(wrapper).toMatchSnapshot();
|
|
22
|
-
expect(wrapper.hasClass('custom-class-name')).toEqual(true);
|
|
23
|
-
});
|
|
24
|
-
});
|
|
@@ -1,229 +0,0 @@
|
|
|
1
|
-
/** @jest-environment jsdom */
|
|
2
|
-
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import { mount } from 'enzyme';
|
|
5
|
-
import { embeddedMedia } from '@shopgate/pwa-common/collections';
|
|
6
|
-
import HtmlSanitizer from "./index";
|
|
7
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
-
jest.mock("../EmbeddedMedia", () => ({
|
|
9
|
-
children
|
|
10
|
-
}) => children);
|
|
11
|
-
jest.mock("./connector", () => Cmp => Cmp);
|
|
12
|
-
|
|
13
|
-
/**
|
|
14
|
-
* @param {string} html HTML markup.
|
|
15
|
-
* @param {Object} props Component props.
|
|
16
|
-
* @returns {JSX.Element}
|
|
17
|
-
*/
|
|
18
|
-
const createWrapper = (html, props = {}) => mount(/*#__PURE__*/_jsx(HtmlSanitizer, {
|
|
19
|
-
navigate: () => {},
|
|
20
|
-
...props,
|
|
21
|
-
children: html
|
|
22
|
-
}));
|
|
23
|
-
describe('<HtmlSanitizer />', () => {
|
|
24
|
-
let embeddedMediaAddSpy;
|
|
25
|
-
let embeddedMediaRemoveSpy;
|
|
26
|
-
let embeddedMediaHandleCookieConsentSpy;
|
|
27
|
-
beforeEach(() => {
|
|
28
|
-
jest.clearAllMocks();
|
|
29
|
-
embeddedMediaAddSpy = jest.spyOn(embeddedMedia, 'add');
|
|
30
|
-
embeddedMediaRemoveSpy = jest.spyOn(embeddedMedia, 'remove');
|
|
31
|
-
embeddedMediaHandleCookieConsentSpy = jest.spyOn(embeddedMedia, 'handleCookieConsent');
|
|
32
|
-
});
|
|
33
|
-
it('should render the HtmlSanitizer', () => {
|
|
34
|
-
/**
|
|
35
|
-
* The value for html is the HTML-escaped equivalent of the following:
|
|
36
|
-
* <h1>Hello World!</h1>
|
|
37
|
-
* @type {string}
|
|
38
|
-
*/
|
|
39
|
-
const html = '<h1>Hello World!</h1>';
|
|
40
|
-
const wrapper = createWrapper(html, {
|
|
41
|
-
decode: true
|
|
42
|
-
});
|
|
43
|
-
|
|
44
|
-
// Test result of dangerouslySetInnerHTML.
|
|
45
|
-
expect(wrapper.html()).toEqual('<div class="common__html-sanitizer"><h1>Hello World!</h1></div>');
|
|
46
|
-
expect(wrapper.render()).toMatchSnapshot();
|
|
47
|
-
});
|
|
48
|
-
it('should add and remove handlers for embedded media', () => {
|
|
49
|
-
const wrapper = createWrapper('<div></div>', {
|
|
50
|
-
decode: true
|
|
51
|
-
});
|
|
52
|
-
const ref = wrapper.instance().htmlContainer.current;
|
|
53
|
-
expect(embeddedMediaAddSpy).toHaveBeenCalledTimes(1);
|
|
54
|
-
expect(embeddedMediaAddSpy).toHaveBeenCalledWith(ref);
|
|
55
|
-
expect(embeddedMediaRemoveSpy).toHaveBeenCalledTimes(0);
|
|
56
|
-
wrapper.setProps({
|
|
57
|
-
children: '<span></span>'
|
|
58
|
-
});
|
|
59
|
-
expect(embeddedMediaAddSpy).toHaveBeenCalledTimes(2);
|
|
60
|
-
expect(embeddedMediaAddSpy).toHaveBeenCalledWith(ref);
|
|
61
|
-
expect(embeddedMediaRemoveSpy).toHaveBeenCalledTimes(0);
|
|
62
|
-
wrapper.unmount();
|
|
63
|
-
expect(embeddedMediaAddSpy).toHaveBeenCalledTimes(2);
|
|
64
|
-
expect(embeddedMediaRemoveSpy).toHaveBeenCalledTimes(1);
|
|
65
|
-
expect(embeddedMediaRemoveSpy).toHaveBeenCalledWith(ref);
|
|
66
|
-
});
|
|
67
|
-
it('strips out images with relative paths', () => {
|
|
68
|
-
const html = `
|
|
69
|
-
<div>
|
|
70
|
-
<style>a { color: red }</style>
|
|
71
|
-
<a href="foo">
|
|
72
|
-
<img src="bar.jpg" />
|
|
73
|
-
</a>
|
|
74
|
-
</div>
|
|
75
|
-
`;
|
|
76
|
-
const wrapper = createWrapper(html);
|
|
77
|
-
expect(wrapper.html()).not.toContain('<img');
|
|
78
|
-
expect(wrapper.html()).toContain('<style>');
|
|
79
|
-
expect(wrapper.render()).toMatchSnapshot();
|
|
80
|
-
});
|
|
81
|
-
it('should move style blocks out of the content', () => {
|
|
82
|
-
const html = `
|
|
83
|
-
<div>
|
|
84
|
-
<style>a { color: red }</style>
|
|
85
|
-
<a href="foo">
|
|
86
|
-
<img src="bar.jpg" />
|
|
87
|
-
</a>
|
|
88
|
-
</div>
|
|
89
|
-
`;
|
|
90
|
-
const wrapper = createWrapper(html, {
|
|
91
|
-
processStyles: true
|
|
92
|
-
});
|
|
93
|
-
expect(wrapper.html()).not.toContain('<style>');
|
|
94
|
-
});
|
|
95
|
-
it('does not strip out images with absolute paths', () => {
|
|
96
|
-
const html = `
|
|
97
|
-
<div>
|
|
98
|
-
<a href="foo">
|
|
99
|
-
<img src="http://google.de/bar.jpg" />
|
|
100
|
-
</a>
|
|
101
|
-
</div>
|
|
102
|
-
`;
|
|
103
|
-
const wrapper = createWrapper(html);
|
|
104
|
-
expect(wrapper.html()).toContain('<img');
|
|
105
|
-
expect(wrapper.render()).toMatchSnapshot();
|
|
106
|
-
});
|
|
107
|
-
it('strips out the script tags', () => {
|
|
108
|
-
/**
|
|
109
|
-
* The value for html is the HTML-escaped equivalent of the following:
|
|
110
|
-
* <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>
|
|
111
|
-
* <script type="text/javascript">var x = 42;</script>
|
|
112
|
-
* <p>Foo Bar</p>
|
|
113
|
-
* <script>var y = 23;</script>
|
|
114
|
-
* @type {string}
|
|
115
|
-
*/
|
|
116
|
-
const html = '<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script> <script type="text/javascript">var x = 42;</script> <p>Foo Bar</p> <script>var y = 23;</script>';
|
|
117
|
-
const wrapper = createWrapper(html, {
|
|
118
|
-
decode: true
|
|
119
|
-
});
|
|
120
|
-
|
|
121
|
-
// Test result of dangerouslySetInnerHTML.
|
|
122
|
-
expect(wrapper.html()).toEqual('<div class="common__html-sanitizer"> <p>Foo Bar</p> </div>');
|
|
123
|
-
expect(wrapper).toMatchSnapshot();
|
|
124
|
-
});
|
|
125
|
-
describe('Link handling', () => {
|
|
126
|
-
const mockedHandleClick = jest.fn();
|
|
127
|
-
beforeEach(() => {
|
|
128
|
-
mockedHandleClick.mockClear();
|
|
129
|
-
});
|
|
130
|
-
it('follows a link from a plain <a>', () => {
|
|
131
|
-
// Create a real container element in the current document
|
|
132
|
-
const attachNode = document.createElement('div');
|
|
133
|
-
document.body.appendChild(attachNode);
|
|
134
|
-
const html = '<a id="link" href="#follow-me-and-everything-is-alright">Plain Link</a>';
|
|
135
|
-
const wrapper = mount(/*#__PURE__*/_jsx(HtmlSanitizer, {
|
|
136
|
-
decode: true,
|
|
137
|
-
settings: {
|
|
138
|
-
handleClick: mockedHandleClick
|
|
139
|
-
},
|
|
140
|
-
navigate: () => {},
|
|
141
|
-
children: html
|
|
142
|
-
}), {
|
|
143
|
-
attachTo: attachNode
|
|
144
|
-
});
|
|
145
|
-
const aTag = attachNode.getElementsByTagName('a')[0];
|
|
146
|
-
aTag.closest = () => aTag;
|
|
147
|
-
const event = {
|
|
148
|
-
target: aTag,
|
|
149
|
-
preventDefault: () => {}
|
|
150
|
-
};
|
|
151
|
-
wrapper.instance().handleClick(event);
|
|
152
|
-
expect(mockedHandleClick).toHaveBeenCalledTimes(1);
|
|
153
|
-
expect(mockedHandleClick).toHaveBeenCalledWith('#follow-me-and-everything-is-alright', '');
|
|
154
|
-
wrapper.unmount();
|
|
155
|
-
attachNode.remove();
|
|
156
|
-
});
|
|
157
|
-
it('follows a link from a <a> with other HTML inside', () => {
|
|
158
|
-
const attachNode = document.createElement('div');
|
|
159
|
-
document.body.appendChild(attachNode);
|
|
160
|
-
const html = '<a id="link" target="_blank" href="#I-ll-be-the-one-to-tuck-you-in-at-night"><span>Span Link</span></a>';
|
|
161
|
-
const wrapper = mount(/*#__PURE__*/_jsx(HtmlSanitizer, {
|
|
162
|
-
decode: true,
|
|
163
|
-
settings: {
|
|
164
|
-
handleClick: mockedHandleClick
|
|
165
|
-
},
|
|
166
|
-
navigate: () => {},
|
|
167
|
-
children: html
|
|
168
|
-
}), {
|
|
169
|
-
attachTo: attachNode
|
|
170
|
-
});
|
|
171
|
-
const aTag = attachNode.getElementsByTagName('a')[0];
|
|
172
|
-
const spanTag = attachNode.getElementsByTagName('span')[0];
|
|
173
|
-
spanTag.closest = () => aTag;
|
|
174
|
-
const event = {
|
|
175
|
-
target: spanTag,
|
|
176
|
-
preventDefault: () => {}
|
|
177
|
-
};
|
|
178
|
-
wrapper.instance().handleClick(event);
|
|
179
|
-
expect(mockedHandleClick).toHaveBeenCalledTimes(1);
|
|
180
|
-
expect(mockedHandleClick).toHaveBeenCalledWith('#I-ll-be-the-one-to-tuck-you-in-at-night', '_blank');
|
|
181
|
-
});
|
|
182
|
-
});
|
|
183
|
-
describe('Cookie consent handling', () => {
|
|
184
|
-
it('should invoke handleCookieConsent method of embedded media with default cookie consent settings', () => {
|
|
185
|
-
createWrapper('<div></div>', {
|
|
186
|
-
decode: true
|
|
187
|
-
});
|
|
188
|
-
expect(embeddedMediaHandleCookieConsentSpy).toHaveBeenCalledTimes(1);
|
|
189
|
-
expect(embeddedMediaHandleCookieConsentSpy).toHaveBeenCalledWith(expect.any(Document), {
|
|
190
|
-
comfortCookiesAccepted: false,
|
|
191
|
-
statisticsCookiesAccepted: false
|
|
192
|
-
});
|
|
193
|
-
});
|
|
194
|
-
it('should invoke handleCookieConsent method of embedded media with accepted comfort cookies', () => {
|
|
195
|
-
createWrapper('<div></div>', {
|
|
196
|
-
decode: true,
|
|
197
|
-
comfortCookiesAccepted: true
|
|
198
|
-
});
|
|
199
|
-
expect(embeddedMediaHandleCookieConsentSpy).toHaveBeenCalledTimes(1);
|
|
200
|
-
expect(embeddedMediaHandleCookieConsentSpy).toHaveBeenCalledWith(expect.any(Document), {
|
|
201
|
-
comfortCookiesAccepted: true,
|
|
202
|
-
statisticsCookiesAccepted: false
|
|
203
|
-
});
|
|
204
|
-
});
|
|
205
|
-
it('should invoke handleCookieConsent method of embedded media with accepted statistics cookies', () => {
|
|
206
|
-
createWrapper('<div></div>', {
|
|
207
|
-
decode: true,
|
|
208
|
-
statisticsCookiesAccepted: true
|
|
209
|
-
});
|
|
210
|
-
expect(embeddedMediaHandleCookieConsentSpy).toHaveBeenCalledTimes(1);
|
|
211
|
-
expect(embeddedMediaHandleCookieConsentSpy).toHaveBeenCalledWith(expect.any(Document), {
|
|
212
|
-
comfortCookiesAccepted: false,
|
|
213
|
-
statisticsCookiesAccepted: true
|
|
214
|
-
});
|
|
215
|
-
});
|
|
216
|
-
it('should invoke handleCookieConsent method of embedded media with all cookies accepted', () => {
|
|
217
|
-
createWrapper('<div></div>', {
|
|
218
|
-
decode: true,
|
|
219
|
-
comfortCookiesAccepted: true,
|
|
220
|
-
statisticsCookiesAccepted: true
|
|
221
|
-
});
|
|
222
|
-
expect(embeddedMediaHandleCookieConsentSpy).toHaveBeenCalledTimes(1);
|
|
223
|
-
expect(embeddedMediaHandleCookieConsentSpy).toHaveBeenCalledWith(expect.any(Document), {
|
|
224
|
-
comfortCookiesAccepted: true,
|
|
225
|
-
statisticsCookiesAccepted: true
|
|
226
|
-
});
|
|
227
|
-
});
|
|
228
|
-
});
|
|
229
|
-
});
|