Skip to content

Commit 72757ff

Browse files
gmsgowthamgmsgowtham
committed
test: add test cases
1 parent ba79d46 commit 72757ff

File tree

8 files changed

+330
-4
lines changed

8 files changed

+330
-4
lines changed

‎.gitignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -68,3 +68,4 @@ android/keystores/debug.keystore
6868

6969
# generated by bob
7070
dist/
71+
coverage/

‎package.json‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -58,10 +58,12 @@
5858
"@commitlint/config-conventional": "17.6.5",
5959
"@evilmartians/lefthook": "1.4.1",
6060
"@release-it/conventional-changelog": "5.1.1",
61+
"@testing-library/react-native": "12.1.2",
6162
"@types/jest": "29.5.2",
6263
"@types/react": "18.2.8",
6364
"@types/react-native": "0.72.2",
6465
"@types/react-syntax-highlighter": "15.5.7",
66+
"@types/react-test-renderer": "18.0.0",
6567
"commitlint": "17.6.5",
6668
"del-cli": "5.0.0",
6769
"jest": "29.5.0",
@@ -91,6 +93,9 @@
9193
"modulePathIgnorePatterns": [
9294
"<rootDir>/example/node_modules",
9395
"<rootDir>/dist/"
96+
],
97+
"transformIgnorePatterns": [
98+
"node_modules/(?!(jest-)?react-native|@react-native|@react-native-community|react-native-table-component|trim-newlines|react-syntax-highlighter)"
9499
]
95100
},
96101
"commitlint": {

‎src/__tests__/index.test.tsx‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎src/lib/CodeHighlighter.tsx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ export const CodeHighlighter: FunctionComponent<CodeHighlighterProps> = ({
2828
children,
2929
containerStyle,
3030
textStyle,
31-
hljsStyle = {},
31+
hljsStyle,
3232
...rest
3333
}) => {
3434
const stylesheet: HighlighterStyleSheet = useMemo(
@@ -37,7 +37,7 @@ export const CodeHighlighter: FunctionComponent<CodeHighlighterProps> = ({
3737
);
3838

3939
const getStylesForNode = (node: rendererNode): TextStyle[] => {
40-
const classes: string[] = node.properties?.className || [];
40+
const classes: string[] = node.properties?.className ?? [];
4141
return classes
4242
.map((c: string) => stylesheet[c])
4343
.filter((c) => !!c) as TextStyle[];
@@ -85,6 +85,7 @@ export const CodeHighlighter: FunctionComponent<CodeHighlighterProps> = ({
8585
CodeTag={View}
8686
PreTag={View}
8787
style={{}}
88+
testID="react-native-code-highlighter"
8889
>
8990
{children}
9091
</SyntaxHighlighter>

‎src/lib/__tests__/CodeHighlighter.spec.tsx‎

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
import CodeHighlighter from "../CodeHighlighter";
2+
import { render, screen } from "@testing-library/react-native";
3+
import { atomOneDarkReasonable as hljsStyle } from "react-syntax-highlighter/dist/esm/styles/hljs";
4+
5+
describe(CodeHighlighter, () => {
6+
it("render", async () => {
7+
const code = `const hello = "world"`;
8+
const r = await render(
9+
<CodeHighlighter hljsStyle={{}} language="typescript">
10+
{code}
11+
</CodeHighlighter>,
12+
);
13+
14+
expect(screen.queryByTestId("react-native-code-highlighter")).toBeDefined();
15+
expect(screen.getByText("const")).toBeDefined();
16+
expect(screen.getByText("hello =")).toBeDefined();
17+
expect(screen.getByText('"world"')).toBeDefined();
18+
19+
const tree = r.toJSON();
20+
expect(tree).toMatchSnapshot();
21+
});
22+
it("render with styles", async () => {
23+
const code = `
24+
const hello = "world";
25+
let foo = "bar";
26+
`;
27+
const r = await render(
28+
<CodeHighlighter
29+
hljsStyle={hljsStyle}
30+
containerStyle={{ padding: 8, backgroundColor: "#000" }}
31+
textStyle={{ color: "#fff", fontSize: 12 }}
32+
language="javascript"
33+
>
34+
{code}
35+
</CodeHighlighter>,
36+
);
37+
38+
expect(screen.queryByTestId("react-native-code-highlighter")).toBeDefined();
39+
expect(screen.getByText("const")).toBeDefined();
40+
expect(screen.getByText("hello =")).toBeDefined();
41+
expect(screen.getByText('"world"')).toBeDefined();
42+
expect(screen.getByText("let")).toBeDefined();
43+
expect(screen.getByText("foo =")).toBeDefined();
44+
expect(screen.getByText('"bar"')).toBeDefined();
45+
46+
const tree = r.toJSON();
47+
expect(tree).toMatchSnapshot();
48+
});
49+
});

‎src/lib/__tests__/__snapshots__/CodeHighlighter.spec.tsx.snap‎

Lines changed: 257 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,257 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`CodeHighlighter render 1`] = `
4+
<View
5+
style={
6+
{
7+
"backgroundColor": "#fff",
8+
}
9+
}
10+
testID="react-native-code-highlighter"
11+
>
12+
<View
13+
className="language-typescript"
14+
style={
15+
{
16+
"whiteSpace": "pre",
17+
}
18+
}
19+
>
20+
<RCTScrollView
21+
contentContainerStyle={
22+
[
23+
undefined,
24+
undefined,
25+
]
26+
}
27+
horizontal={true}
28+
>
29+
<View>
30+
<View>
31+
<Text
32+
style={
33+
{
34+
"color": undefined,
35+
}
36+
}
37+
>
38+
<Text
39+
style={
40+
{
41+
"color": undefined,
42+
}
43+
}
44+
>
45+
const
46+
</Text>
47+
<Text
48+
style={
49+
{
50+
"color": undefined,
51+
}
52+
}
53+
>
54+
hello =
55+
</Text>
56+
<Text
57+
style={
58+
{
59+
"color": undefined,
60+
}
61+
}
62+
>
63+
"world"
64+
</Text>
65+
</Text>
66+
</View>
67+
</View>
68+
</RCTScrollView>
69+
</View>
70+
</View>
71+
`;
72+
73+
exports[`CodeHighlighter render with styles 1`] = `
74+
<View
75+
style={
76+
{
77+
"backgroundColor": "#fff",
78+
}
79+
}
80+
testID="react-native-code-highlighter"
81+
>
82+
<View
83+
className="language-javascript"
84+
style={
85+
{
86+
"whiteSpace": "pre",
87+
}
88+
}
89+
>
90+
<RCTScrollView
91+
contentContainerStyle={
92+
[
93+
{
94+
"backgroundColor": "#282c34",
95+
"color": "#abb2bf",
96+
},
97+
{
98+
"backgroundColor": "#000",
99+
"padding": 8,
100+
},
101+
]
102+
}
103+
horizontal={true}
104+
>
105+
<View>
106+
<View>
107+
<Text
108+
style={
109+
{
110+
"color": "#abb2bf",
111+
"fontSize": 12,
112+
}
113+
}
114+
>
115+
<Text
116+
style={
117+
{
118+
"color": "#abb2bf",
119+
"fontSize": 12,
120+
}
121+
}
122+
/>
123+
</Text>
124+
<Text
125+
style={
126+
{
127+
"color": "#abb2bf",
128+
"fontSize": 12,
129+
}
130+
}
131+
>
132+
<Text
133+
style={
134+
{
135+
"color": "#abb2bf",
136+
"fontSize": 12,
137+
}
138+
}
139+
>
140+
141+
</Text>
142+
<Text
143+
style={
144+
{
145+
"color": "#F92672",
146+
"fontSize": 12,
147+
}
148+
}
149+
>
150+
const
151+
</Text>
152+
<Text
153+
style={
154+
{
155+
"color": "#abb2bf",
156+
"fontSize": 12,
157+
}
158+
}
159+
>
160+
hello =
161+
</Text>
162+
<Text
163+
style={
164+
{
165+
"color": "#98c379",
166+
"fontSize": 12,
167+
}
168+
}
169+
>
170+
"world"
171+
</Text>
172+
<Text
173+
style={
174+
{
175+
"color": "#abb2bf",
176+
"fontSize": 12,
177+
}
178+
}
179+
>
180+
;
181+
</Text>
182+
</Text>
183+
<Text
184+
style={
185+
{
186+
"color": "#abb2bf",
187+
"fontSize": 12,
188+
}
189+
}
190+
>
191+
<Text
192+
style={
193+
{
194+
"color": "#abb2bf",
195+
"fontSize": 12,
196+
}
197+
}
198+
>
199+
200+
</Text>
201+
<Text
202+
style={
203+
{
204+
"color": "#F92672",
205+
"fontSize": 12,
206+
}
207+
}
208+
>
209+
let
210+
</Text>
211+
<Text
212+
style={
213+
{
214+
"color": "#abb2bf",
215+
"fontSize": 12,
216+
}
217+
}
218+
>
219+
foo =
220+
</Text>
221+
<Text
222+
style={
223+
{
224+
"color": "#98c379",
225+
"fontSize": 12,
226+
}
227+
}
228+
>
229+
"bar"
230+
</Text>
231+
<Text
232+
style={
233+
{
234+
"color": "#abb2bf",
235+
"fontSize": 12,
236+
}
237+
}
238+
>
239+
;
240+
</Text>
241+
</Text>
242+
<Text
243+
style={
244+
{
245+
"color": "#abb2bf",
246+
"fontSize": 12,
247+
}
248+
}
249+
>
250+
251+
</Text>
252+
</View>
253+
</View>
254+
</RCTScrollView>
255+
</View>
256+
</View>
257+
`;

‎tsconfig.build.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
{
22
"extends": "./tsconfig",
3-
"exclude": ["example"]
3+
"exclude": ["example", "src/**/**/__tests__", "src/**/__tests__"]
44
}

‎yarn.lock‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2186,6 +2186,13 @@
21862186
dependencies:
21872187
defer-to-connect "^2.0.1"
21882188

2189+
"@testing-library/[email protected]":
2190+
version "12.1.2"
2191+
resolved "https://registry.yarnpkg.com/@testing-library/react-native/-/react-native-12.1.2.tgz#1935affe1106aeddf0087dff31a6d7414917c098"
2192+
integrity sha512-5rQMQpbSQAuJc4TxjTt1IoeT1a5eVXaa61hf/YcjV2QtGqCoyhuW8DvhTowrL7y2Ds4NzuYBmbVxjNPR6GIblw==
2193+
dependencies:
2194+
pretty-format "^29.0.0"
2195+
21892196
"@tsconfig/node10@^1.0.7":
21902197
version "1.0.9"
21912198
resolved "https://registry.yarnpkg.com/@tsconfig/node10/-/node10-1.0.9.tgz#df4907fc07a886922637b15e02d4cebc4c0021b2"
@@ -2330,6 +2337,13 @@
23302337
dependencies:
23312338
"@types/react" "*"
23322339

2340+
"@types/[email protected]":
2341+
version "18.0.0"
2342+
resolved "https://registry.yarnpkg.com/@types/react-test-renderer/-/react-test-renderer-18.0.0.tgz#7b7f69ca98821ea5501b21ba24ea7b6139da2243"
2343+
integrity sha512-C7/5FBJ3g3sqUahguGi03O79b8afNeSD6T8/GU50oQrJCU0bVCCGQHaGKUbg2Ce8VQEEqTw8/HiS6lXHHdgkdQ==
2344+
dependencies:
2345+
"@types/react" "*"
2346+
23332347
"@types/react@*", "@types/[email protected]":
23342348
version "18.2.8"
23352349
resolved "https://registry.yarnpkg.com/@types/react/-/react-18.2.8.tgz#a77dcffe4e9af148ca4aa8000c51a1e8ed99e2c8"

0 commit comments

Comments
 (0)