chore: try fix test error (#8925)

* feat(tests): integrate jsdom and update StyleProvider in demo tests

* fix(tests): 优化测试文件中的导入顺序和样式

* 优化渲染器，减少block

* fix(tests): 更新 lightFilter 测试以使用新的渲染方法并修复元素选择

Author: chenshuai2144

package.json

@@ -49,37 +49,38 @@
   },
   "devDependencies": {
     "@ant-design/antd-theme-variable": "^1.0.0",
-    "@ant-design/cssinjs": "^1.21.1",
-    "@ant-design/icons": "^5.5.1",
+    "@ant-design/cssinjs": "^1.22.1",
+    "@ant-design/icons": "^5.5.2",
     "@babel/core": "^7.26.0",
     "@babel/eslint-plugin": "^7.25.9",
-    "@babel/parser": "^7.26.2",
+    "@babel/parser": "^7.26.3",
     "@babel/plugin-proposal-object-rest-spread": "^7.20.7",
     "@babel/preset-env": "^7.26.0",
-    "@babel/preset-react": "^7.25.9",
+    "@babel/preset-react": "^7.26.3",
     "@babel/preset-typescript": "^7.26.0",
-    "@babel/traverse": "^7.25.9",
-    "@emotion/babel-plugin": "^11.12.0",
-    "@emotion/cache": "^11.13.1",
-    "@emotion/css": "^11.13.4",
-    "@emotion/serialize": "^1.3.2",
+    "@babel/traverse": "^7.26.4",
+    "@emotion/babel-plugin": "^11.13.5",
+    "@emotion/cache": "^11.14.0",
+    "@emotion/css": "^11.13.5",
+    "@emotion/serialize": "^1.3.3",
     "@floating-ui/react": "^0.19.2",
     "@octokit/core": "^3.6.0",
     "@octokit/rest": "^18.12.0",
-    "@testing-library/dom": "^8.20.1",
-    "@testing-library/jest-dom": "^5.17.0",
-    "@testing-library/react": "^13.4.0",
+    "@testing-library/dom": "^10.4.0",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.1.0",
     "@testing-library/react-hooks": "^8.0.1",
     "@testing-library/user-event": "^14.5.2",
     "@types/chroma-js": "^2.4.4",
     "@types/glob": "^8.1.0",
     "@types/history": "^4.7.11",
+    "@types/jsdom": "^21.1.7",
     "@types/lodash": "^4.17.13",
     "@types/lodash-es": "^4.17.12",
     "@types/mockjs": "^1.0.10",
     "@types/node": "^14.18.63",
-    "@types/react": "^18.3.12",
-    "@types/react-dom": "^18.3.1",
+    "@types/react": "^18.3.17",
+    "@types/react-dom": "^18.3.5",
     "@types/react-helmet": "^6.1.11",
     "@types/react-responsive": "^8.0.8",
     "@types/shallowequal": "^1.1.5",
@@ -90,10 +91,10 @@
     "@umijs/plugin-analytics": "^0.2.4",
     "@umijs/test": "^3.5.43",
     "@umijs/test-utils": "^3.5.43",
-    "@umijs/utils": "^4.3.31",
+    "@umijs/utils": "^4.4.1",
     "@vitest/coverage-istanbul": "^0.34.6",
     "animated-scroll-to": "^2.3.0",
-    "antd": "^5.22.1",
+    "antd": "^5.22.5",
     "antd-style": "^3.7.1",
     "babel-loader": "^9.2.1",
     "babel-types": "^6.26.0",
@@ -102,7 +103,7 @@
     "copy-to-clipboard": "^3.3.3",
     "cross-env": "^7.0.3",
     "dayjs": "^1.11.13",
-    "dumi": "~2.4.13",
+    "dumi": "~2.4.16",
     "dumi-theme-antd-style": "~0.31.1",
     "esbuild": "^0.15.18",
     "eslint": "^8.57.1",
@@ -111,7 +112,7 @@
     "eslint-plugin-react-hooks": "^4.6.2",
     "eslint-plugin-unicorn": "^47.0.0",
     "execa": "^5.1.1",
-    "express": "^4.21.1",
+    "express": "^4.21.2",
     "fast-deep-equal": "^3.1.3",
     "father": "^4.5.1",
     "gh-pages": "^5.0.0",
@@ -120,7 +121,7 @@
     "inquirer": "^8.2.6",
     "jest-canvas-mock": "^2.5.2",
     "jest-fetch-mock": "^3.0.3",
-    "jsdom": "^19.0.0",
+    "jsdom": "^25.0.1",
     "lerna": "^3.22.1",
     "lint-staged": "^10.5.4",
     "lodash": "^4.17.21",
@@ -130,23 +131,23 @@
     "moment": "^2.30.1",
     "np": "^6.5.0",
     "nprogress": "^0.2.0",
-    "octokit": "^3.1.2",
+    "octokit": "^3.2.1",
     "polished": "^4.3.1",
     "prettier": "^2.8.8",
     "prettier-plugin-organize-imports": "^3.2.4",
-    "prettier-plugin-packagejson": "^2.5.3",
+    "prettier-plugin-packagejson": "^2.5.6",
     "pretty-quick": "^3.3.1",
     "query-string": "^6.14.1",
-    "rc-field-form": "^2.5.1",
+    "rc-field-form": "^2.7.0",
     "rc-footer": "^0.6.8",
-    "rc-resize-observer": "^1.4.0",
+    "rc-resize-observer": "^1.4.1",
     "rc-steps": "^6.0.1",
-    "rc-table": "^7.48.1",
-    "rc-util": "^5.43.0",
+    "rc-table": "^7.49.0",
+    "rc-util": "^5.44.2",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-draggable": "^4.4.6",
-    "react-layout-kit": "^1.9.0",
+    "react-layout-kit": "^1.9.1",
     "react-lazy-load": "^4.0.1",
     "react-markdown": "^8.0.7",
     "react-syntax-highlighter": "^15.6.1",
@@ -159,12 +160,12 @@
     "stylelint": "^13.13.1",
     "timezone-mock": "^1.3.6",
     "ts-node": "^10.9.2",
-    "typescript": "^5.6.3",
-    "umi": "^4.3.31",
+    "typescript": "^5.7.2",
+    "umi": "^4.4.1",
     "umi-request": "^1.4.0",
     "unified": "^11.0.5",
     "unist-util-visit": "^5.0.0",
-    "vitest": "^1.6.0",
+    "vitest": "^2.1.8",
     "write-pkg": "^4.0.0",
     "xhr-mock": "^2.5.1",
     "yorkie": "^2.0.0",

packages/field/src/index.tsx

@@ -222,7 +222,7 @@ const defaultRenderText = (
           ...props,
           mode: mode || 'read',
         },
-        <>{dataValue}</>,
+        <>{dataValue as any}</>,
       );
     }
     if (mode === 'update' || mode === 'edit') {
@@ -232,7 +232,7 @@ const defaultRenderText = (
           text: dataValue as React.ReactNode,
           ...props,
         },
-        <>{dataValue}</>,
+        <>{dataValue as any}</>,
       );
     }
   }

packages/form/src/layouts/LightFilter/index.tsx

@@ -148,11 +148,15 @@ const LightFilterContainer: React.FC<{
     >
       <div className={`${lightFilterClassName}-container ${hashId}`.trim()}>
         {outsideItems.map((child: any, index) => {
+          if (!child?.props) {
+            return child;
+          }
           const { key } = child;
-          const { fieldProps } = child.props;
+          const { fieldProps } = child?.props || {};
           const newPlacement = fieldProps?.placement
             ? fieldProps?.placement
             : placement;
+
           return (
             <div
               className={`${lightFilterClassName}-item ${hashId}`.trim()}
@@ -282,8 +286,9 @@ function LightFilter<T = Record<string, any>>(props: LightFilterProps<T>) {
           <LightFilterContainer
             prefixCls={prefixCls}
             items={items?.flatMap((item: any) => {
+              if (!item || !item?.type) return item;
               /** 如果是 ProFormGroup，直接拼接dom */
-              if (item?.type.displayName === 'ProForm-Group')
+              if (item?.type?.displayName === 'ProForm-Group')
                 return item.props.children;
               return item;
             })}

packages/form/src/layouts/QueryFilter/index.tsx

@@ -202,7 +202,7 @@ const flatMapItems = (
   ignoreRules?: boolean,
 ): React.ReactNode[] => {
   return items?.flatMap((item: any) => {
-    if (item?.type.displayName === 'ProForm-Group' && !item.props?.title) {
+    if (item?.type?.displayName === 'ProForm-Group' && !item.props?.title) {
       return item.props.children;
     }