Skip to content

Commit

Permalink
test: add genStyleUtils test
Browse files Browse the repository at this point in the history
  • Loading branch information
YumoImer committed Jul 15, 2024
1 parent caf065a commit 71705e5
Show file tree
Hide file tree
Showing 6 changed files with 89 additions and 2 deletions.
3 changes: 2 additions & 1 deletion jest.config.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
module.exports = {
setupFiles: ['./tests/setup.js'],
testEnvironment: 'jsdom',
setupFiles: ['./tests/setup.ts'],
};
File renamed without changes.
2 changes: 1 addition & 1 deletion src/util/genStyleUtils.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -390,7 +390,7 @@ export default function genStyleUtils<
const defaultComponentToken = getDefaultComponentToken<
CompTokenMap,
C
>(component, realToken, getDefaultToken);
>(component, realToken, getDefaultToken) ?? {};

const componentCls = `.${prefixCls}`;
const componentToken = getComponentToken<CompTokenMap, C>(
Expand Down
85 changes: 85 additions & 0 deletions tests/genStyleUtils.test.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,85 @@
import React from 'react';
import { render, renderHook } from '@testing-library/react';

import { genStyleUtils } from '../src'
import type { CSSVarRegisterProps, SubStyleComponentProps } from '../src/util/genStyleUtils';

describe('genStyleUtils', () => {
const mockConfig = {
usePrefix: jest.fn().mockReturnValue({
rootPrefixCls: 'ant',
iconPrefixCls: 'anticon',
}),
useToken: jest.fn().mockReturnValue({
theme: {},
realToken: {},
hashId: 'hash',
token: {},
cssVar: {},
}),
useCSP: jest.fn().mockReturnValue({ nonce: 'nonce' }),
getResetStyles: jest.fn().mockReturnValue([]),
};

const { genStyleHooks, genSubStyleComponent, genComponentStyleHook } = genStyleUtils(mockConfig);

describe('genStyleHooks', () => {
it('should generate style hooks', () => {
const component = 'TestComponent';
const styleFn = jest.fn();
const getDefaultToken = jest.fn();
const hooks = genStyleHooks(component, styleFn, getDefaultToken);

expect(hooks).toBeInstanceOf(Function);

const {
result: { current }
} = renderHook(() => hooks('test-prefix'));
expect(current).toBeInstanceOf(Array);
expect(current).toHaveLength(3);
});
});

describe('genSubStyleComponent', () => {
it('should generate sub style component', () => {
const component = 'TestComponent';
const styleFn = jest.fn();
const getDefaultToken = jest.fn();
const StyledComponent = genSubStyleComponent(component, styleFn, getDefaultToken);

const { container } = render(<StyledComponent prefixCls="test-prefix" rootCls="test-root" />);
expect(container).toBeEmptyDOMElement();
});
});

describe('genComponentStyleHook', () => {
it('should generate component style hook', () => {
const component = 'TestComponent';
const styleFn = jest.fn();
const getDefaultToken = jest.fn();
const hook = genComponentStyleHook(component, styleFn, getDefaultToken);

const TestComponent: React.FC<SubStyleComponentProps> = ({ prefixCls, rootCls }) => {
hook(prefixCls, rootCls);
return <div data-testid="test-component">Test</div>;
};

const { getByTestId } = render(<TestComponent prefixCls="test-prefix" rootCls="test-root" />);
expect(getByTestId('test-component')).toHaveTextContent('Test');
});
});

describe('CSSVarRegister', () => {
it('should render CSSVarRegister component', () => {
const CSSVarRegister: React.FC<CSSVarRegisterProps> = ({
rootCls,
cssVar = {},
}) => {
return <div data-testid={rootCls}>{cssVar.prefix}</div>;
};

const { getByTestId } = render(<CSSVarRegister rootCls="test-root" cssVar={{ prefix: 'test-prefix' }} component="test" />);
expect(getByTestId('test-root')).toHaveTextContent('test-prefix');
});
});
});
File renamed without changes.
1 change: 1 addition & 0 deletions tests/setupAfterEnv.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
import '@testing-library/jest-dom';

0 comments on commit 71705e5

Please sign in to comment.