Skip to content

Commit 2f0443b

Browse files
coder13coder13
committed
Updated testing framework
1 parent b787829 commit 2f0443b

File tree

7 files changed

+2641
-141
lines changed

7 files changed

+2641
-141
lines changed

‎eslint.config.mjs‎

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,11 +5,16 @@ import reactHooksPlugin from 'eslint-plugin-react-hooks';
55
import tseslint from 'typescript-eslint';
66

77
export default [
8-
{ files: ['**/*.{ts,tsx}'] },
9-
eslint.configs.recommended,
8+
{
9+
files: ['**/*.js', '**/*.jsx'],
10+
parser: 'espree',
11+
parserOptions: { sourceType: 'module' },
12+
},
1013
...tseslint.configs.recommended,
11-
eslintPluginPrettierRecommended,
1214
{
15+
...eslint.configs.recommended,
16+
...eslintPluginPrettierRecommended,
17+
files: ['**/*.{ts,tsx}'],
1318
plugins: {
1419
react: reactPlugin,
1520
'react-hooks': reactHooksPlugin,

‎jest.config.ts‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import type { Config } from 'jest';
2+
3+
const config: Config = {
4+
preset: 'ts-jest',
5+
setupFilesAfterEnv: ['<rootDir>/jest.setup.ts'],
6+
testEnvironment: 'jsdom',
7+
transform: {
8+
'^.+\\.(ts|tsx)?$': 'ts-jest',
9+
},
10+
};
11+
12+
export default config;

‎jest.setup.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
import '@testing-library/jest-dom';

‎package.json‎

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
"scripts": {
66
"dev": "vite",
77
"build": "tsc && vite build",
8+
"test": "jest",
89
"lint": "eslint ./src/",
910
"check:type": "tsc --noEmit",
1011
"serve": "vite preview"
@@ -18,7 +19,7 @@
1819
"@tanstack/query-sync-storage-persister": "^5.48.0",
1920
"@tanstack/react-query": "^5.48.0",
2021
"@tanstack/react-query-persist-client": "^5.48.0",
21-
"@testing-library/jest-dom": "^5.16.5",
22+
"@testing-library/jest-dom": "^6.6.3",
2223
"@testing-library/react": "^13.4.0",
2324
"@testing-library/user-event": "^14.4.3",
2425
"@total-typescript/ts-reset": "^0.3.7",
@@ -40,6 +41,7 @@
4041
"history": "^5.3.0",
4142
"i18n-js": "^4.5.1",
4243
"i18next": "^25.1.2",
44+
"jest": "^29.7.0",
4345
"lodash.flatmap": "^4.5.0",
4446
"lodash.flatten": "^4.4.0",
4547
"react": "^18.2.0",
@@ -67,17 +69,24 @@
6769
"web-vitals": "^1.1.2"
6870
},
6971
"devDependencies": {
72+
"@babel/preset-env": "^7.27.2",
73+
"@babel/preset-react": "^7.27.1",
7074
"@modyfi/vite-plugin-yaml": "^1.1.1",
7175
"@tanstack/eslint-plugin-query": "^5.47.0",
7276
"@trivago/prettier-plugin-sort-imports": "^5.2.2",
7377
"autoprefixer": "^10.4.7",
78+
"babel-jest": "^29.7.0",
7479
"eslint": "^9.26.0",
7580
"eslint-plugin-react": "^7.37.5",
7681
"eslint-plugin-react-hooks": "^5.2.0",
82+
"jest-environment-jsdom": "^29.7.0",
7783
"postcss": "^8.4.14",
7884
"prettier": "^3.5.3",
7985
"prettier-plugin-organize-imports": "^4.1.0",
80-
"surge": "^0.23.1"
86+
"react-test-renderer": "^19.1.0",
87+
"surge": "^0.23.1",
88+
"ts-jest": "^29.3.4",
89+
"ts-node": "^10.9.2"
8190
},
8291
"browserslist": {
8392
"production": [

‎src/components/AssignmentLabel/AssignmentLabel.test.tsx‎

Lines changed: 16 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -3,78 +3,22 @@ import { render } from '@testing-library/react';
33
import { AssignmentLabel } from './AssignmentLabel';
44

55
describe('components/AssignmentLabel', () => {
6-
it('should render correctly when assignmentCode is "competitor"', () => {
7-
const { baseElement } = render(<AssignmentLabel assignmentCode="competitor" />);
8-
expect(baseElement).toMatchInlineSnapshot(`
9-
<body>
10-
<div>
11-
<span
12-
class="px-[6px] py-[4px] rounded-md bg-green-200"
13-
>
14-
Competitor
15-
</span>
16-
</div>
17-
</body>
18-
`);
19-
});
20-
21-
it('should render correctly when assignmentCode is "staff-judge"', () => {
22-
const { baseElement } = render(<AssignmentLabel assignmentCode="staff-judge" />);
23-
expect(baseElement).toMatchInlineSnapshot(`
24-
<body>
25-
<div>
26-
<span
27-
class="px-[6px] py-[4px] rounded-md bg-blue-200"
28-
>
29-
Judge
30-
</span>
31-
</div>
32-
</body>
33-
`);
34-
});
35-
36-
it('should render correctly when assignmentCode is "staff-runner"', () => {
37-
const { baseElement } = render(<AssignmentLabel assignmentCode="staff-runner" />);
38-
expect(baseElement).toMatchInlineSnapshot(`
39-
<body>
40-
<div>
41-
<span
42-
class="px-[6px] py-[4px] rounded-md bg-orange-200"
43-
>
44-
Runner
45-
</span>
46-
</div>
47-
</body>
48-
`);
49-
});
50-
51-
it('should render correctly when assignmentCode is "staff-scrambler"', () => {
52-
const { baseElement } = render(<AssignmentLabel assignmentCode="staff-scrambler" />);
53-
expect(baseElement).toMatchInlineSnapshot(`
54-
<body>
55-
<div>
56-
<span
57-
class="px-[6px] py-[4px] rounded-md bg-yellow-200"
58-
>
59-
Scrambler
60-
</span>
61-
</div>
62-
</body>
63-
`);
64-
});
6+
const testCases = [
7+
{ assignmentCode: 'competitor' },
8+
{ assignmentCode: 'staff-judge' },
9+
{ assignmentCode: 'staff-runner' },
10+
{ assignmentCode: 'staff-scrambler' },
11+
{ assignmentCode: 'staff-dataentry' },
12+
{ assignmentCode: 'staff-announcer' },
13+
{ assignmentCode: 'staff-delegate' },
14+
{ assignmentCode: 'staff-stagelead' },
15+
{ assignmentCode: 'staff-other' },
16+
];
6517

66-
it('should render correctly when assignmentCode is non-standard', () => {
67-
const { baseElement } = render(<AssignmentLabel assignmentCode="staff-dataentry" />);
68-
expect(baseElement).toMatchInlineSnapshot(`
69-
<body>
70-
<div>
71-
<span
72-
class="px-[6px] py-[4px] rounded-md bg-blue-100"
73-
>
74-
staff-dataentry
75-
</span>
76-
</div>
77-
</body>
78-
`);
18+
testCases.forEach(({ assignmentCode }) => {
19+
it(`should render correctly when assignmentCode is "${assignmentCode}"`, () => {
20+
const { baseElement } = render(<AssignmentLabel assignmentCode={assignmentCode} />);
21+
expect(baseElement).toMatchSnapshot();
22+
});
7923
});
8024
});

‎src/components/AssignmentLabel/__snapshots__/AssignmentLabel.test.tsx.snap‎

Lines changed: 133 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,133 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`components/AssignmentLabel should render correctly when assignmentCode is "competitor" 1`] = `
4+
<body>
5+
<div>
6+
<span
7+
class="bg-green-200 px-[6px] py-[4px] rounded-md bg-blue-100"
8+
>
9+
competitor
10+
</span>
11+
</div>
12+
</body>
13+
`;
14+
15+
exports[`components/AssignmentLabel should render correctly when assignmentCode is "non-standard" 1`] = `
16+
<body>
17+
<div>
18+
<span
19+
class="bg-cyan-200 px-[6px] py-[4px] rounded-md bg-blue-100"
20+
>
21+
dataentry
22+
</span>
23+
</div>
24+
</body>
25+
`;
26+
27+
exports[`components/AssignmentLabel should render correctly when assignmentCode is "staff-announcer" 1`] = `
28+
<body>
29+
<div>
30+
<span
31+
class="bg-violet-200 px-[6px] py-[4px] rounded-md bg-blue-100"
32+
>
33+
announcer
34+
</span>
35+
</div>
36+
</body>
37+
`;
38+
39+
exports[`components/AssignmentLabel should render correctly when assignmentCode is "staff-dataentry" 1`] = `
40+
<body>
41+
<div>
42+
<span
43+
class="bg-cyan-200 px-[6px] py-[4px] rounded-md bg-blue-100"
44+
>
45+
dataentry
46+
</span>
47+
</div>
48+
</body>
49+
`;
50+
51+
exports[`components/AssignmentLabel should render correctly when assignmentCode is "staff-delegate" 1`] = `
52+
<body>
53+
<div>
54+
<span
55+
class="bg-purple-200 px-[6px] py-[4px] rounded-md bg-blue-100"
56+
>
57+
delegate
58+
</span>
59+
</div>
60+
</body>
61+
`;
62+
63+
exports[`components/AssignmentLabel should render correctly when assignmentCode is "staff-judge" 1`] = `
64+
<body>
65+
<div>
66+
<span
67+
class="bg-blue-200 px-[6px] py-[4px] rounded-md bg-blue-100"
68+
>
69+
judge
70+
</span>
71+
</div>
72+
</body>
73+
`;
74+
75+
exports[`components/AssignmentLabel should render correctly when assignmentCode is "staff-other" 1`] = `
76+
<body>
77+
<div>
78+
<span
79+
class="undefined px-[6px] py-[4px] rounded-md bg-blue-100"
80+
>
81+
other
82+
</span>
83+
</div>
84+
</body>
85+
`;
86+
87+
exports[`components/AssignmentLabel should render correctly when assignmentCode is "staff-runner" 1`] = `
88+
<body>
89+
<div>
90+
<span
91+
class="bg-orange-200 px-[6px] py-[4px] rounded-md bg-blue-100"
92+
>
93+
runner
94+
</span>
95+
</div>
96+
</body>
97+
`;
98+
99+
exports[`components/AssignmentLabel should render correctly when assignmentCode is "staff-scrambler" 1`] = `
100+
<body>
101+
<div>
102+
<span
103+
class="bg-yellow-200 px-[6px] py-[4px] rounded-md bg-blue-100"
104+
>
105+
scrambler
106+
</span>
107+
</div>
108+
</body>
109+
`;
110+
111+
exports[`components/AssignmentLabel should render correctly when assignmentCode is "staff-stagelead" 1`] = `
112+
<body>
113+
<div>
114+
<span
115+
class="bg-purple-800 px-[6px] py-[4px] rounded-md bg-blue-100"
116+
>
117+
stagelead
118+
</span>
119+
</div>
120+
</body>
121+
`;
122+
123+
exports[`components/AssignmentLabel should render correctly when assignmentCode is non-standard 1`] = `
124+
<body>
125+
<div>
126+
<span
127+
class="bg-cyan-200 px-[6px] py-[4px] rounded-md bg-blue-100"
128+
>
129+
dataentry
130+
</span>
131+
</div>
132+
</body>
133+
`;

0 commit comments

Comments
 (0)