Skip to content

Commit d5ba61c

Browse files
committed
improvements to the tests
1 parent 05859a0 commit d5ba61c

19 files changed

+4721
-2555
lines changed

.gitignore

+3
Original file line numberDiff line numberDiff line change
@@ -60,3 +60,6 @@ database-debug.log
6060
firebase-debug.log
6161
firestore-debug.log
6262
ui-debug.log
63+
64+
65+
storybook-static

migrations.json

+75-308
Large diffs are not rendered by default.

nx.json

+9
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,15 @@
7575
"previewTargetName": "preview",
7676
"serveStaticTargetName": "serve-static"
7777
}
78+
},
79+
{
80+
"plugin": "@nx/storybook/plugin",
81+
"options": {
82+
"serveStorybookTargetName": "serve:storybook",
83+
"buildStorybookTargetName": "build:storybook",
84+
"testStorybookTargetName": "test-storybook",
85+
"staticStorybookTargetName": "static-storybook"
86+
}
7887
}
7988
],
8089
"parallel": 1,

package.json

+37-23
Original file line numberDiff line numberDiff line change
@@ -16,20 +16,24 @@
1616
"test": "yarn reset && nx run-many --target=test-pipeline --parallel=1",
1717
"lint": "yarn reset && nx run-many --target=lint --parallel=10",
1818
"typecheck": "yarn reset && nx run-many --target=typecheck --parallel=10",
19-
"release": "yarn reset && nx run-many --target=release --parallel=1"
19+
"release": "yarn reset && nx run-many --target=release --parallel=1",
20+
"nx:upgrade": "npx nx migrate latest",
21+
"storybook:start": "nx storybook storybook --open",
22+
"storybook:build": "nx run storybook:build-storybook --skip-nx-cache",
23+
"storybook:test": "yarn start & test-storybook --url http://127.0.0.1:4400 --config-dir ./storybook/.storybook"
2024
},
2125
"private": true,
2226
"dependencies": {
23-
"@nx/cypress": "19.1.0",
24-
"@nx/eslint-plugin": "^19.1.0",
25-
"@nx/jest": "19.1.0",
26-
"@nx/js": "19.1.0",
27-
"@nx/next": "19.1.0",
28-
"@nx/react": "19.1.0",
29-
"@nx/vite": "19.1.0",
30-
"@nx/web": "19.1.0",
31-
"@nx/workspace": "19.1.0",
32-
"nx": "19.1.0",
27+
"@nx/cypress": "20.3.3",
28+
"@nx/eslint-plugin": "20.3.3",
29+
"@nx/jest": "20.3.3",
30+
"@nx/js": "20.3.3",
31+
"@nx/next": "20.3.3",
32+
"@nx/react": "20.3.3",
33+
"@nx/vite": "20.3.3",
34+
"@nx/web": "20.3.3",
35+
"@nx/workspace": "20.3.3",
36+
"nx": "20.3.3",
3337
"regenerator-runtime": "0.13.7"
3438
},
3539
"devDependencies": {
@@ -40,19 +44,29 @@
4044
"@emotion/styled": "11.11.0",
4145
"@mui/icons-material": "^5.8.4",
4246
"@mui/material": "^5.8.4",
47+
"@ngneat/falso": "^7.3.0",
48+
"@nx/storybook": "20.3.3",
4349
"@reins/hooks": "0.14.0",
4450
"@reins/router": "0.14.0",
4551
"@reins/types": "0.14.0",
4652
"@reins/utils": "0.14.0",
47-
"@swc-node/register": "~1.8.0",
53+
"@storybook/addon-essentials": "^8.4.6",
54+
"@storybook/addon-interactions": "^8.4.6",
55+
"@storybook/core-server": "^8.4.6",
56+
"@storybook/jest": "^0.2.3",
57+
"@storybook/react": "^8.5.1",
58+
"@storybook/react-vite": "^8.5.1",
59+
"@storybook/test-runner": "^0.19.0",
60+
"@storybook/testing-library": "^0.2.2",
61+
"@swc-node/register": "1.9.2",
4862
"@swc/cli": "~0.3.12",
49-
"@swc/core": "~1.3.85",
50-
"@swc/helpers": "~0.5.2",
63+
"@swc/core": "1.5.7",
64+
"@swc/helpers": "0.5.15",
5165
"@testing-library/dom": "^10.1.0",
5266
"@testing-library/jest-dom": "^6.4.5",
5367
"@testing-library/react": "16.0.0",
5468
"@testing-library/user-event": "^14.5.2",
55-
"@types/jest": "^29.5.12",
69+
"@types/jest": "29.5.14",
5670
"@types/node": "18.16.9",
5771
"@types/react": "18.3.1",
5872
"@types/react-dom": "18.3.0",
@@ -62,7 +76,7 @@
6276
"@typescript-eslint/rule-tester": "^7.18.0",
6377
"@vitejs/plugin-react": "4.3.0",
6478
"@zerollup/ts-transform-paths": "^1.7.18",
65-
"babel-jest": "^29.7.0",
79+
"babel-jest": "29.7.0",
6680
"commitlint": "^17.0.2",
6781
"core-js": "^3.6.5",
6882
"cypress": "12.17.4",
@@ -76,12 +90,12 @@
7690
"eslint-config-prettier": "^9.1.0",
7791
"eslint-config-react-app": "^7.0.1",
7892
"eslint-plugin-cypress": "2.15.2",
79-
"eslint-plugin-import": "2.29.1",
80-
"eslint-plugin-jsx-a11y": "6.8.0",
93+
"eslint-plugin-import": "2.31.0",
94+
"eslint-plugin-jsx-a11y": "6.10.1",
8195
"eslint-plugin-mdx": "^3.1.5",
8296
"eslint-plugin-prettier": "^5.1.3",
8397
"eslint-plugin-react": "7.34.1",
84-
"eslint-plugin-react-hooks": "4.6.2",
98+
"eslint-plugin-react-hooks": "5.0.0",
8599
"executioner": "^2.0.1",
86100
"husky": "8.0.1",
87101
"jest": "29.7.0",
@@ -95,20 +109,20 @@
95109
"next": "14.2.3",
96110
"notistack": "^2.0.5",
97111
"prettier": "^3.2.5",
98-
"react": ">= 16.8.0",
112+
"react": "19.0.0",
99113
"react-countdown": "^2.3.2",
100-
"react-dom": "18.3.1",
101-
"react-router-dom": "6.11.2",
114+
"react-dom": "19.0.0",
102115
"react-test-renderer": "18.2.0",
103116
"rollup": "^4.18.0",
104117
"rollup-plugin-dts": "^6.1.1",
105118
"semantic-release": "^19.0.5",
119+
"storybook": "8.5.1",
106120
"terminal-link": "^3.0.0",
107121
"ts-jest": "29.2.5",
108122
"ts-node": "10.9.2",
109123
"tsc-alias": "^1.8.8",
110124
"tslib": "^2.3.0",
111-
"typescript": "5.5.4",
125+
"typescript": "5.6.3",
112126
"undici": "6.19.0",
113127
"vite": "^5.4.2",
114128
"vite-plugin-eslint": "^1.8.1",

packages/core/src/managers/logger/logger.manager.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import EventEmitter from "events";
22

3-
import { ClientInstance } from "client";
3+
import type { ClientInstance } from "client";
44
import { logger, LogLevel, LoggerOptionsType, logLevelOrder, LoggerType, LoggerMethods } from "managers";
55

66
/**
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
/* eslint-disable import/no-default-export */
2+
import { createClient } from "@hyper-fetch/core";
3+
import { Meta, StoryObj } from "@storybook/react";
4+
import { randEmail, randFullName, randNumber, randUuid } from "@ngneat/falso";
5+
import { userEvent, within } from "@storybook/test";
6+
7+
import { Devtools } from "devtools";
8+
import { StoryWrapper } from "./utils/story-wrapper";
9+
10+
const client = createClient({ url: "http://localhost:5000" });
11+
12+
const getUsers = client
13+
.createRequest<{ response: { id: string; email: string; name: string; age: number }[] }>()({
14+
method: "GET",
15+
endpoint: "/users",
16+
})
17+
.setMock(() => ({
18+
data: [{ id: randUuid(), email: randEmail(), name: randFullName(), age: randNumber() }],
19+
status: 200,
20+
}));
21+
22+
const meta: Meta<typeof Devtools> = {
23+
component: Devtools,
24+
title: "Devtools",
25+
tags: ["network"],
26+
excludeStories: /.*Devtools$/,
27+
args: {
28+
initiallyOpen: true,
29+
},
30+
};
31+
32+
// eslint-disable-next-line import/no-default-export
33+
export default meta;
34+
35+
export const Primary: StoryObj<typeof Devtools> = {
36+
render: (props) => (
37+
<StoryWrapper requests={[{ name: "Get Users", request: getUsers }]}>
38+
<Devtools {...props} client={client} />
39+
</StoryWrapper>
40+
),
41+
play: async ({ canvasElement }) => {
42+
const canvas = within(canvasElement);
43+
const getUsersButton = canvas.getByTestId("get-users-button");
44+
45+
await userEvent.click(getUsersButton);
46+
47+
// await expect(canvas.getByText("/users")).toBeInTheDocument();
48+
},
49+
};
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
import { RequestInstance } from "@hyper-fetch/core";
2+
3+
export const StoryWrapper = ({
4+
children,
5+
requests,
6+
}: {
7+
children: React.ReactNode;
8+
requests: { request: RequestInstance; name: string }[];
9+
}) => {
10+
return (
11+
<div>
12+
<div>
13+
{requests.map(({ name, request }) => (
14+
<button
15+
data-testid={`${name.toLowerCase().split(" ").join("-")}-button`}
16+
type="button"
17+
onClick={() => request.send()}
18+
>
19+
{name}
20+
</button>
21+
))}
22+
</div>
23+
{children}
24+
</div>
25+
);
26+
};

packages/devtools-standalone/src/sockets/devtools.socket.wrapper.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -74,7 +74,7 @@ export const DevtoolsSocketWrapper = ({ workspace, client }: { workspace: string
7474
handleEvent(client, eventData, logger, setRequestList, workspace);
7575
});
7676
useEffect(() => {
77-
sendMessage.emit({ data: { messageType: MessageType.DEVTOOLS_CLIENT_CONFIRM, connectionName: workspace } });
77+
sendMessage.emit({ payload: { messageType: MessageType.DEVTOOLS_CLIENT_CONFIRM, connectionName: workspace } });
7878
}, []);
7979

8080
return <Devtools workspace={workspace} client={client} initiallyOpen={true} />;

storybook/.eslintrc.json

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{
2+
"extends": ["plugin:@nx/react", "../.eslintrc.json"],
3+
"overrides": [
4+
{
5+
"files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
6+
"rules": {}
7+
},
8+
{
9+
"files": ["*.ts", "*.tsx"],
10+
"rules": {}
11+
},
12+
{
13+
"files": ["*.js", "*.jsx"],
14+
"rules": {}
15+
}
16+
]
17+
}

storybook/.storybook/main.ts

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
import type { StorybookConfig } from "@storybook/react-vite";
2+
3+
import { nxViteTsPaths } from "@nx/vite/plugins/nx-tsconfig-paths.plugin";
4+
import { mergeConfig } from "vite";
5+
import react from "@vitejs/plugin-react";
6+
import tsconfigPaths from "vite-tsconfig-paths";
7+
8+
const config: StorybookConfig = {
9+
stories: ["../../packages/**/*.stories.@(js|jsx|ts|tsx|mdx)"],
10+
addons: ["@storybook/addon-essentials", "@storybook/addon-interactions"],
11+
core: {
12+
builder: "@storybook/builder-vite", // 👈 The builder enabled here.
13+
},
14+
framework: {
15+
name: "@storybook/react-vite",
16+
options: {},
17+
},
18+
typescript: {
19+
reactDocgen: "react-docgen-typescript",
20+
},
21+
viteFinal: async (config) =>
22+
mergeConfig(config, {
23+
plugins: [react(), tsconfigPaths(), nxViteTsPaths()],
24+
}),
25+
};
26+
27+
export default config;
28+
29+
// To customize your Vite configuration you can use the viteFinal field.
30+
// Check https://storybook.js.org/docs/react/builders/vite#configuration
31+
// and https://nx.dev/recipes/storybook/custom-builder-configs

storybook/.storybook/preview.tsx

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import React from "react";
2+
import { Preview } from "@storybook/react";
3+
4+
const preview: Preview = {
5+
decorators: [(Story) => <Story />],
6+
};
7+
8+
export default preview;

storybook/README.md

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
# storybook-host
2+
3+
This library was generated with [Nx](https://nx.dev).
4+
5+
## Running unit tests
6+
7+
Run `nx test storybook-host` to execute the unit tests via [Jest](https://jestjs.io).

storybook/project.json

+51
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
{
2+
"name": "storybook",
3+
"$schema": "../node_modules/nx/schemas/project-schema.json",
4+
"sourceRoot": "storybook/src",
5+
"projectType": "library",
6+
"tags": [],
7+
"targets": {
8+
"lint": {
9+
"executor": "@nx/eslint:lint",
10+
"outputs": ["{options.outputFile}"]
11+
},
12+
"storybook": {
13+
"executor": "@nx/storybook:storybook",
14+
"options": {
15+
"port": 4400,
16+
"configDir": "storybook/.storybook"
17+
},
18+
"configurations": {
19+
"ci": {
20+
"quiet": true
21+
}
22+
}
23+
},
24+
"storybook-composition": {
25+
"executor": "nx:run-commands",
26+
"options": {
27+
"commands": ["nx storybook ui", "nx storybook forms"],
28+
"parallel": true
29+
}
30+
},
31+
"build-storybook": {
32+
"executor": "@nx/storybook:build",
33+
"outputs": ["{options.outputDir}"],
34+
"options": {
35+
"outputDir": "dist/storybook",
36+
"configDir": "storybook/.storybook"
37+
},
38+
"configurations": {
39+
"ci": {
40+
"quiet": true
41+
}
42+
}
43+
},
44+
"test-storybook": {
45+
"executor": "nx:run-commands",
46+
"options": {
47+
"command": "test-storybook -c storybook/.storybook --url=http://localhost:4400"
48+
}
49+
}
50+
}
51+
}

storybook/tsconfig.json

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
{
2+
"compilerOptions": {
3+
"allowJs": false,
4+
"esModuleInterop": false,
5+
"allowSyntheticDefaultImports": true,
6+
"strict": true,
7+
"baseUrl": ".",
8+
"plugins": [{ "transform": "@zerollup/ts-transform-paths" }]
9+
},
10+
"files": [],
11+
"include": [],
12+
"references": [
13+
{
14+
"path": "./tsconfig.lib.json"
15+
},
16+
{
17+
"path": "./tsconfig.storybook.json"
18+
}
19+
],
20+
"extends": "../tsconfig.base.json"
21+
}

0 commit comments

Comments
 (0)