@applicaster/zapp-react-native-ui-components 14.0.0-rc.46 → 14.0.0-rc.48
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/Components/FreezeWithCallback/__tests__/index.test.tsx +67 -43
- package/Components/Layout/TV/__tests__/index.test.tsx +0 -1
- package/Components/MasterCell/DefaultComponents/__tests__/image.test.js +10 -10
- package/Components/MasterCell/DefaultComponents/__tests__/text.test.tsx +18 -18
- package/Components/MasterCell/SharedUI/CollapsibleTextContainer/__tests__/index.test.tsx +10 -10
- package/Components/OfflineHandler/__tests__/index.test.tsx +6 -13
- package/Components/River/ComponentsMap/hooks/__tests__/useLoadingState.test.ts +0 -1
- package/Components/Screen/__tests__/Screen.test.tsx +5 -17
- package/Components/Tabs/Tabs.tsx +2 -3
- package/Components/Touchable/__tests__/touchable.test.tsx +12 -17
- package/Components/VideoModal/__tests__/PlayerDetails.test.tsx +5 -5
- package/Contexts/ConfigutaionContext/__tests__/ConfigurationProvider.test.tsx +3 -3
- package/Decorators/ConfigurationWrapper/__tests__/withConfigurationProvider.test.tsx +3 -3
- package/package.json +5 -5
|
@@ -1,19 +1,18 @@
|
|
|
1
1
|
import React, { Dispatch, useEffect, useState } from "react";
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
create,
|
|
5
|
-
ReactTestRenderer,
|
|
6
|
-
ReactTestRendererJSON,
|
|
7
|
-
} from "react-test-renderer";
|
|
2
|
+
import { act, render } from "@testing-library/react-native";
|
|
3
|
+
import { View } from "react-native";
|
|
8
4
|
import { FreezeWithCallback } from "../index";
|
|
9
5
|
|
|
10
|
-
const SimpleContent = () => <
|
|
6
|
+
const SimpleContent = () => <View testID="simple-content" />;
|
|
11
7
|
|
|
12
8
|
interface InnerProps {
|
|
13
9
|
value: number;
|
|
14
10
|
}
|
|
11
|
+
|
|
15
12
|
// eslint-disable-next-line unused-imports/no-unused-vars
|
|
16
|
-
const Inner = ({ value }: InnerProps) =>
|
|
13
|
+
const Inner = ({ value }: InnerProps) => (
|
|
14
|
+
<View testID="inner-component" data-value={value} />
|
|
15
|
+
);
|
|
17
16
|
|
|
18
17
|
interface TestSubscriber {
|
|
19
18
|
renderCount: number;
|
|
@@ -51,24 +50,20 @@ const Container = ({ freeze, children }: ContainerProps) => (
|
|
|
51
50
|
);
|
|
52
51
|
|
|
53
52
|
function setupTest(initialFreeze: boolean = false) {
|
|
54
|
-
let testRenderer: ReactTestRenderer | undefined;
|
|
55
53
|
const [Subscriber, subscriberState] = createSubscriberComponent();
|
|
56
54
|
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
<
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
);
|
|
63
|
-
});
|
|
55
|
+
const renderResult = render(
|
|
56
|
+
<Container freeze={initialFreeze}>
|
|
57
|
+
<Subscriber />
|
|
58
|
+
</Container>
|
|
59
|
+
);
|
|
64
60
|
|
|
65
61
|
return {
|
|
66
|
-
|
|
67
|
-
testInstance: testRenderer?.root,
|
|
62
|
+
renderResult,
|
|
68
63
|
subscriberState,
|
|
69
64
|
updateFreeze: (freeze: boolean) => {
|
|
70
65
|
act(() =>
|
|
71
|
-
|
|
66
|
+
renderResult.rerender(
|
|
72
67
|
<Container freeze={freeze}>
|
|
73
68
|
<Subscriber />
|
|
74
69
|
</Container>
|
|
@@ -80,91 +75,120 @@ function setupTest(initialFreeze: boolean = false) {
|
|
|
80
75
|
|
|
81
76
|
describe("FreezeWithCallback", () => {
|
|
82
77
|
test("Renders stuff not frozen", () => {
|
|
83
|
-
const
|
|
78
|
+
const { getByTestId } = render(
|
|
84
79
|
<Container freeze={false}>
|
|
85
80
|
<SimpleContent />
|
|
86
81
|
</Container>
|
|
87
82
|
);
|
|
88
83
|
|
|
89
|
-
expect(
|
|
84
|
+
expect(getByTestId("simple-content")).toBeTruthy();
|
|
90
85
|
});
|
|
91
86
|
|
|
92
87
|
test("Does not render stuff when frozen", () => {
|
|
93
|
-
const
|
|
88
|
+
const { queryByTestId } = render(
|
|
94
89
|
<Container freeze>
|
|
95
90
|
<SimpleContent />
|
|
96
91
|
</Container>
|
|
97
92
|
);
|
|
98
93
|
|
|
99
|
-
expect(
|
|
94
|
+
expect(queryByTestId("simple-content")).toBe(null);
|
|
100
95
|
});
|
|
101
96
|
|
|
102
97
|
test("Stuff is gone after freeze", () => {
|
|
103
|
-
const
|
|
98
|
+
const { toJSON, getByTestId, rerender } = render(
|
|
104
99
|
<Container freeze={false}>
|
|
105
100
|
<SimpleContent />
|
|
106
101
|
</Container>
|
|
107
102
|
);
|
|
108
103
|
|
|
109
|
-
expect(
|
|
104
|
+
expect(getByTestId("simple-content")).toBeTruthy();
|
|
110
105
|
|
|
111
106
|
act(() =>
|
|
112
|
-
|
|
107
|
+
rerender(
|
|
113
108
|
<Container freeze>
|
|
114
109
|
<SimpleContent />
|
|
115
110
|
</Container>
|
|
116
111
|
)
|
|
117
112
|
);
|
|
118
113
|
|
|
119
|
-
expect(
|
|
114
|
+
expect(toJSON()).toBe(null);
|
|
120
115
|
});
|
|
121
116
|
|
|
122
117
|
test("Updates work when not frozen", () => {
|
|
123
|
-
const {
|
|
118
|
+
const { renderResult, subscriberState } = setupTest();
|
|
119
|
+
|
|
120
|
+
expect(
|
|
121
|
+
renderResult.getByTestId("inner-component").props["data-value"]
|
|
122
|
+
).toEqual(0);
|
|
124
123
|
|
|
125
|
-
expect(testInstance?.findByType(Inner).props.value).toEqual(0);
|
|
126
124
|
act(() => subscriberState.subscription(1));
|
|
127
|
-
|
|
125
|
+
|
|
126
|
+
expect(
|
|
127
|
+
renderResult.getByTestId("inner-component").props["data-value"]
|
|
128
|
+
).toEqual(1);
|
|
129
|
+
|
|
128
130
|
expect(subscriberState.renderCount).toBe(2);
|
|
129
131
|
});
|
|
130
132
|
|
|
131
133
|
test("Updates does not propagate when frozen", () => {
|
|
132
|
-
const {
|
|
134
|
+
const { renderResult, subscriberState, updateFreeze } = setupTest();
|
|
135
|
+
|
|
136
|
+
expect(
|
|
137
|
+
renderResult.getByTestId("inner-component").props["data-value"]
|
|
138
|
+
).toEqual(0);
|
|
133
139
|
|
|
134
|
-
expect(testInstance?.findByType(Inner).props.value).toEqual(0);
|
|
135
140
|
updateFreeze(true);
|
|
136
141
|
act(() => subscriberState.subscription(1));
|
|
137
|
-
|
|
142
|
+
|
|
143
|
+
expect(
|
|
144
|
+
renderResult.getByTestId("inner-component").props["data-value"]
|
|
145
|
+
).toEqual(0);
|
|
146
|
+
|
|
138
147
|
expect(subscriberState.renderCount).toBe(1);
|
|
139
148
|
});
|
|
140
149
|
|
|
141
150
|
test("State persists after defrost", () => {
|
|
142
|
-
const {
|
|
143
|
-
|
|
151
|
+
const { renderResult, subscriberState, updateFreeze } = setupTest();
|
|
152
|
+
|
|
153
|
+
expect(
|
|
154
|
+
renderResult.getByTestId("inner-component").props["data-value"]
|
|
155
|
+
).toEqual(0);
|
|
144
156
|
|
|
145
|
-
expect(testInstance?.findByType(Inner).props.value).toEqual(0);
|
|
146
157
|
act(() => subscriberState.subscription(1));
|
|
147
|
-
|
|
158
|
+
|
|
159
|
+
expect(
|
|
160
|
+
renderResult.getByTestId("inner-component").props["data-value"]
|
|
161
|
+
).toEqual(1);
|
|
148
162
|
|
|
149
163
|
updateFreeze(true);
|
|
150
|
-
expect(
|
|
164
|
+
expect(renderResult.toJSON()).toBe(null);
|
|
151
165
|
|
|
152
166
|
updateFreeze(false);
|
|
153
|
-
expect((
|
|
154
|
-
|
|
167
|
+
expect(renderResult.getByTestId("inner-component")).toBeTruthy();
|
|
168
|
+
|
|
169
|
+
expect(
|
|
170
|
+
renderResult.getByTestId("inner-component").props["data-value"]
|
|
171
|
+
).toEqual(1);
|
|
155
172
|
});
|
|
156
173
|
|
|
157
174
|
test("Update propagate after defrost", () => {
|
|
158
|
-
const {
|
|
175
|
+
const { renderResult, subscriberState, updateFreeze } = setupTest();
|
|
159
176
|
|
|
160
177
|
updateFreeze(true);
|
|
161
178
|
act(() => subscriberState.subscription(1));
|
|
162
179
|
act(() => subscriberState.subscription(2));
|
|
163
180
|
act(() => subscriberState.subscription(3));
|
|
164
|
-
|
|
181
|
+
|
|
182
|
+
expect(
|
|
183
|
+
renderResult.getByTestId("inner-component").props["data-value"]
|
|
184
|
+
).toEqual(0);
|
|
165
185
|
|
|
166
186
|
updateFreeze(false);
|
|
167
|
-
|
|
187
|
+
|
|
188
|
+
expect(
|
|
189
|
+
renderResult.getByTestId("inner-component").props["data-value"]
|
|
190
|
+
).toEqual(3);
|
|
191
|
+
|
|
168
192
|
expect(subscriberState.renderCount).toBe(2);
|
|
169
193
|
});
|
|
170
194
|
});
|
|
@@ -7,7 +7,6 @@ import { NavigationContext } from "@applicaster/zapp-react-native-ui-components/
|
|
|
7
7
|
import configureStore from "redux-mock-store";
|
|
8
8
|
import Layout from "../index.web";
|
|
9
9
|
|
|
10
|
-
// mock useTheme to provide app_background_color
|
|
11
10
|
jest.mock("@applicaster/zapp-react-native-utils/theme", () => ({
|
|
12
11
|
useTheme: () => ({
|
|
13
12
|
app_background_color: "#000000",
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import
|
|
2
|
+
import { render } from "@testing-library/react-native";
|
|
3
3
|
import { Image } from "react-native";
|
|
4
4
|
|
|
5
5
|
jest.mock("@applicaster/zapp-react-native-utils/theme", () => ({
|
|
@@ -10,35 +10,35 @@ const CustomImage = require("../Image").default;
|
|
|
10
10
|
|
|
11
11
|
describe("image with no source", () => {
|
|
12
12
|
it("Uses provided placeholder image string", () => {
|
|
13
|
-
const
|
|
13
|
+
const { UNSAFE_getByType } = render(
|
|
14
14
|
<CustomImage placeholderImage={"foo"} />
|
|
15
15
|
);
|
|
16
16
|
|
|
17
|
-
const
|
|
17
|
+
const imageComponent = UNSAFE_getByType(Image);
|
|
18
18
|
|
|
19
|
-
expect(
|
|
19
|
+
expect(imageComponent.props.source).toEqual({
|
|
20
20
|
uri: "foo",
|
|
21
21
|
});
|
|
22
22
|
});
|
|
23
23
|
|
|
24
24
|
it("Uses provided placeholder image object", () => {
|
|
25
|
-
const
|
|
25
|
+
const { UNSAFE_getByType } = render(
|
|
26
26
|
<CustomImage placeholderImage={"foo"} />
|
|
27
27
|
);
|
|
28
28
|
|
|
29
|
-
const
|
|
29
|
+
const imageComponent = UNSAFE_getByType(Image);
|
|
30
30
|
|
|
31
|
-
expect(
|
|
31
|
+
expect(imageComponent.props.source).toEqual({
|
|
32
32
|
uri: "foo",
|
|
33
33
|
});
|
|
34
34
|
});
|
|
35
35
|
|
|
36
36
|
it("Returns empty string if no image or placeholder defined", () => {
|
|
37
|
-
const
|
|
37
|
+
const { UNSAFE_getByType } = render(
|
|
38
38
|
<CustomImage placeholderImage={null} />
|
|
39
39
|
);
|
|
40
40
|
|
|
41
|
-
const
|
|
42
|
-
expect(
|
|
41
|
+
const imageComponent = UNSAFE_getByType(Image);
|
|
42
|
+
expect(imageComponent.props.source).toBeUndefined();
|
|
43
43
|
});
|
|
44
44
|
});
|
|
@@ -1,8 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import RN from "react-native";
|
|
3
|
-
import {
|
|
4
|
-
import TestRenderer from "react-test-renderer";
|
|
5
|
-
import configureStoreFn from "redux-mock-store";
|
|
3
|
+
import { renderWithProviders } from "@applicaster/zapp-react-native-utils/testUtils";
|
|
6
4
|
|
|
7
5
|
const mockUseIsRTL = jest.fn(() => true);
|
|
8
6
|
const mockGetIsRTL = jest.fn(() => true);
|
|
@@ -17,7 +15,6 @@ jest.mock("@applicaster/zapp-react-native-utils/localizationUtils", () => ({
|
|
|
17
15
|
}));
|
|
18
16
|
|
|
19
17
|
const CustomText = require("../Text").default;
|
|
20
|
-
const mockStore = configureStoreFn();
|
|
21
18
|
|
|
22
19
|
const defaultProps = {
|
|
23
20
|
entry: {},
|
|
@@ -25,16 +22,15 @@ const defaultProps = {
|
|
|
25
22
|
transformText: "default",
|
|
26
23
|
};
|
|
27
24
|
|
|
28
|
-
const getRenderedText = (label: string,
|
|
25
|
+
const getRenderedText = (label: string, storeConfig: any) => {
|
|
29
26
|
const props = { ...{ ...defaultProps, label } };
|
|
30
27
|
|
|
31
|
-
const
|
|
32
|
-
<
|
|
33
|
-
|
|
34
|
-
</Provider>
|
|
28
|
+
const { UNSAFE_getByType } = renderWithProviders(
|
|
29
|
+
<CustomText {...props} />,
|
|
30
|
+
storeConfig
|
|
35
31
|
);
|
|
36
32
|
|
|
37
|
-
return
|
|
33
|
+
return UNSAFE_getByType(RN.Text).props.children;
|
|
38
34
|
};
|
|
39
35
|
|
|
40
36
|
describe("RTL app: Hebrew text contains english word", () => {
|
|
@@ -42,28 +38,32 @@ describe("RTL app: Hebrew text contains english word", () => {
|
|
|
42
38
|
const textWithNotFirstEnglishWord = "השיר של נועה נועה קירל באירוויזיון Word";
|
|
43
39
|
const textWithoutEnglishWord = "השיר של נועה נועה קירל באירוויזיון";
|
|
44
40
|
|
|
45
|
-
const
|
|
41
|
+
const storeConfig = {
|
|
46
42
|
remoteConfigurations: { localizations: { he: {} } },
|
|
47
43
|
appData: {
|
|
48
44
|
languageCode: "he",
|
|
49
45
|
countryCode: "IL",
|
|
50
46
|
},
|
|
51
|
-
}
|
|
47
|
+
};
|
|
52
48
|
|
|
53
49
|
it("Hebrew text contains first english word", () => {
|
|
54
|
-
const renderedText = getRenderedText(textWithFirstEnglishWord,
|
|
50
|
+
const renderedText = getRenderedText(textWithFirstEnglishWord, storeConfig);
|
|
55
51
|
const desiredText = "\u200fWord\u202c השיר של נועה נועה קירל באירוויזיון";
|
|
56
52
|
|
|
57
53
|
expect(renderedText).toEqual(desiredText);
|
|
58
54
|
});
|
|
59
55
|
|
|
60
56
|
it("Hebrew text contains not first english word", () => {
|
|
61
|
-
const renderedText = getRenderedText(
|
|
57
|
+
const renderedText = getRenderedText(
|
|
58
|
+
textWithNotFirstEnglishWord,
|
|
59
|
+
storeConfig
|
|
60
|
+
);
|
|
61
|
+
|
|
62
62
|
expect(renderedText).toEqual(textWithNotFirstEnglishWord);
|
|
63
63
|
});
|
|
64
64
|
|
|
65
65
|
it("Hebrew text doesn't contain english word", () => {
|
|
66
|
-
const renderedText = getRenderedText(textWithoutEnglishWord,
|
|
66
|
+
const renderedText = getRenderedText(textWithoutEnglishWord, storeConfig);
|
|
67
67
|
expect(renderedText).toEqual(textWithoutEnglishWord);
|
|
68
68
|
});
|
|
69
69
|
});
|
|
@@ -77,16 +77,16 @@ describe("LTR app: English text", () => {
|
|
|
77
77
|
|
|
78
78
|
const englishText = "Test sentence";
|
|
79
79
|
|
|
80
|
-
const
|
|
80
|
+
const storeConfig = {
|
|
81
81
|
remoteConfigurations: { localizations: { en: {} } },
|
|
82
82
|
appData: {
|
|
83
83
|
languageCode: "en",
|
|
84
84
|
countryCode: "US",
|
|
85
85
|
},
|
|
86
|
-
}
|
|
86
|
+
};
|
|
87
87
|
|
|
88
88
|
it("English text", () => {
|
|
89
|
-
const renderedText = getRenderedText(englishText,
|
|
89
|
+
const renderedText = getRenderedText(englishText, storeConfig);
|
|
90
90
|
expect(renderedText).toEqual(englishText);
|
|
91
91
|
});
|
|
92
92
|
});
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { View } from "react-native";
|
|
3
|
-
import
|
|
3
|
+
import { render } from "@testing-library/react-native";
|
|
4
4
|
|
|
5
5
|
import { CollapsibleTextContainer } from "../CollapsibleTextContainer";
|
|
6
6
|
|
|
7
7
|
describe("CollapsibleTextContainer", () => {
|
|
8
8
|
it("render container+children when label is presented", () => {
|
|
9
|
-
const
|
|
9
|
+
const { toJSON } = render(
|
|
10
10
|
<CollapsibleTextContainer
|
|
11
11
|
backgroundColor="#000000"
|
|
12
12
|
label={"label"}
|
|
@@ -16,36 +16,36 @@ describe("CollapsibleTextContainer", () => {
|
|
|
16
16
|
</CollapsibleTextContainer>
|
|
17
17
|
);
|
|
18
18
|
|
|
19
|
-
const result =
|
|
19
|
+
const result = toJSON();
|
|
20
20
|
|
|
21
21
|
expect(result).not.toBeNull();
|
|
22
|
-
expect(
|
|
22
|
+
expect(toJSON()).toMatchSnapshot();
|
|
23
23
|
});
|
|
24
24
|
|
|
25
25
|
it("render nothing when label is empty", () => {
|
|
26
|
-
const
|
|
26
|
+
const { toJSON } = render(
|
|
27
27
|
<CollapsibleTextContainer backgroundColor="#000000" label={""} style={{}}>
|
|
28
28
|
<View />
|
|
29
29
|
</CollapsibleTextContainer>
|
|
30
30
|
);
|
|
31
31
|
|
|
32
|
-
const result =
|
|
32
|
+
const result = toJSON();
|
|
33
33
|
expect(result).toBeNull();
|
|
34
34
|
});
|
|
35
35
|
|
|
36
36
|
it("render nothing when label is not passed", () => {
|
|
37
|
-
const
|
|
37
|
+
const { toJSON } = render(
|
|
38
38
|
<CollapsibleTextContainer backgroundColor="#000000" label={""} style={{}}>
|
|
39
39
|
<View />
|
|
40
40
|
</CollapsibleTextContainer>
|
|
41
41
|
);
|
|
42
42
|
|
|
43
|
-
const result =
|
|
43
|
+
const result = toJSON();
|
|
44
44
|
expect(result).toBeNull();
|
|
45
45
|
});
|
|
46
46
|
|
|
47
47
|
it("render nothing when label is undefined", () => {
|
|
48
|
-
const
|
|
48
|
+
const { toJSON } = render(
|
|
49
49
|
<CollapsibleTextContainer
|
|
50
50
|
backgroundColor="#000000"
|
|
51
51
|
label={undefined}
|
|
@@ -55,7 +55,7 @@ describe("CollapsibleTextContainer", () => {
|
|
|
55
55
|
</CollapsibleTextContainer>
|
|
56
56
|
);
|
|
57
57
|
|
|
58
|
-
const result =
|
|
58
|
+
const result = toJSON();
|
|
59
59
|
expect(result).toBeNull();
|
|
60
60
|
});
|
|
61
61
|
});
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
|
|
3
|
-
import renderer, { act } from "react-test-renderer";
|
|
2
|
+
import { render } from "@testing-library/react-native";
|
|
4
3
|
|
|
5
4
|
jest.useFakeTimers({ legacyFakeTimers: true });
|
|
6
5
|
|
|
@@ -49,24 +48,18 @@ describe("OfflineHandler", () => {
|
|
|
49
48
|
const { OfflineHandler, NotificationView } = require("../");
|
|
50
49
|
|
|
51
50
|
it("renders", () => {
|
|
52
|
-
const
|
|
53
|
-
expect(
|
|
51
|
+
const { toJSON } = render(<OfflineHandler />);
|
|
52
|
+
expect(toJSON()).toMatchSnapshot();
|
|
54
53
|
});
|
|
55
54
|
|
|
56
55
|
it("renders Notification mode if component was rendered while online", () => {
|
|
57
56
|
mockConnectionStatus = true;
|
|
58
57
|
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
act(() => {
|
|
62
|
-
instance = renderer.create(<OfflineHandler />);
|
|
63
|
-
});
|
|
58
|
+
const { rerender, UNSAFE_getByType } = render(<OfflineHandler />);
|
|
64
59
|
|
|
65
|
-
|
|
66
|
-
instance.update(<OfflineHandler />);
|
|
67
|
-
});
|
|
60
|
+
rerender(<OfflineHandler />);
|
|
68
61
|
|
|
69
|
-
const notificationsView =
|
|
62
|
+
const notificationsView = UNSAFE_getByType(NotificationView);
|
|
70
63
|
expect(notificationsView).toBeDefined();
|
|
71
64
|
});
|
|
72
65
|
});
|
|
@@ -2,7 +2,6 @@ import { renderHook, act } from "@testing-library/react-hooks";
|
|
|
2
2
|
import { BehaviorSubject } from "rxjs";
|
|
3
3
|
import { useLoadingState } from "../useLoadingState";
|
|
4
4
|
|
|
5
|
-
// Mock the useRefWithInitialValue hook
|
|
6
5
|
jest.mock(
|
|
7
6
|
"@applicaster/zapp-react-native-utils/reactHooks/state/useRefWithInitialValue",
|
|
8
7
|
() => ({
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { View } from "react-native";
|
|
3
|
-
import {
|
|
3
|
+
import { render } from "@testing-library/react-native";
|
|
4
4
|
|
|
5
5
|
const Mocked_RouteManager = jest.fn((props) => (
|
|
6
6
|
<View testID="routeManager" {...props} />
|
|
@@ -152,8 +152,6 @@ const screenProps = {
|
|
|
152
152
|
const { Screen } = require("..");
|
|
153
153
|
|
|
154
154
|
describe("<Screen Component />", () => {
|
|
155
|
-
let wrapper;
|
|
156
|
-
|
|
157
155
|
beforeEach(() => {
|
|
158
156
|
allowedOrientationsForScreen.mockClear();
|
|
159
157
|
getOrientation.mockClear();
|
|
@@ -161,26 +159,16 @@ describe("<Screen Component />", () => {
|
|
|
161
159
|
});
|
|
162
160
|
|
|
163
161
|
describe("when the navbar should show", () => {
|
|
164
|
-
act(() => {
|
|
165
|
-
wrapper = create(<Screen {...screenProps} />);
|
|
166
|
-
});
|
|
167
|
-
|
|
168
162
|
it("renders correctly", () => {
|
|
169
|
-
|
|
163
|
+
const { toJSON } = render(<Screen {...screenProps} />);
|
|
164
|
+
expect(toJSON()).toMatchSnapshot();
|
|
170
165
|
});
|
|
171
166
|
});
|
|
172
167
|
|
|
173
168
|
describe("when the navbar should be hidden", () => {
|
|
174
|
-
beforeEach(() => {
|
|
175
|
-
wrapper = create(<Screen {...screenProps} />);
|
|
176
|
-
});
|
|
177
|
-
|
|
178
169
|
it("renders correctly", () => {
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
});
|
|
182
|
-
|
|
183
|
-
expect(wrapper.toJSON()).toMatchSnapshot();
|
|
170
|
+
const { toJSON } = render(<Screen {...screenProps} />);
|
|
171
|
+
expect(toJSON()).toMatchSnapshot();
|
|
184
172
|
});
|
|
185
173
|
});
|
|
186
174
|
});
|
package/Components/Tabs/Tabs.tsx
CHANGED
|
@@ -158,12 +158,11 @@ const TabsComponent = ({
|
|
|
158
158
|
|
|
159
159
|
const renderItem = React.useCallback(
|
|
160
160
|
({ item, index, item: { id } }: RenderItemProps) => (
|
|
161
|
-
|
|
161
|
+
<React.Fragment key={id}>
|
|
162
162
|
<Tab
|
|
163
163
|
ref={(ref) => {
|
|
164
164
|
tabRefs.current[index] = ref;
|
|
165
165
|
}}
|
|
166
|
-
key={id}
|
|
167
166
|
{...{
|
|
168
167
|
title: getTitle(item),
|
|
169
168
|
id,
|
|
@@ -177,7 +176,7 @@ const TabsComponent = ({
|
|
|
177
176
|
{display_mode === "fractional" &&
|
|
178
177
|
index !== tabs?.length - 1 &&
|
|
179
178
|
renderGutter()}
|
|
180
|
-
|
|
179
|
+
</React.Fragment>
|
|
181
180
|
),
|
|
182
181
|
[tabs, display_mode, configuration, onTabPress, getTitle, getSelectedItem]
|
|
183
182
|
);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { View, TouchableOpacity } from "react-native";
|
|
3
|
-
import {
|
|
3
|
+
import { render } from "@testing-library/react-native";
|
|
4
4
|
|
|
5
5
|
import { Touchable } from "..";
|
|
6
6
|
|
|
@@ -23,38 +23,31 @@ describe("<Touchable />", () => {
|
|
|
23
23
|
});
|
|
24
24
|
|
|
25
25
|
it("has accessible flag set to false", () => {
|
|
26
|
-
|
|
26
|
+
const { toJSON, UNSAFE_getByType } = render(<Touchable {...props} />);
|
|
27
27
|
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
});
|
|
31
|
-
|
|
32
|
-
const touchableWrapper = wrapper.root.findByType(TouchableOpacity);
|
|
33
|
-
expect(wrapper.toJSON()).toMatchSnapshot();
|
|
28
|
+
const touchableWrapper = UNSAFE_getByType(TouchableOpacity);
|
|
29
|
+
expect(toJSON()).toMatchSnapshot();
|
|
34
30
|
expect(touchableWrapper.props).toHaveProperty("accessible", false);
|
|
35
31
|
});
|
|
36
32
|
});
|
|
37
33
|
|
|
38
34
|
describe("when not running in automated tests environment", () => {
|
|
39
|
-
let wrapper;
|
|
40
|
-
|
|
41
|
-
act(() => {
|
|
42
|
-
wrapper = create(<Touchable {...props} />);
|
|
43
|
-
});
|
|
44
|
-
|
|
45
|
-
const touchableWrapper = wrapper.root.findByType(TouchableOpacity);
|
|
46
|
-
|
|
47
35
|
beforeEach(props.onPress.mockClear);
|
|
48
36
|
|
|
49
37
|
it("renders correctly", () => {
|
|
50
|
-
|
|
38
|
+
const { toJSON } = render(<Touchable {...props} />);
|
|
39
|
+
expect(toJSON()).toMatchSnapshot();
|
|
51
40
|
});
|
|
52
41
|
|
|
53
42
|
it("has accessible flag set to true", () => {
|
|
43
|
+
const { UNSAFE_getByType } = render(<Touchable {...props} />);
|
|
44
|
+
const touchableWrapper = UNSAFE_getByType(TouchableOpacity);
|
|
54
45
|
expect(touchableWrapper.props).toHaveProperty("accessible", true);
|
|
55
46
|
});
|
|
56
47
|
|
|
57
48
|
it("assigns testID and accessibilityLabel props correctly", () => {
|
|
49
|
+
const { UNSAFE_getByType } = render(<Touchable {...props} />);
|
|
50
|
+
const touchableWrapper = UNSAFE_getByType(TouchableOpacity);
|
|
58
51
|
expect(touchableWrapper.props).toHaveProperty("testID", props.testID);
|
|
59
52
|
|
|
60
53
|
expect(touchableWrapper.props).toHaveProperty(
|
|
@@ -64,6 +57,8 @@ describe("<Touchable />", () => {
|
|
|
64
57
|
});
|
|
65
58
|
|
|
66
59
|
it("calls the onPress event when it is pressed", () => {
|
|
60
|
+
const { UNSAFE_getByType } = render(<Touchable {...props} />);
|
|
61
|
+
const touchableWrapper = UNSAFE_getByType(TouchableOpacity);
|
|
67
62
|
touchableWrapper.props.onPress();
|
|
68
63
|
expect(props.onPress).toHaveBeenCalledTimes(1);
|
|
69
64
|
});
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import
|
|
2
|
+
import { render } from "@testing-library/react-native";
|
|
3
3
|
|
|
4
4
|
const props = {
|
|
5
5
|
entry: {},
|
|
@@ -42,16 +42,16 @@ const { PlayerDetails } = require("../PlayerDetails");
|
|
|
42
42
|
|
|
43
43
|
describe("PlayerDetails", () => {
|
|
44
44
|
it("renders properly", () => {
|
|
45
|
-
const
|
|
45
|
+
const { toJSON } = render(<PlayerDetails {...props} />);
|
|
46
46
|
|
|
47
|
-
expect(
|
|
47
|
+
expect(toJSON()).toMatchSnapshot();
|
|
48
48
|
});
|
|
49
49
|
|
|
50
50
|
it("renders properly on tablet in landscape orientation", () => {
|
|
51
|
-
const
|
|
51
|
+
const { toJSON } = render(
|
|
52
52
|
<PlayerDetails {...props} isTabletLandscape={true} />
|
|
53
53
|
);
|
|
54
54
|
|
|
55
|
-
expect(
|
|
55
|
+
expect(toJSON()).toMatchSnapshot();
|
|
56
56
|
});
|
|
57
57
|
});
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import
|
|
2
|
+
import { render } from "@testing-library/react-native";
|
|
3
3
|
import { View } from "react-native";
|
|
4
4
|
import { useConfiguration } from "@applicaster/zapp-react-native-utils/reactHooks/configuration";
|
|
5
5
|
|
|
@@ -14,12 +14,12 @@ describe("withConfigurationProvider", () => {
|
|
|
14
14
|
};
|
|
15
15
|
|
|
16
16
|
it("provides configuration to children", () => {
|
|
17
|
-
const
|
|
17
|
+
const { toJSON } = render(
|
|
18
18
|
<ConfigurationProvider configuration={{ target: "foobar" }}>
|
|
19
19
|
<TestComponent />
|
|
20
20
|
</ConfigurationProvider>
|
|
21
21
|
);
|
|
22
22
|
|
|
23
|
-
expect(
|
|
23
|
+
expect(toJSON()).toMatchSnapshot();
|
|
24
24
|
});
|
|
25
25
|
});
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import
|
|
2
|
+
import { render } from "@testing-library/react-native";
|
|
3
3
|
import { useConfiguration } from "@applicaster/zapp-react-native-utils/reactHooks/configuration";
|
|
4
4
|
import { View } from "react-native";
|
|
5
5
|
import { withConfigurationProvider } from "@applicaster/zapp-react-native-ui-components/Decorators/ConfigurationWrapper";
|
|
@@ -15,12 +15,12 @@ describe("withConfigurationProvider", () => {
|
|
|
15
15
|
it("correctly passes all the configuration keys child component", () => {
|
|
16
16
|
const Component = withConfigurationProvider(TestComponent);
|
|
17
17
|
|
|
18
|
-
const
|
|
18
|
+
const { toJSON } = render(
|
|
19
19
|
<Component
|
|
20
20
|
screenData={{ styles: {}, general: {}, data: { source: "test" } }}
|
|
21
21
|
/>
|
|
22
22
|
);
|
|
23
23
|
|
|
24
|
-
expect(
|
|
24
|
+
expect(toJSON()).toMatchSnapshot();
|
|
25
25
|
});
|
|
26
26
|
});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@applicaster/zapp-react-native-ui-components",
|
|
3
|
-
"version": "14.0.0-rc.
|
|
3
|
+
"version": "14.0.0-rc.48",
|
|
4
4
|
"description": "Applicaster Zapp React Native ui components for the Quick Brick App",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"types": "index.d.ts",
|
|
@@ -28,10 +28,10 @@
|
|
|
28
28
|
},
|
|
29
29
|
"homepage": "https://github.com/applicaster/quickbrick#readme",
|
|
30
30
|
"dependencies": {
|
|
31
|
-
"@applicaster/applicaster-types": "14.0.0-rc.
|
|
32
|
-
"@applicaster/zapp-react-native-bridge": "14.0.0-rc.
|
|
33
|
-
"@applicaster/zapp-react-native-redux": "14.0.0-rc.
|
|
34
|
-
"@applicaster/zapp-react-native-utils": "14.0.0-rc.
|
|
31
|
+
"@applicaster/applicaster-types": "14.0.0-rc.48",
|
|
32
|
+
"@applicaster/zapp-react-native-bridge": "14.0.0-rc.48",
|
|
33
|
+
"@applicaster/zapp-react-native-redux": "14.0.0-rc.48",
|
|
34
|
+
"@applicaster/zapp-react-native-utils": "14.0.0-rc.48",
|
|
35
35
|
"promise": "^8.3.0",
|
|
36
36
|
"url": "^0.11.0",
|
|
37
37
|
"uuid": "^3.3.2"
|