@zat-design/sisyphus-react 3.13.18-beta.9 → 3.13.18

package/babel.config.js

@@ -1,3 +1,13 @@
 module.exports = {
-  presets: ['@babel/preset-env', ['@babel/preset-react', { runtime: 'automatic' }]],
+  presets: [
+    ['@babel/preset-env', { loose: true }],
+    ['@babel/preset-react', { runtime: 'automatic' }],
+    '@babel/preset-typescript'
+  ],
+  plugins: [
+    ['@babel/plugin-proposal-decorators', { legacy: true }],
+    ['@babel/plugin-proposal-class-properties', { loose: true }],
+    ['@babel/plugin-transform-private-methods', { loose: true }],
+    ['@babel/plugin-transform-private-property-in-object', { loose: true }],
+  ]
 };

package/es/ProForm/components/combination/Group/hooks/index.js

@@ -165,14 +165,9 @@ export var useTransformColumns = function useTransformColumns(params) {
       getValueProps: transform === null || transform === void 0 ? void 0 : transform.getValueProps,
       fieldProps: _objectSpread(_objectSpread(_objectSpread({}, column === null || column === void 0 ? void 0 : column.fieldProps), reactiveProps === null || reactiveProps === void 0 ? void 0 : reactiveProps.fieldProps), {}, {
         onChange: handleChange,
-        onBlur: handleBlur
-      }, names ? {
-        value: form.getFieldValue(columnName)
-      } // 独立字段模式
-      : {
+        onBlur: handleBlur,
         value: value === null || value === void 0 ? void 0 : value[index]
-      } // 数组值模式
-      )
+      })
     });
   });
 };

package/jest.config.js

@@ -1,8 +1,50 @@
-const React = require('react');
-
 module.exports = {
   setupFiles: ['jest-canvas-mock'],
-  globals: {
-    React,
+  setupFilesAfterEnv: ['<rootDir>/tests/setup.ts'],
+  testEnvironment: 'jsdom',
+  testEnvironmentOptions: {
+    url: 'http://localhost',
   },
+  moduleNameMapper: {
+    '^@/(.*)$': '<rootDir>/src/$1',
+    '^@zat-design/sisyphus-react$': '<rootDir>/src/index.ts',
+    '\\.(css|less|scss)$': 'identity-obj-proxy',
+    '\\.(png|jpg|jpeg|gif|svg)$': '<rootDir>/tests/__mocks__/fileMock.js',
+    '@zat-design/utils': '<rootDir>/tests/__mocks__/zatUtils.js',
+  },
+  collectCoverageFrom: [
+    'src/**/*.{ts,tsx}',
+    '!src/**/*.d.ts',
+    '!src/**/demos/**',
+    '!src/**/test/**',
+    '!src/old/**',
+    '!src/style/**',
+    '!src/**/symbolIcon.js',
+    '!src/index.ts',
+    '!src/tokens.ts',
+    '!src/utils/**',
+    '!src/locale/**',
+  ],
+  testMatch: [
+    '<rootDir>/src/**/__tests__/**/*.{ts,tsx}',
+    '<rootDir>/src/**/*.(test|spec).{ts,tsx}',
+  ],
+  testTimeout: 15000,
+  transform: {
+    '^.+\\.(ts|tsx)$': 'babel-jest',
+    '^.+\\.(js|jsx)$': 'babel-jest',
+  },
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json'],
+  transformIgnorePatterns: [
+    'node_modules/(?!(antd|@ant-design|@pansy|rc-.+|@babel/runtime|@zat-design)/)',
+  ],
+  coverageThreshold: {
+    global: {
+      branches: 80,
+      functions: 80,
+      lines: 80,
+      statements: 80,
+    },
+  },
+  coverageReporters: ['text', 'lcov', 'html'],
 };

package/lib/ProForm/components/combination/Group/hooks/index.js

@@ -173,14 +173,9 @@ var useTransformColumns = exports.useTransformColumns = function useTransformCol
       getValueProps: transform === null || transform === void 0 ? void 0 : transform.getValueProps,
       fieldProps: (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, column === null || column === void 0 ? void 0 : column.fieldProps), reactiveProps === null || reactiveProps === void 0 ? void 0 : reactiveProps.fieldProps), {}, {
         onChange: handleChange,
-        onBlur: handleBlur
-      }, names ? {
-        value: form.getFieldValue(columnName)
-      } // 独立字段模式
-      : {
+        onBlur: handleBlur,
         value: value === null || value === void 0 ? void 0 : value[index]
-      } // 数组值模式
-      )
+      })
     });
   });
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zat-design/sisyphus-react",
-  "version": "3.13.18-beta.9",
+  "version": "3.13.18",
   "license": "MIT",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -17,7 +17,7 @@
     "docs:deploy": "gh-pages -d docs-dist",
     "lint": "npm run lint:js && npm run lint:style && npm run lint:prettier",
     "lint-staged": "lint-staged",
-    "lint-staged:js": "eslint --ext .js,.jsx,.ts,.tsx",
+    "lint-staged:js": "eslint --ext .js,.jsx,.ts,.tsx --ignore-pattern '**/__tests__/**' --ignore-pattern '**/*.test.*' --ignore-pattern '**/*.spec.*'",
     "lint:fix": "eslint --fix --cache --ext .js,.jsx,.ts,.tsx --format=pretty ./src",
     "lint:js": "eslint --cache --ext .js,.jsx,.ts,.tsx --format=pretty ./src",
     "lint:prettier": "prettier --check \"**/*\" --end-of-line auto",

package/tests/__mocks__/fileMock.js

@@ -0,0 +1 @@
+module.exports = 'test-file-stub';

package/tests/__mocks__/zatUtils.js

@@ -0,0 +1,27 @@
+// Mock @zat-design/utils
+module.exports = {
+  tools: {
+    isValidUrl: jest.fn(() => true),
+    formatCurrency: jest.fn((value) => `¥${value}`),
+    formatDate: jest.fn((date) => new Date(date).toLocaleDateString()),
+  },
+  transforms: {
+    transformDate: jest.fn((value, params) => {
+      if (!value) return '';
+      return new Date(value).toLocaleDateString();
+    }),
+    transformSwitch: jest.fn((value) => value ? '是' : '否'),
+    transformMoney: jest.fn((value) => `¥${value || 0}`),
+    transformPercent: jest.fn((value) => `${(value || 0) * 100}%`),
+  },
+  validate: {
+    isEmail: jest.fn((email) => /\S+@\S+\.\S+/.test(email)),
+    isPhone: jest.fn((phone) => /^1[3-9]\d{9}$/.test(phone)),
+    isIdCard: jest.fn(() => true),
+  },
+  validateNameMap: {
+    email: 'isEmail',
+    phone: 'isPhone',
+    idCard: 'isIdCard',
+  },
+};

package/tests/setup.ts

@@ -0,0 +1,477 @@
+import '@testing-library/jest-dom';
+import 'jest-canvas-mock';
+import React from 'react';
+
+// Ensure JSDOM document.body exists and setup proper DOM environment
+if (typeof document !== 'undefined') {
+  // Ensure documentElement exists
+  if (!document.documentElement) {
+    const html = document.createElement('html');
+    document.appendChild(html);
+  }
+  
+  // Ensure head exists
+  if (!document.head) {
+    const head = document.createElement('head');
+    document.documentElement.appendChild(head);
+  }
+  
+  // Ensure body exists
+  if (!document.body) {
+    const body = document.createElement('body');
+    document.documentElement.appendChild(body);
+  }
+}
+
+// Mock testing library environment setup
+Object.defineProperty(global, 'MutationObserver', {
+  writable: true,
+  value: jest.fn().mockImplementation(() => ({
+    observe: jest.fn(),
+    disconnect: jest.fn(),
+    takeRecords: jest.fn(),
+  })),
+});
+
+// Setup test container div
+beforeEach(() => {
+  if (typeof document !== 'undefined' && document.body) {
+    try {
+      // Clean up any existing test containers
+      const existingContainers = document.querySelectorAll('[data-testid="test-container"]');
+      existingContainers.forEach(container => {
+        if (container.parentNode) {
+          try {
+            container.parentNode.removeChild(container);
+          } catch (e) {
+            // Ignore cleanup errors
+          }
+        }
+      });
+
+      // Create a fresh test container
+      const testContainer = document.createElement('div');
+      testContainer.setAttribute('data-testid', 'test-container');
+      testContainer.id = 'test-container';
+      document.body.appendChild(testContainer);
+    } catch (e) {
+      // Ignore setup errors - React Testing Library will handle this
+    }
+  }
+});
+
+// 抑制控制台错误
+const originalError = console.error;
+beforeAll(() => {
+  console.error = (...args: any[]) => {
+    if (
+      args.find(
+        arg =>
+          typeof arg === 'string' &&
+          (
+            arg.includes('Warning: ReactDOM.render is deprecated') ||
+            arg.includes('Warning: componentWillReceiveProps') ||
+            arg.includes('validateDOMNesting') ||
+            arg.includes('Warning: componentWillMount') ||
+            arg.includes('Warning: React.createFactory() is deprecated') ||
+            arg.includes('Warning: findDOMNode is deprecated') ||
+            arg.includes('act(...)') ||
+            arg.includes('useLayoutEffect does nothing on the server') ||
+            arg.includes('Invalid hook call') ||
+            arg.includes('Hooks can only be called inside') ||
+            arg.includes('Warning: Each child in a list should have a unique') ||
+            arg.includes('Warning: validateDOMNesting')
+          )
+      )
+    ) {
+      return;
+    }
+    originalError.call(console, ...args);
+  };
+});
+
+afterAll(() => {
+  console.error = originalError;
+});
+
+// Mock window APIs
+Object.defineProperty(window, 'matchMedia', {
+  writable: true,
+  value: jest.fn().mockImplementation(query => ({
+    matches: false,
+    media: query,
+    onchange: null,
+    addListener: jest.fn(),
+    removeListener: jest.fn(),
+    addEventListener: jest.fn(),
+    removeEventListener: jest.fn(),
+    dispatchEvent: jest.fn(),
+  })),
+});
+
+// Mock ahooks hooks - 基于ahooks官方测试实践改进
+jest.mock('ahooks', () => ({
+  useSetState: jest.fn((initialState) => {
+    const mockState = { current: initialState || {} };
+    const mockSetState = jest.fn((patch) => {
+      if (typeof patch === 'function') {
+        mockState.current = patch(mockState.current);
+      } else {
+        mockState.current = { ...mockState.current, ...patch };
+      }
+      return mockState.current;
+    });
+    return [mockState.current, mockSetState];
+  }),
+
+  useRequest: jest.fn((service, options = {}) => {
+    const mockState = {
+      loading: false,
+      data: null,
+      error: null,
+      params: [],
+    };
+
+    const mockActions = {
+      run: jest.fn((...params) => {
+        mockState.loading = true;
+        mockState.params = params;
+        // 模拟异步操作
+        setTimeout(() => {
+          mockState.loading = false;
+          mockState.data = 'mock-data';
+        }, 100);
+        return Promise.resolve('mock-data');
+      }),
+      refresh: jest.fn(() => {
+        mockState.loading = true;
+        setTimeout(() => {
+          mockState.loading = false;
+        }, 100);
+        return Promise.resolve('mock-data');
+      }),
+      cancel: jest.fn(() => {
+        mockState.loading = false;
+      }),
+      mutate: jest.fn((data) => {
+        mockState.data = data;
+      }),
+    };
+
+    const result = {
+      ...mockState,
+      ...mockActions,
+    };
+
+    // 如果提供了service函数，模拟调用
+    if (service && typeof service === 'function') {
+      result.run = jest.fn((...params) => {
+        mockState.loading = true;
+        mockState.params = params;
+
+        return new Promise((resolve, reject) => {
+          setTimeout(() => {
+            try {
+              const serviceResult = service(...params);
+              if (serviceResult instanceof Promise) {
+                serviceResult.then(resolve).catch(reject);
+              } else {
+                resolve(serviceResult);
+              }
+            } catch (error) {
+              reject(error);
+            } finally {
+              mockState.loading = false;
+            }
+          }, 100);
+        });
+      });
+    }
+
+    // 处理options
+    if (options.manual !== true) {
+      // 自动执行
+      setTimeout(() => {
+        result.run();
+      }, 0);
+    }
+
+    return result;
+  }),
+
+  useDebounce: jest.fn((value, delay) => value),
+
+  useThrottle: jest.fn((value, delay) => value),
+
+  useLocalStorageState: jest.fn((key, defaultValue) => {
+    const [state, setState] = [defaultValue, jest.fn()];
+    return [state, setState];
+  }),
+
+  useSessionStorageState: jest.fn((key, defaultValue) => {
+    const [state, setState] = [defaultValue, jest.fn()];
+    return [state, setState];
+  }),
+
+  useDeepCompareEffect: jest.fn((effect, deps) => {
+    if (effect && typeof effect === 'function') {
+      effect();
+    }
+  }),
+
+  useUpdateEffect: jest.fn((effect, deps) => {
+    if (effect && typeof effect === 'function') {
+      effect();
+    }
+  }),
+
+  useSize: jest.fn(() => ({ width: 100, height: 100 })),
+
+  useInViewport: jest.fn(() => [true, jest.fn()]),
+
+  useMemoizedFn: jest.fn((fn) => fn),
+
+  useMount: jest.fn((fn) => {
+    if (fn && typeof fn === 'function') {
+      fn();
+    }
+  }),
+
+  useUnmount: jest.fn((fn) => {
+    if (fn && typeof fn === 'function') {
+      fn();
+    }
+  }),
+
+  useDebounceEffect: jest.fn((effect, deps, wait) => {
+    if (effect && typeof effect === 'function') {
+      effect();
+    }
+  }),
+
+  useThrottleEffect: jest.fn((effect, deps, wait) => {
+    if (effect && typeof effect === 'function') {
+      effect();
+    }
+  }),
+}));
+
+Object.defineProperty(window, 'ResizeObserver', {
+  writable: true,
+  value: jest.fn().mockImplementation(() => ({
+    observe: jest.fn(),
+    unobserve: jest.fn(),
+    disconnect: jest.fn(),
+  })),
+});
+
+Object.defineProperty(window, 'IntersectionObserver', {
+  writable: true,
+  value: jest.fn().mockImplementation(() => ({
+    observe: jest.fn(),
+    unobserve: jest.fn(),
+    disconnect: jest.fn(),
+  })),
+});
+
+// Mock getBoundingClientRect
+Element.prototype.getBoundingClientRect = jest.fn(() => ({
+  width: 120,
+  height: 120,
+  top: 0,
+  left: 0,
+  bottom: 0,
+  right: 0,
+  x: 0,
+  y: 0,
+  toJSON: jest.fn(),
+}));
+
+// Mock scrollIntoView
+Element.prototype.scrollIntoView = jest.fn();
+
+// Mock getComputedStyle
+window.getComputedStyle = jest.fn(() => ({
+  getPropertyValue: jest.fn(() => ''),
+  setProperty: jest.fn(),
+  removeProperty: jest.fn(),
+} as any));
+
+// Mock URL methods
+global.URL.createObjectURL = jest.fn(() => 'mock-url');
+global.URL.revokeObjectURL = jest.fn();
+
+// Mock fetch
+global.fetch = jest.fn(() =>
+  Promise.resolve({
+    ok: true,
+    json: () => Promise.resolve({}),
+    blob: () => Promise.resolve(new Blob()),
+    text: () => Promise.resolve(''),
+  } as Response)
+);
+
+// Mock String methods to prevent format.match and format.replace errors
+String.prototype.match = String.prototype.match || jest.fn(() => []);
+String.prototype.replace = String.prototype.replace || jest.fn((pattern, replacement) => {
+  if (typeof pattern === 'string') {
+    return this.split(pattern).join(replacement);
+  }
+  return this;
+});
+
+// Mock FileReader
+class MockFileReader {
+  result: any = null;
+  error: any = null;
+  readyState: number = 0;
+  onload: ((this: FileReader, ev: ProgressEvent<FileReader>) => any) | null = null;
+  onerror: ((this: FileReader, ev: ProgressEvent<FileReader>) => any) | null = null;
+  onloadend: ((this: FileReader, ev: ProgressEvent<FileReader>) => any) | null = null;
+
+  readAsDataURL = jest.fn(() => {
+    this.readyState = 2;
+    this.result = 'data:image/png;base64,test';
+    setTimeout(() => {
+      if (this.onload) this.onload({} as ProgressEvent<FileReader>);
+      if (this.onloadend) this.onloadend({} as ProgressEvent<FileReader>);
+    }, 0);
+  });
+
+  readAsText = jest.fn(() => {
+    this.readyState = 2;
+    this.result = 'test content';
+    setTimeout(() => {
+      if (this.onload) this.onload({} as ProgressEvent<FileReader>);
+      if (this.onloadend) this.onloadend({} as ProgressEvent<FileReader>);
+    }, 0);
+  });
+
+  abort = jest.fn();
+  addEventListener = jest.fn();
+  removeEventListener = jest.fn();
+  dispatchEvent = jest.fn();
+}
+
+global.FileReader = MockFileReader as any;
+
+// Mock Blob
+global.Blob = jest.fn().mockImplementation(() => ({
+  size: 1024,
+  type: 'image/png',
+  slice: jest.fn(),
+  stream: jest.fn(),
+  text: jest.fn(() => Promise.resolve('mock text')),
+  arrayBuffer: jest.fn(() => Promise.resolve(new ArrayBuffer(8))),
+}));
+
+// Store original createElement
+const originalCreateElement = document.createElement;
+
+// Simple mock for specific elements only when needed
+document.createElement = jest.fn((tagName: string) => {
+  try {
+    return originalCreateElement.call(document, tagName);
+  } catch (e) {
+    // Fallback for special cases
+    const mockElement = {
+      tagName: tagName.toUpperCase(),
+      style: {},
+      className: '',
+      textContent: '',
+      innerHTML: '',
+      addEventListener: jest.fn(),
+      removeEventListener: jest.fn(),
+      dispatchEvent: jest.fn(),
+      setAttribute: jest.fn(),
+      getAttribute: jest.fn(),
+      removeAttribute: jest.fn(),
+      appendChild: jest.fn(),
+      removeChild: jest.fn(),
+      insertBefore: jest.fn(),
+      querySelector: jest.fn(),
+      querySelectorAll: jest.fn(() => []),
+      parentNode: null,
+      childNodes: [],
+      children: [],
+    };
+
+    // Add specific properties for different elements
+    if (tagName === 'canvas') {
+      Object.assign(mockElement, {
+        getContext: jest.fn(() => ({
+          drawImage: jest.fn(),
+          getImageData: jest.fn(),
+          putImageData: jest.fn(),
+          toDataURL: jest.fn(() => 'data:image/png;base64,test'),
+        })),
+        toDataURL: jest.fn(() => 'data:image/png;base64,test'),
+        width: 100,
+        height: 100,
+      });
+    } else if (tagName === 'a') {
+      Object.assign(mockElement, {
+        click: jest.fn(),
+        download: '',
+        href: '',
+      });
+    }
+
+    return mockElement as any;
+  }
+});
+
+// Store original methods
+const originalAppendChild = document.body.appendChild;
+const originalRemoveChild = document.body.removeChild;
+
+// Mock but still allow actual functionality for testing
+document.body.appendChild = jest.fn((node) => {
+  try {
+    // Check if node is a valid DOM element
+    if (node && typeof node === 'object' && node.nodeType !== undefined) {
+      return originalAppendChild.call(document.body, node);
+    }
+    // For non-DOM elements, just return the node
+    return node;
+  } catch (e) {
+    // If original fails, just return the node
+    return node;
+  }
+});
+
+document.body.removeChild = jest.fn((node) => {
+  try {
+    // Check if node is a valid DOM element
+    if (node && typeof node === 'object' && node.nodeType !== undefined) {
+      return originalRemoveChild.call(document.body, node);
+    }
+    // For non-DOM elements, just return the node
+    return node;
+  } catch (e) {
+    // If original fails, just return the node
+    return node;
+  }
+});
+
+// Mock getElementsByTagName to prevent ProIcon DOM access issues
+const originalGetElementsByTagName = document.getElementsByTagName;
+document.getElementsByTagName = jest.fn((tagName: string) => {
+  if (tagName === 'script') {
+    // Return empty collection for script tags to prevent ProIcon issues
+    return [];
+  }
+  try {
+    return originalGetElementsByTagName.call(document, tagName);
+  } catch (e) {
+    // Fallback for testing
+    return [];
+  }
+});
+
+// Mock ProIcon to prevent DOM manipulation
+jest.mock('../src/ProIcon', () => ({
+  __esModule: true,
+  default: jest.fn(() => null),
+  ProIcon: jest.fn(() => null),
+}));

package/tests/test-utils.tsx

@@ -0,0 +1,81 @@
+import React from 'react';
+import { render, RenderOptions } from '@testing-library/react';
+import { ConfigProvider } from 'antd';
+import zhCN from 'antd/locale/zh_CN';
+
+// 确保document.body存在
+const ensureDocumentSetup = () => {
+  if (typeof document !== 'undefined') {
+    if (!document.body) {
+      document.body = document.createElement('body');
+      document.documentElement.appendChild(document.body);
+    }
+    
+    // 创建一个测试容器
+    let testContainer = document.getElementById('test-container');
+    if (!testContainer) {
+      testContainer = document.createElement('div');
+      testContainer.id = 'test-container';
+      document.body.appendChild(testContainer);
+    }
+  }
+};
+
+// Mock ProConfigProvider
+const MockProConfigProvider = ({ children }: { children: React.ReactNode }) => {
+  const mockValue = {
+    state: {
+      ProTable: {},
+      ProForm: {},
+      ProEnum: {},
+      ProSelect: {},
+      storage: {},
+      theme: {},
+      locale: {},
+    },
+    setState: jest.fn(),
+  };
+
+  const MockContext = React.createContext(mockValue);
+  return React.createElement(MockContext.Provider, { value: mockValue }, children);
+};
+
+// Mock FieldProvider
+const MockFieldProvider = ({ children }: { children: React.ReactNode }) => {
+  const mockValue = {
+    readonly: false,
+    disabled: false,
+  };
+
+  const MockFieldContext = React.createContext(mockValue);
+  return React.createElement(MockFieldContext.Provider, { value: mockValue }, children);
+};
+
+// All providers wrapper
+const AllTheProviders = ({ children }: { children: React.ReactNode }) => {
+  ensureDocumentSetup();
+  
+  return (
+    <ConfigProvider locale={zhCN}>
+      <MockProConfigProvider>
+        <MockFieldProvider>
+          {children}
+        </MockFieldProvider>
+      </MockProConfigProvider>
+    </ConfigProvider>
+  );
+};
+
+const customRender = (ui: React.ReactElement, options?: Omit<RenderOptions, 'wrapper'>) => {
+  ensureDocumentSetup();
+  
+  return render(ui, { 
+    wrapper: AllTheProviders, 
+    container: document.getElementById('test-container') || document.body,
+    ...options 
+  });
+};
+
+export * from '@testing-library/react';
+export { customRender as render };
+export { AllTheProviders, ensureDocumentSetup };