Skip to content

Commit fd77176

Browse files
jaywcjlovejaywcjlove
committed
test: add test case.
1 parent d4c86fd commit fd77176

File tree

11 files changed

+174
-2
lines changed

11 files changed

+174
-2
lines changed

‎.github/workflows/ci.yml‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,9 +16,19 @@ jobs:
1616

1717
- run: npm install
1818
- run: npm run build
19+
- run: npm run coverage
1920
- run: npm run build
2021
working-directory: ./www
2122

23+
- name: Create Coverage Badges
24+
uses: jaywcjlove/coverage-badges-cli@main
25+
with:
26+
style: flat
27+
source: core/coverage/coverage-summary.json
28+
output: ./www/build/badges.svg
29+
30+
- run: cp -rp core/coverage/lcov-report ./www/build/
31+
2232
- name: Generate Contributors Images
2333
uses: jaywcjlove/github-action-contributors@main
2434
with:

‎.gitignore‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
1+
coverage
12
cjs
23
esm
34
build
45
node_modules
56
npm-debug.log*
67
package-lock.json
8+
__snapshots__
79

810
.eslintcache
911
.DS_Store

‎core/README.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ react-json-view
44
[![CI](https://github.com/uiwjs/react-json-view/actions/workflows/ci.yml/badge.svg)](https://github.com/uiwjs/react-json-view/actions/workflows/ci.yml)
55
[![npm version](https://img.shields.io/npm/v/@uiw/react-json-view.svg)](https://www.npmjs.com/package/@uiw/react-json-view)
66
[![react@^18](https://shields.io/badge/react-^18-green?style=flat&logo=react)](https://github.com/facebook/react/releases)
7+
[![Coverage Status](https://www.npmjs.com/package/@uiw/react-json-view/badges.svg)](https://www.npmjs.com/package/@uiw/react-json-view/lcov-report/)
78

89
A React component for displaying and editing javascript arrays and JSON objects.
910

‎core/package.json‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -74,7 +74,10 @@
7474
"treeview"
7575
],
7676
"devDependencies": {
77+
"@types/react-test-renderer": "^18.0.0",
78+
"@testing-library/react": "^14.0.0",
7779
"react": "^18.2.0",
78-
"react-dom": "^18.2.0"
80+
"react-dom": "^18.2.0",
81+
"react-test-renderer": "^18.2.0"
7982
}
8083
}

‎core/src/arrow/TriangleSolidArrow.test.tsx‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import renderer from 'react-test-renderer';
2+
import { TriangleSolidArrow } from './TriangleSolidArrow';
3+
4+
5+
it('renders <JsonView /> test case', () => {
6+
const component = renderer.create(
7+
<TriangleSolidArrow />,
8+
);
9+
let tree = component.toJSON();
10+
expect(tree).toHaveProperty('type');
11+
expect(tree).toHaveProperty('props');
12+
expect(tree).toHaveProperty('children');
13+
expect(tree).toHaveProperty('type', 'svg');
14+
expect(tree).toHaveProperty('props', {
15+
viewBox: '0 0 15 15',
16+
fill: 'var(--w-rjv-arrow-color, currentColor)',
17+
style: { cursor: 'pointer', height: '1em', width: '1em' }
18+
});
19+
});

‎core/src/copied.test.tsx‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import renderer from 'react-test-renderer';
2+
import {cleanup, screen, fireEvent, render} from '@testing-library/react';
3+
import { act } from 'react-dom/test-utils';
4+
import ReactDOM from 'react-dom/client';
5+
import userEvent from '@testing-library/user-event'
6+
import { Copied } from './copied';
7+
8+
it('renders <Copied /> test case', () => {
9+
const component = renderer.create(
10+
<Copied />,
11+
);
12+
let tree = component.toJSON();
13+
expect(tree).toBeNull();
14+
});
15+
16+
it('renders <Copied /> `show` test case', () => {
17+
const component = renderer.create(
18+
<Copied text={{ a: 1 }} show />,
19+
);
20+
let tree = component.toJSON();
21+
expect(tree).toHaveProperty('type');
22+
expect(tree).toHaveProperty('props');
23+
expect(tree).toHaveProperty('children');
24+
expect(tree).toHaveProperty('type', 'svg');
25+
expect(tree).toHaveProperty('props.viewBox', '0 0 38 38');
26+
expect(tree).toHaveProperty('props.height', '1em');
27+
expect(tree).toHaveProperty('props.width', '1em');
28+
expect(tree).toHaveProperty('props.fill', 'var(--w-rjv-copied-color, currentColor)');
29+
expect(tree).toHaveProperty('props.style', { cursor: 'pointer', marginLeft: 5 });
30+
expect(tree).toHaveProperty('props.className', 'w-rjv-copied');
31+
expect(tree).toHaveProperty('props.onClick');
32+
});

‎core/src/index.test.tsx‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
import renderer from 'react-test-renderer';
2+
import {cleanup, fireEvent, render} from '@testing-library/react';
3+
import JsonView from './';
4+
5+
6+
const avatar = 'https://i.imgur.com/MK3eW3As.jpg';
7+
const longArray = new Array(1000).fill(1);
8+
const example = {
9+
avatar,
10+
string: 'Lorem ipsum dolor sit amet',
11+
integer: 42,
12+
float: 114.514,
13+
// @ts-ignore
14+
bigint: 10086n,
15+
null: null,
16+
undefined,
17+
timer: 0,
18+
date: new Date('Tue Sep 13 2022 14:07:44 GMT-0500 (Central Daylight Time)'),
19+
array: [19, 100.86, 'test', NaN, Infinity],
20+
nestedArray: [
21+
[1, 2],
22+
[3, 4],
23+
],
24+
object: {
25+
'first-child': true,
26+
'second-child': false,
27+
'last-child': null,
28+
},
29+
longArray,
30+
string_number: '1234',
31+
};
32+
33+
it('renders <JsonView /> test case', () => {
34+
const component = renderer.create(
35+
<JsonView value={example} />,
36+
);
37+
let tree = component.toJSON();
38+
expect(tree).toHaveProperty('type');
39+
expect(tree).toHaveProperty('props');
40+
expect(tree).toHaveProperty('children');
41+
expect(tree).toHaveProperty('type', 'div');
42+
expect(tree).toHaveProperty('props.className', 'w-json-view-container w-rjv w-rjv-inner');
43+
expect(tree).toHaveProperty('props.style.backgroundColor', 'var(--w-rjv-background-color, #00000000)');
44+
expect(tree).toHaveProperty('props.style', {
45+
lineHeight: 1.4,
46+
fontFamily: 'monospace',
47+
color: 'var(--w-rjv-color, #002b36)',
48+
backgroundColor: 'var(--w-rjv-background-color, #00000000)'
49+
});
50+
expect(tree).toHaveProperty('props.onMouseEnter');
51+
expect(tree).toHaveProperty('props.onMouseLeave');
52+
});

‎core/src/node.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -87,6 +87,7 @@ export function RooNode<T extends object>(props: RooNodeProps<T>) {
8787
const {
8888
value = {},
8989
keyName,
90+
className,
9091
displayDataTypes = true,
9192
components = {},
9293
displayObjectSize = true,
@@ -145,7 +146,7 @@ export function RooNode<T extends object>(props: RooNodeProps<T>) {
145146
eventProps.onMouseLeave = () => setShowTools(false);
146147
}
147148
return (
148-
<div {...reset} className="w-rjv-inner" {...eventProps}>
149+
<div {...reset} className={`${className} w-rjv-inner`} {...eventProps}>
149150
<Line style={{ display: 'inline-flex', alignItems: 'center' }} onClick={handle}>
150151
{arrowView}
151152
{(typeof keyName === 'string' || typeof keyName === 'number') && (

‎core/src/theme/dark.test.tsx‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import { darkTheme } from './dark';
2+
3+
it('darkTheme test case', () => {
4+
expect(darkTheme).toHaveProperty('--w-rjv-font-family', 'monospace');
5+
expect(Object.keys(darkTheme)).toMatchObject(['--w-rjv-font-family',
6+
'--w-rjv-color',
7+
'--w-rjv-background-color',
8+
'--w-rjv-line-color',
9+
'--w-rjv-arrow-color',
10+
'--w-rjv-info-color',
11+
'--w-rjv-copied-color',
12+
'--w-rjv-copied-success-color',
13+
'--w-rjv-curlybraces-color',
14+
'--w-rjv-brackets-color',
15+
'--w-rjv-type-string-color',
16+
'--w-rjv-type-int-color',
17+
'--w-rjv-type-float-color',
18+
'--w-rjv-type-bigint-color',
19+
'--w-rjv-type-boolean-color',
20+
'--w-rjv-type-date-color',
21+
'--w-rjv-type-null-color',
22+
'--w-rjv-type-nan-color',
23+
'--w-rjv-type-undefined-color',
24+
]);
25+
});

‎core/src/theme/light.test.tsx‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import { lightTheme } from './light';
2+
3+
it('lightTheme test case', () => {
4+
expect(lightTheme).toHaveProperty('--w-rjv-font-family', 'monospace');
5+
expect(Object.keys(lightTheme)).toMatchObject(['--w-rjv-font-family',
6+
'--w-rjv-color',
7+
'--w-rjv-background-color',
8+
'--w-rjv-line-color',
9+
'--w-rjv-arrow-color',
10+
'--w-rjv-info-color',
11+
'--w-rjv-copied-color',
12+
'--w-rjv-copied-success-color',
13+
'--w-rjv-curlybraces-color',
14+
'--w-rjv-brackets-color',
15+
'--w-rjv-type-string-color',
16+
'--w-rjv-type-int-color',
17+
'--w-rjv-type-float-color',
18+
'--w-rjv-type-bigint-color',
19+
'--w-rjv-type-boolean-color',
20+
'--w-rjv-type-date-color',
21+
'--w-rjv-type-null-color',
22+
'--w-rjv-type-nan-color',
23+
'--w-rjv-type-undefined-color',
24+
]);
25+
});

0 commit comments

Comments
 (0)