From 408229e548abbea92ddd6cea180b9f6bdc3a9014 Mon Sep 17 00:00:00 2001 From: Zxilly Date: Sun, 2 Jun 2024 23:08:25 +0800 Subject: [PATCH] test: add file selector test --- .github/workflows/tests.yml | 2 +- ui/common.ts | 24 ------- ui/package.json | 4 +- ui/pnpm-lock.yaml | 90 ++++++++++++++++++++++++++ ui/src/explorer/file_selector.test.tsx | 40 ++++++++++++ ui/src/explorer/file_selector.tsx | 12 ++-- ui/tsconfig.json | 23 +++++-- ui/tsconfig.node.json | 1 + ui/vite.config-explorer.ts | 5 +- ui/vite.config.ts | 5 +- ui/vitest.config.ts | 31 +++++++++ ui/vitest.setup.ts | 7 ++ 12 files changed, 201 insertions(+), 43 deletions(-) create mode 100644 ui/src/explorer/file_selector.test.tsx create mode 100644 ui/vitest.config.ts create mode 100644 ui/vitest.setup.ts diff --git a/.github/workflows/tests.yml b/.github/workflows/tests.yml index 194bc3a437..c645633f6b 100644 --- a/.github/workflows/tests.yml +++ b/.github/workflows/tests.yml @@ -58,7 +58,7 @@ jobs: - name: Run tests working-directory: ./ui - run: pnpm test:ui + run: pnpm test - name: Upload coverage if: ${{ !cancelled() }} diff --git a/ui/common.ts b/ui/common.ts index ed3a064474..db82747f4f 100644 --- a/ui/common.ts +++ b/ui/common.ts @@ -74,27 +74,3 @@ export function build(dir: string): BuildOptions { } } -export function testConfig(): InlineConfig { - return { - coverage: { - provider: "istanbul", - enabled: true, - exclude: [ - "node_modules", - "dist", - "coverage", - ".eslintrc.cjs", - "vite.config.ts", - "vite.config-explorer.ts", - "common.ts", - "src/tool/wasm_exec.js", - "src/schema/schema.ts", - ], - }, - reporters: ["junit", "default", "github-actions"], - outputFile: { - "junit": "test-results.xml", - } - } -} - diff --git a/ui/package.json b/ui/package.json index e5ad73c9e5..5bd5316784 100644 --- a/ui/package.json +++ b/ui/package.json @@ -10,8 +10,7 @@ "dev:explorer": "vite -c vite.config-explorer.ts", "generate": "typia generate --input src/schema --output src/generated --project tsconfig.json", "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0", - "test:ui": "vitest run -c vite.config.ts", - "test:explorer": "vitest run -c vite.config-explorer.ts" + "test": "vitest run" }, "dependencies": { "@emotion/react": "^11.11.4", @@ -28,6 +27,7 @@ "devDependencies": { "@codecov/vite-plugin": "0.0.1-beta.8", "@microsoft/eslint-formatter-sarif": "^3.1.0", + "@testing-library/jest-dom": "^6.4.5", "@testing-library/react": "^15.0.7", "@types/d3-array": "^3.2.1", "@types/d3-color": "^3.1.3", diff --git a/ui/pnpm-lock.yaml b/ui/pnpm-lock.yaml index 63dd58aff3..cf0b0fb467 100644 --- a/ui/pnpm-lock.yaml +++ b/ui/pnpm-lock.yaml @@ -45,6 +45,9 @@ importers: '@microsoft/eslint-formatter-sarif': specifier: ^3.1.0 version: 3.1.0 + '@testing-library/jest-dom': + specifier: ^6.4.5 + version: 6.4.5(vitest@1.6.0(@types/node@20.12.12)(jsdom@24.1.0)(lightningcss@1.25.1)(sass@1.77.2)(terser@5.31.0)) '@testing-library/react': specifier: ^15.0.7 version: 15.0.7(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -132,6 +135,9 @@ importers: packages: + '@adobe/css-tools@4.3.3': + resolution: {integrity: sha512-rE0Pygv0sEZ4vBWHlAgJLGDU7Pm8xoO6p3wsEceb7GYAjScrOHpEo8KK/eVkAcnSM+slAEtXjA2JpdjLp4fJQQ==} + '@ampproject/remapping@2.3.0': resolution: {integrity: sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==} engines: {node: '>=6.0.0'} @@ -778,6 +784,27 @@ packages: resolution: {integrity: sha512-wdsYKy5zupPyLCW2Je5DLHSxSfbIp6h80WoHOQc+RPtmPGA52O9x5MJEkv92Sjonpq+poOAtUKhh1kBGAXBrNA==} engines: {node: '>=18'} + '@testing-library/jest-dom@6.4.5': + resolution: {integrity: sha512-AguB9yvTXmCnySBP1lWjfNNUwpbElsaQ567lt2VdGqAdHtpieLgjmcVyv1q7PMIvLbgpDdkWV5Ydv3FEejyp2A==} + engines: {node: '>=14', npm: '>=6', yarn: '>=1'} + peerDependencies: + '@jest/globals': '>= 28' + '@types/bun': latest + '@types/jest': '>= 28' + jest: '>= 28' + vitest: '>= 0.32' + peerDependenciesMeta: + '@jest/globals': + optional: true + '@types/bun': + optional: true + '@types/jest': + optional: true + jest: + optional: true + vitest: + optional: true + '@testing-library/react@15.0.7': resolution: {integrity: sha512-cg0RvEdD1TIhhkm1IeYMQxrzy0MtUNfa3minv4MjbgcYzJAZ7yD0i0lwoPOTPr+INtiXFezt2o8xMSnyHhEn2Q==} engines: {node: '>=18'} @@ -1097,6 +1124,10 @@ packages: resolution: {integrity: sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==} engines: {node: '>=4'} + chalk@3.0.0: + resolution: {integrity: sha512-4D3B6Wf41KOYRFdszmDqMCGq5VV/uMAB273JILmO+3jAlh8X4qDtdtgCR3fxtbLEMzSx22QdhnDcJvu2u1fVwg==} + engines: {node: '>=8'} + chalk@4.1.2: resolution: {integrity: sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==} engines: {node: '>=10'} @@ -1221,6 +1252,9 @@ packages: resolution: {integrity: sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==} engines: {node: '>= 6'} + css.escape@1.5.1: + resolution: {integrity: sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==} + cssstyle@4.0.1: resolution: {integrity: sha512-8ZYiJ3A/3OkDd093CBT/0UKDWry7ak4BdPTFP2+QEP7cmhouyq/Up709ASSj2cK02BbZiMgk7kYjZNS4QP5qrQ==} engines: {node: '>=18'} @@ -1338,6 +1372,9 @@ packages: dom-accessibility-api@0.5.16: resolution: {integrity: sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==} + dom-accessibility-api@0.6.3: + resolution: {integrity: sha512-7ZgogeTnjuHbo+ct10G9Ffp0mif17idi0IyWNVA/wcwcm7NPOD/WEHVP3n7n3MhXqxoIYm8d6MuZohYWIZ4T3w==} + dom-helpers@5.2.1: resolution: {integrity: sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==} @@ -1746,6 +1783,10 @@ packages: resolution: {integrity: sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==} engines: {node: '>=0.8.19'} + indent-string@4.0.0: + resolution: {integrity: sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==} + engines: {node: '>=8'} + inflight@1.0.6: resolution: {integrity: sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==} deprecated: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful. @@ -2130,6 +2171,10 @@ packages: resolution: {integrity: sha512-vqiC06CuhBTUdZH+RYl8sFrL096vA45Ok5ISO6sE/Mr1jRbGH4Csnhi8f3wKVl7x8mO4Au7Ir9D3Oyv1VYMFJw==} engines: {node: '>=12'} + min-indent@1.0.1: + resolution: {integrity: sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==} + engines: {node: '>=4'} + minimatch@3.0.3: resolution: {integrity: sha512-NyXjqu1IwcqH6nv5vmMtaG3iw7kdV3g6MwlUBZkc3Vn5b5AMIWYKfptvzipoyFfhlfOgBQ9zoTxQMravF1QTnw==} @@ -2402,6 +2447,10 @@ packages: resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==} engines: {node: '>=8.10.0'} + redent@3.0.0: + resolution: {integrity: sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==} + engines: {node: '>=8'} + reflect.getprototypeof@1.0.6: resolution: {integrity: sha512-fmfw4XgoDke3kdI6h4xcUz1dG8uaiv5q9gcEwLS4Pnth2kxT+GZ7YehS1JTMGBQmtV7Y4GFGbs2re2NqhdozUg==} engines: {node: '>= 0.4'} @@ -2624,6 +2673,10 @@ packages: resolution: {integrity: sha512-dOESqjYr96iWYylGObzd39EuNTa5VJxyvVAEm5Jnh7KGo75V43Hk1odPQkNDyXNmUR6k+gEiDVXnjB8HJ3crXw==} engines: {node: '>=12'} + strip-indent@3.0.0: + resolution: {integrity: sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==} + engines: {node: '>=8'} + strip-json-comments@3.1.1: resolution: {integrity: sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==} engines: {node: '>=8'} @@ -2980,6 +3033,8 @@ packages: snapshots: + '@adobe/css-tools@4.3.3': {} + '@ampproject/remapping@2.3.0': dependencies: '@jridgewell/gen-mapping': 0.3.5 @@ -3581,6 +3636,19 @@ snapshots: lz-string: 1.5.0 pretty-format: 27.5.1 + '@testing-library/jest-dom@6.4.5(vitest@1.6.0(@types/node@20.12.12)(jsdom@24.1.0)(lightningcss@1.25.1)(sass@1.77.2)(terser@5.31.0))': + dependencies: + '@adobe/css-tools': 4.3.3 + '@babel/runtime': 7.24.6 + aria-query: 5.3.0 + chalk: 3.0.0 + css.escape: 1.5.1 + dom-accessibility-api: 0.6.3 + lodash: 4.17.21 + redent: 3.0.0 + optionalDependencies: + vitest: 1.6.0(@types/node@20.12.12)(jsdom@24.1.0)(lightningcss@1.25.1)(sass@1.77.2)(terser@5.31.0) + '@testing-library/react@15.0.7(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.24.6 @@ -3983,6 +4051,11 @@ snapshots: escape-string-regexp: 1.0.5 supports-color: 5.5.0 + chalk@3.0.0: + dependencies: + ansi-styles: 4.3.0 + supports-color: 7.2.0 + chalk@4.1.2: dependencies: ansi-styles: 4.3.0 @@ -4109,6 +4182,8 @@ snapshots: css-what@6.1.0: {} + css.escape@1.5.1: {} + cssstyle@4.0.1: dependencies: rrweb-cssom: 0.6.0 @@ -4219,6 +4294,8 @@ snapshots: dom-accessibility-api@0.5.16: {} + dom-accessibility-api@0.6.3: {} + dom-helpers@5.2.1: dependencies: '@babel/runtime': 7.24.6 @@ -4760,6 +4837,8 @@ snapshots: imurmurhash@0.1.4: {} + indent-string@4.0.0: {} + inflight@1.0.6: dependencies: once: 1.4.0 @@ -5151,6 +5230,8 @@ snapshots: mimic-fn@4.0.0: {} + min-indent@1.0.1: {} + minimatch@3.0.3: dependencies: brace-expansion: 1.1.11 @@ -5462,6 +5543,11 @@ snapshots: dependencies: picomatch: 2.3.1 + redent@3.0.0: + dependencies: + indent-string: 4.0.0 + strip-indent: 3.0.0 + reflect.getprototypeof@1.0.6: dependencies: call-bind: 1.0.7 @@ -5716,6 +5802,10 @@ snapshots: strip-final-newline@3.0.0: {} + strip-indent@3.0.0: + dependencies: + min-indent: 1.0.1 + strip-json-comments@3.1.1: {} strip-literal@2.1.0: diff --git a/ui/src/explorer/file_selector.test.tsx b/ui/src/explorer/file_selector.test.tsx new file mode 100644 index 0000000000..45ea05cbf7 --- /dev/null +++ b/ui/src/explorer/file_selector.test.tsx @@ -0,0 +1,40 @@ +// @vitest-environment jsdom + +import {fireEvent, render} from '@testing-library/react'; +import {FileSelector} from './file_selector.tsx'; +import {assert, expect, test, vi} from 'vitest'; + +test('FileSelector should render correctly', () => { + const mockHandler = vi.fn(); + const {getByText} = render(); + expect(getByText('Select file')).toBeInTheDocument(); +}); + +test('FileSelector should call handler when file size is within limit', () => { + const mockHandler = vi.fn(); + const {getByLabelText} = render(); + const file = new File(['dummy content'], 'dummy.txt', {type: 'text/plain'}); + fireEvent.change(getByLabelText('Select file'), {target: {files: [file]}}); + expect(mockHandler).toHaveBeenCalledWith(file); +}); + +test('FileSelector should not call handler when file size exceeds limit', () => { + const mockHandler = vi.fn(); + const {getByLabelText} = render(); + const file = new File(["0".repeat(1024 * 1024 * 31)], 'dummy.txt', {type: 'text/plain'}); + assert(file.size > 1024 * 1024 * 30); + + fireEvent.change(getByLabelText('Select file'), {target: {files: [file]}}); + expect(mockHandler).not.toHaveBeenCalled(); +}); + +test('FileSelector should call handler when file size exceeds limit and user chooses to continue', () => { + const mockHandler = vi.fn(); + const {getByLabelText, getByText} = render(); + const file = new File(["0".repeat(1024 * 1024 * 31)], 'dummy.txt', {type: 'text/plain'}); + assert(file.size > 1024 * 1024 * 30); + + fireEvent.change(getByLabelText('Select file'), {target: {files: [file]}}); + fireEvent.click(getByText('Continue')); + expect(mockHandler).toHaveBeenCalledWith(file); +}); \ No newline at end of file diff --git a/ui/src/explorer/file_selector.tsx b/ui/src/explorer/file_selector.tsx index e5a9420ba5..4fea98a2fe 100644 --- a/ui/src/explorer/file_selector.tsx +++ b/ui/src/explorer/file_selector.tsx @@ -34,6 +34,13 @@ export const FileSelector = ({handler}: { setOpen(false) }, []) + const handleContinue = useCallback(() => { + if (pendingFile) { + handler(pendingFile) + setOpen(false) + } + }, [handler, pendingFile]) + return ( <> - + { + cleanup() +}) \ No newline at end of file