mirror of
https://github.com/ant-design/ant-design.git
synced 2025-06-19 17:00:53 +08:00
1ac0bcaa60
Some checks are pending
Publish Any Commit / build (push) Waiting to run
✅ test v6 / lint (push) Waiting to run
✅ test v6 / test-react-legacy (18, 1/2) (push) Waiting to run
✅ test v6 / test-react-legacy (18, 2/2) (push) Waiting to run
✅ test v6 / test-node (push) Waiting to run
✅ test v6 / test-react-latest (dom, 1/2) (push) Waiting to run
✅ test v6 / test-react-latest (dom, 2/2) (push) Waiting to run
✅ test v6 / test-react-latest-dist (dist, 1/2) (push) Blocked by required conditions
✅ test v6 / test-react-latest-dist (dist, 2/2) (push) Blocked by required conditions
✅ test v6 / test-react-latest-dist (dist-min, 1/2) (push) Blocked by required conditions
✅ test v6 / test-react-latest-dist (dist-min, 2/2) (push) Blocked by required conditions
✅ test v6 / test-coverage (push) Blocked by required conditions
✅ test v6 / build (push) Waiting to run
✅ test v6 / test lib/es module (es, 1/2) (push) Waiting to run
✅ test v6 / test lib/es module (es, 2/2) (push) Waiting to run
✅ test v6 / test lib/es module (lib, 1/2) (push) Waiting to run
✅ test v6 / test lib/es module (lib, 2/2) (push) Waiting to run
👁️ Visual Regression Persist Start / test image (push) Waiting to run
* feat: use cssVar by default * chore: update deps * chore: update snapshot * chore: update snapshot * chore: update snapshot * chore: test * chore: update * chore: update scripts * chore: UPDATE TEST * feat: add root * chore: update snapshot * chore: fix test case * chore: fix cycle deps * feat: rm legacy css variables configuration * chore: update test case * chore: update * chore: fix test * chore: update overrides * chore: bump cssinjs * chore: add test case
92 lines
2.2 KiB
TypeScript
92 lines
2.2 KiB
TypeScript
import React from 'react';
|
|
|
|
import Layout from '..';
|
|
import { render } from '../../../tests/utils';
|
|
import ConfigProvider from '../../config-provider';
|
|
import Menu from '../../menu';
|
|
|
|
const { Header } = Layout;
|
|
|
|
describe('Layout.Token', () => {
|
|
it('legacy theme should work', () => {
|
|
const { container } = render(
|
|
<ConfigProvider
|
|
theme={{
|
|
components: {
|
|
Layout: {
|
|
colorBgHeader: '#FF0000',
|
|
},
|
|
Menu: {
|
|
// keep this deprecated one
|
|
colorItemBg: '#00FF00',
|
|
},
|
|
},
|
|
}}
|
|
>
|
|
<Layout>
|
|
<Header>
|
|
<Menu
|
|
mode="horizontal"
|
|
defaultSelectedKeys={['2']}
|
|
items={Array.from({ length: 15 }).map((_, index) => {
|
|
const key = index + 1;
|
|
return {
|
|
key,
|
|
label: `nav ${key}`,
|
|
};
|
|
})}
|
|
/>
|
|
</Header>
|
|
</Layout>
|
|
</ConfigProvider>,
|
|
);
|
|
|
|
expect(container.querySelector('.ant-layout')).toHaveStyle({
|
|
'--ant-layout-header-bg': '#FF0000',
|
|
});
|
|
expect(container.querySelector('.ant-menu')).toHaveStyle({
|
|
'--ant-menu-item-bg': '#00FF00',
|
|
});
|
|
});
|
|
|
|
it('theme should work', () => {
|
|
const { container } = render(
|
|
<ConfigProvider
|
|
theme={{
|
|
components: {
|
|
Layout: {
|
|
headerBg: '#FF0000',
|
|
},
|
|
Menu: {
|
|
itemBg: '#00FF00',
|
|
},
|
|
},
|
|
}}
|
|
>
|
|
<Layout>
|
|
<Header>
|
|
<Menu
|
|
mode="horizontal"
|
|
defaultSelectedKeys={['2']}
|
|
items={Array.from({ length: 15 }).map((_, index) => {
|
|
const key = index + 1;
|
|
return {
|
|
key,
|
|
label: `nav ${key}`,
|
|
};
|
|
})}
|
|
/>
|
|
</Header>
|
|
</Layout>
|
|
</ConfigProvider>,
|
|
);
|
|
|
|
expect(container.querySelector('.ant-layout')).toHaveStyle({
|
|
'--ant-layout-header-bg': '#FF0000',
|
|
});
|
|
expect(container.querySelector('.ant-menu')).toHaveStyle({
|
|
'--ant-menu-item-bg': '#00FF00',
|
|
});
|
|
});
|
|
});
|