chore: standardize rc tooling and docs

Author: afc163

.dumirc.ts

@@ -2,7 +2,7 @@ import { defineConfig } from 'dumi';
 import path from 'path';
 
 const basePath = process.env.GH_PAGES ? '/notification/' : '/';
-const publicPath = process.env.GH_PAGES ? '/notification/' : '/';
+const publicPath = basePath;
 
 export default defineConfig({
   alias: {

README.md

@@ -94,14 +94,14 @@ export default () => (
 
 ## Examples
 
-Run the examples locally:
+Run the local dumi site:
 
 ```bash
 npm install
 npm start
 ```
 
-Then open the dumi dev server in your browser.
+Then open `http://localhost:8000`.
 
 ## API
 

README.zh-CN.md

@@ -94,14 +94,14 @@ export default () => (
 
 ## 示例
 
-本地运行示例：
+运行本地 dumi 站点：
 
 ```bash
 npm install
 npm start
 ```
 
-然后在浏览器中打开 dumi 开发服务地址。
+然后打开 `http://localhost:8000`。
 
 ## API
 

package.json

@@ -56,32 +56,32 @@
     "clsx": "^2.1.1"
   },
   "devDependencies": {
-    "@rc-component/father-plugin": "^2.0.4",
-    "@rc-component/np": "^1.0.3",
-    "@testing-library/jest-dom": "^6.0.0",
+    "@rc-component/father-plugin": "^2.2.0",
+    "@rc-component/np": "^1.0.4",
+    "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^15.0.7",
-    "@types/node": "^24.5.2",
-    "@types/react": "^18.0.0",
-    "@types/react-dom": "^18.0.0",
+    "@types/node": "^26.0.1",
+    "@types/react": "^18.3.31",
+    "@types/react-dom": "^18.3.7",
     "@types/testing-library__jest-dom": "^6.0.0",
-    "@typescript-eslint/eslint-plugin": "^5.59.7",
-    "@typescript-eslint/parser": "^5.59.7",
+    "@typescript-eslint/eslint-plugin": "^5.62.0",
+    "@typescript-eslint/parser": "^5.62.0",
     "@umijs/fabric": "^4.0.1",
-    "@vitest/coverage-v8": "^0.34.2",
-    "cross-env": "^7.0.0",
-    "dumi": "^2.1.0",
+    "@vitest/coverage-v8": "^4.1.9",
+    "cross-env": "^10.1.0",
+    "dumi": "^2.4.35",
     "eslint": "^8.57.1",
-    "father": "^4.0.0",
-    "gh-pages": "^3.1.0",
-    "husky": "^8.0.3",
-    "jsdom": "^24.0.0",
-    "less": "^4.2.0",
-    "lint-staged": "^14.0.1",
-    "prettier": "^3.0.2",
-    "react": "^18.0.0",
-    "react-dom": "^18.0.0",
-    "typescript": "^5.4.5",
-    "vitest": "^0.34.2"
+    "father": "^4.6.23",
+    "gh-pages": "^6.3.0",
+    "husky": "^9.1.7",
+    "jsdom": "^29.1.1",
+    "less": "^4.6.7",
+    "lint-staged": "^16.4.0",
+    "prettier": "^3.9.0",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "typescript": "^5.9.3",
+    "vitest": "^4.1.9"
   },
   "peerDependencies": {
     "react": ">=18.0.0",

tests/index.test.tsx

@@ -41,6 +41,10 @@ describe('Notification.Basic', () => {
     }
   }
 
+  function expectContentStyle(selector: string, content: string) {
+    expect((document.querySelector(selector) as HTMLElement).style.content).toBe(`"${content}"`);
+  }
+
   it('works', () => {
     const { instance, unmount } = renderDemo();
 
@@ -637,17 +641,15 @@ describe('Notification.Basic', () => {
   it('should style work', () => {
     const { instance } = renderDemo({
       style: () => ({
-        content: 'little',
+        content: '"little"',
       }),
     });
 
     act(() => {
       instance.open({});
     });
 
-    expect(document.querySelector('.rc-notification')).toHaveStyle({
-      content: 'little',
-    });
+    expectContentStyle('.rc-notification', 'little');
   });
 
   it('should open style and className work', () => {
@@ -656,15 +658,13 @@ describe('Notification.Basic', () => {
     act(() => {
       instance.open({
         style: {
-          content: 'little',
+          content: '"little"',
         },
         className: 'bamboo',
       });
     });
 
-    expect(document.querySelector('.rc-notification-notice')).toHaveStyle({
-      content: 'little',
-    });
+    expectContentStyle('.rc-notification-notice', 'little');
     expect(document.querySelector('.rc-notification-notice')).toHaveClass('bamboo');
   });
 
@@ -706,7 +706,7 @@ describe('Notification.Basic', () => {
         description: 'little',
         styles: {
           section: {
-            content: 'light',
+            content: '"light"',
           },
         },
         classNames: {
@@ -715,9 +715,7 @@ describe('Notification.Basic', () => {
       });
     });
 
-    expect(document.querySelector('.rc-notification-notice-section')).toHaveStyle({
-      content: 'light',
-    });
+    expectContentStyle('.rc-notification-notice-section', 'light');
     expect(document.querySelector('.rc-notification-notice-section')).toHaveClass('section-class');
   });
 
@@ -729,7 +727,7 @@ describe('Notification.Basic', () => {
         icon: <span />,
         styles: {
           wrapper: {
-            content: 'little',
+            content: '"little"',
           },
         },
         classNames: {
@@ -738,9 +736,7 @@ describe('Notification.Basic', () => {
       });
     });
 
-    expect(document.querySelector('.rc-notification-notice-wrapper')).toHaveStyle({
-      content: 'little',
-    });
+    expectContentStyle('.rc-notification-notice-wrapper', 'little');
     expect(document.querySelector('.rc-notification-notice-wrapper')).toHaveClass('bamboo');
   });
 
@@ -777,16 +773,16 @@ describe('Notification.Basic', () => {
       },
       styles: {
         title: {
-          content: 'global-title',
+          content: '"global-title"',
         },
         description: {
-          content: 'global-description',
+          content: '"global-description"',
         },
         actions: {
-          content: 'global-actions',
+          content: '"global-actions"',
         },
         icon: {
-          content: 'global-icon',
+          content: '"global-icon"',
         },
       },
     });
@@ -824,33 +820,33 @@ describe('Notification.Basic', () => {
       'global-title',
       'notice-title',
     );
+    expectContentStyle('.rc-notification-notice-title', 'global-title');
     expect(document.querySelector('.rc-notification-notice-title')).toHaveStyle({
-      content: 'global-title',
       marginTop: '1px',
     });
     expect(document.querySelector('.rc-notification-notice-description')).toHaveClass(
       'global-description',
       'notice-description',
     );
+    expectContentStyle('.rc-notification-notice-description', 'global-description');
     expect(document.querySelector('.rc-notification-notice-description')).toHaveStyle({
-      content: 'global-description',
       marginRight: '2px',
     });
     expect(document.querySelector('.rc-notification-notice-actions')).toHaveClass(
       'global-actions',
       'notice-actions',
     );
+    expectContentStyle('.rc-notification-notice-actions', 'global-actions');
     expect(document.querySelector('.rc-notification-notice-actions')).toHaveStyle({
-      content: 'global-actions',
       marginBottom: '3px',
     });
     expect(document.querySelector('.actions')).toBeFalsy();
     expect(document.querySelector('.rc-notification-notice-icon')).toHaveClass(
       'global-icon',
       'notice-icon',
     );
+    expectContentStyle('.rc-notification-notice-icon', 'global-icon');
     expect(document.querySelector('.rc-notification-notice-icon')).toHaveStyle({
-      content: 'global-icon',
       marginLeft: '4px',
     });
   });
@@ -875,10 +871,10 @@ describe('Notification.Basic', () => {
       },
       styles: {
         list: {
-          content: 'root-list',
+          content: '"root-list"',
         },
         listContent: {
-          content: 'little',
+          content: '"little"',
         },
       },
     });
@@ -887,13 +883,9 @@ describe('Notification.Basic', () => {
       instance.open({});
     });
 
-    expect(document.querySelector('.rc-notification-list')).toHaveStyle({
-      content: 'root-list',
-    });
+    expectContentStyle('.rc-notification-list', 'root-list');
     expect(document.querySelector('.rc-notification-list')).toHaveClass('root-list');
-    expect(document.querySelector('.rc-notification-list-content')).toHaveStyle({
-      content: 'little',
-    });
+    expectContentStyle('.rc-notification-list-content', 'little');
     expect(document.querySelector('.rc-notification-list-content')).toHaveClass('bamboo');
   });
 

tsconfig.json

@@ -8,13 +8,38 @@
     "skipLibCheck": true,
     "esModuleInterop": true,
     "paths": {
-      "@/*": ["src/*"],
-      "@@/*": [".dumi/tmp/*"],
-      "@rc-component/notification": ["src/index.ts"],
-      "rc-notification": ["src/index.ts"]
+      "@/*": [
+        "src/*"
+      ],
+      "@@/*": [
+        ".dumi/tmp/*"
+      ],
+      "@rc-component/notification": [
+        "src/index.ts"
+      ],
+      "rc-notification": [
+        "src/index.ts"
+      ]
     },
-    "types": ["vitest/globals"]
+    "types": [
+      "vitest/globals"
+    ],
+    "ignoreDeprecations": "5.0"
   },
-  "include": ["src", "docs", ".dumirc.ts", ".fatherrc.ts", "vitest.config.ts", "vitest-setup.ts"],
-  "exclude": ["node_modules", "lib", "es", "dist", "docs-dist", ".dumi"]
+  "include": [
+    "src",
+    "docs",
+    ".dumirc.ts",
+    ".fatherrc.ts",
+    "vitest.config.ts",
+    "vitest-setup.ts"
+  ],
+  "exclude": [
+    "node_modules",
+    "lib",
+    "es",
+    "dist",
+    "docs-dist",
+    ".dumi"
+  ]
 }