From d262b9906b9481f9dfbf6ee4563445119b3efde4 Mon Sep 17 00:00:00 2001 From: lorne <1991wangliang@gmail.com> Date: Thu, 2 Jan 2025 19:59:03 +0800 Subject: [PATCH 1/4] add jest --- .../src/pages/welcome/__test__/index.test.tsx | 7 ++ admin-ui/src/pages/welcome/data.ts | 18 +++ admin-ui/src/pages/welcome/index.tsx | 116 ++++-------------- 3 files changed, 46 insertions(+), 95 deletions(-) create mode 100644 admin-ui/src/pages/welcome/data.ts diff --git a/admin-ui/src/pages/welcome/__test__/index.test.tsx b/admin-ui/src/pages/welcome/__test__/index.test.tsx index ee0f11da..4fbc8f3d 100644 --- a/admin-ui/src/pages/welcome/__test__/index.test.tsx +++ b/admin-ui/src/pages/welcome/__test__/index.test.tsx @@ -3,6 +3,7 @@ import Welcome from '../index'; import {render} from "@testing-library/react"; import store from "@/store/Redux"; import {Provider} from "react-redux"; +import {Calculate} from "../data"; // test description for the component describe('Welcome Component', () => { @@ -23,4 +24,10 @@ describe('Welcome Component', () => { // log the element text content console.log(countElement?.textContent); }); + + + test('method add test', () => { + const sum = Calculate.add(1,1); + expect(sum).toBe(2); + }); }); diff --git a/admin-ui/src/pages/welcome/data.ts b/admin-ui/src/pages/welcome/data.ts new file mode 100644 index 00000000..8128121b --- /dev/null +++ b/admin-ui/src/pages/welcome/data.ts @@ -0,0 +1,18 @@ +export class Calculate{ + + static add = (a: number, b: number) => { + return a + b; + } + + static sub = (a: number, b: number) => { + return a - b; + } + + static mul = (a: number, b: number) => { + return a * b; + } + + static div = (a: number, b: number) => { + return a / b; + } +} diff --git a/admin-ui/src/pages/welcome/index.tsx b/admin-ui/src/pages/welcome/index.tsx index ca97560a..66665af8 100644 --- a/admin-ui/src/pages/welcome/index.tsx +++ b/admin-ui/src/pages/welcome/index.tsx @@ -1,106 +1,32 @@ -import React, {useCallback, useMemo, useState} from 'react'; +import React from 'react'; +import logo from '@/assets/logo.svg'; import './index.scss'; +import {useSelector} from "react-redux"; +import {RootState} from "@/store/Redux"; +import RoleControl from "@/utils/RoleControl"; import Page from "@/components/Layout/Page"; -import {AgGridReact} from 'ag-grid-react'; -import {AllCommunityModule, ModuleRegistry, themeQuartz,} from "ag-grid-community"; -import {AG_GRID_LOCALE_CN} from '@ag-grid-community/locale'; - -const localeText = AG_GRID_LOCALE_CN; -// Register all Community features -ModuleRegistry.registerModules([AllCommunityModule]); - - -const myTheme = themeQuartz.withParams({ - /* Low spacing = very compact */ - spacing: 2, - accentColor: "red", - -}); const Index = () => { - const [rowData, setRowData] = useState(); - const [columnDefs, setColumnDefs] = useState([ - { - field: "athlete", - minWidth: 170, - headerName: "运动员" - }, - { - field: "age", - headerName: "年龄" - }, - { - field: "country", - headerName: '国家信息', - headerClass: 'country-header', - children: [ - { - field: "country", - headerName: "国家" - }, - {field: "name"}, - {field: "code"} - ] - }, - {field: "year", headerName: "年份"}, - {field: "date", headerName: "日期"}, - {field: "sport", headerName: "运动"}, - {field: "gold", headerName: "金牌"}, - {field: "silver", headerName: "银牌"}, - {field: "bronze", headerName: "铜牌"}, - {field: "total", headerName: "总计",editable: false}, - ]); - const theme = useMemo(() => { - return myTheme; - }, []); - const defaultColDef = useMemo(() => { - return { - editable: true, - filter: true, - }; - }, []); - - const onGridReady = useCallback((params: any) => { - fetch("https://www.ag-grid.com/example-assets/olympic-winners.json") - .then((resp) => resp.json()) - .then((data) => setRowData(data)); - }, []); + const counter = useSelector((state: RootState) => state.counter.value); + const username = localStorage.getItem('username'); return ( -
- { - console.log("Row Data Updated", params) - }} - onCellValueChanged={(event) => { - console.log(`New Cell Value:`, event); - // 当金牌，银牌，铜牌的值发生变化时，更新总计 - - //@ts-ignore - if (['gold', 'silver', 'bronze'].includes(event.colDef.field)) { - const gold = event.data.gold; - const silver = event.data.silver; - const bronze = event.data.bronze; - const total = gold + silver + bronze; - event.data.total = total; - event.api.refreshCells({columns: ['total']}); - } - }} - - columnDefs={columnDefs} - theme={theme} - pagination={true} - defaultColDef={defaultColDef} - onGridReady={onGridReady} - - /> +
+
+ logo +

+ hi {username} , Redux counter: {counter}, Roles: {RoleControl.roles().map(item => ( + + ))} +

+
); From 853f296ff7bd46ca4880fa61d8144af37f23cffe Mon Sep 17 00:00:00 2001 From: lorne <1991wangliang@gmail.com> Date: Thu, 2 Jan 2025 22:36:47 +0800 Subject: [PATCH 2/4] add matcher --- admin-ui/src/jest.setup.ts | 17 +++-- .../pages/flow/work/__test__/index.test.tsx | 75 ++++++++++++------- admin-ui/src/pages/flow/work/index.tsx | 9 ++- .../flow/matcher/OperatorMatcher.java | 4 + 4 files changed, 72 insertions(+), 33 deletions(-) diff --git a/admin-ui/src/jest.setup.ts b/admin-ui/src/jest.setup.ts index 27fffb57..c74d7b05 100644 --- a/admin-ui/src/jest.setup.ts +++ b/admin-ui/src/jest.setup.ts @@ -1,8 +1,8 @@ import '@testing-library/jest-dom'; +import {TextEncoder} from 'util'; - -// src/jest.setup.ts -import '@testing-library/jest-dom'; +// 添加全局对象 +global.TextEncoder = TextEncoder; // Mock window.matchMedia Object.defineProperty(window, 'matchMedia', { @@ -21,9 +21,14 @@ Object.defineProperty(window, 'matchMedia', { // Mock ResizeObserver global.ResizeObserver = class ResizeObserver { - observe() {} - unobserve() {} - disconnect() {} + observe() { + } + + unobserve() { + } + + disconnect() { + } }; // Suppress findDOMNode warnings in test output diff --git a/admin-ui/src/pages/flow/work/__test__/index.test.tsx b/admin-ui/src/pages/flow/work/__test__/index.test.tsx index a100b0ac..30686478 100644 --- a/admin-ui/src/pages/flow/work/__test__/index.test.tsx +++ b/admin-ui/src/pages/flow/work/__test__/index.test.tsx @@ -1,40 +1,63 @@ import React from 'react'; -import {render} from "@testing-library/react"; -import axios from 'axios'; +import {act, fireEvent, render, screen, waitFor} from "@testing-library/react"; import FlowPage from "@/pages/flow/work"; jest.mock('axios'); -const mockedAxios = axios as jest.Mocked; // test description for the component describe('Welcome Component', () => { - test('renders with default initial value', () => { - - mockedAxios.get.mockImplementation((url) => { - if (url === '/api/users/123') { - return Promise.resolve({ - data: { name: 'John Doe', email: 'john@example.com' } - }); - } - if (url === '/api/users/123/posts') { - return Promise.resolve({ - data: [{ id: 1, title: 'Post 1' }] - }); - } - if (url === '/api/users/123/followers') { - return Promise.resolve({ - data: [{ id: 1, name: 'Follower 1' }] - }); - } - return Promise.reject(new Error('Not found')); - }); + + test('renders with default initial value', async () => { // render the component - const {getByTestId} =render( - + render( + ); - const flowTable = getByTestId("flow-table"); + const flowTable = screen.getByTestId("flow-table"); expect(flowTable).toBeInTheDocument(); + + const flowAddBtn = screen.getByTestId("flow-add-btn"); + expect(flowAddBtn).toBeInTheDocument(); + + + await act(async () => { + fireEvent.click(flowAddBtn); + }); + + await waitFor(() => { + const flowEditor = screen.getByTestId("flow-editor"); + expect(flowEditor).toBeInTheDocument(); + }); + + const inputTitle = screen.getByLabelText('标题'); + const inputCode = screen.getByLabelText('编码'); + const inputDescription = screen.getByLabelText('描述'); + const inputPostponedMax = screen.getByLabelText('最大延期次数'); + const inputSkipIfSameApprover = screen.getByLabelText('是否跳过相同审批人'); + const submitButton = screen.getByTestId('flow-editor-submit'); + expect(submitButton).toBeInTheDocument(); + + + await act(async () => { + fireEvent.change(inputTitle, {target: {value: 'test'}}); + expect(inputTitle).toHaveValue('test'); + fireEvent.change(inputCode, {target: {value: 'test'}}); + expect(inputCode).toHaveValue('test'); + fireEvent.change(inputDescription, {target: {value: 'test'}}); + expect(inputDescription).toHaveValue('test'); + fireEvent.change(inputPostponedMax, {target: {value: '1'}}); + expect(inputPostponedMax).toHaveValue('1'); + fireEvent.change(inputSkipIfSameApprover, {target: {value: 'true'}}); + expect(inputSkipIfSameApprover).toHaveValue('true'); + fireEvent.click(submitButton); + }); + + await waitFor(() => { + // todo 不敢展示，却必须得展示才能正常 + const submitButton = screen.getByTestId('flow-editor-submit'); + expect(submitButton).toBeInTheDocument(); + }); + }); }); diff --git a/admin-ui/src/pages/flow/work/index.tsx b/admin-ui/src/pages/flow/work/index.tsx index 41268f7b..69d45222 100644 --- a/admin-ui/src/pages/flow/work/index.tsx +++ b/admin-ui/src/pages/flow/work/index.tsx @@ -178,6 +178,7 @@ const FlowPage = () => { toolBarRender={() => { return [