test: simplify rtlTest test case (#40878)

This commit is contained in:
lijianan 2023-02-22 19:49:06 +08:00 committed by GitHub
parent 288b10bd10
commit be25ee2a0b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 57 additions and 69 deletions

View File

@ -1,9 +1,9 @@
import MockDate from 'mockdate';
import Dayjs from 'dayjs';
import 'dayjs/locale/zh-cn';
import MockDate from 'mockdate';
import { type PickerPanelProps } from 'rc-picker';
import dayjsGenerateConfig from 'rc-picker/lib/generate/dayjs';
import type { Locale } from 'rc-picker/lib/interface';
import { type PickerPanelProps } from 'rc-picker';
import React from 'react';
import Calendar from '..';
import mountTest from '../../../tests/shared/mountTest';
@ -42,7 +42,7 @@ jest.mock('rc-picker', () => {
describe('Calendar', () => {
mountTest(Calendar);
rtlTest(Calendar, { mockDate: true });
rtlTest(Calendar, true);
function openSelect(wrapper: HTMLElement, className: string) {
fireEvent.mouseDown(wrapper.querySelector(className)!.querySelector('.ant-select-selector')!);

View File

@ -329,64 +329,58 @@ exports[`Menu all types must be available in the "items" syntax 1`] = `
`;
exports[`Menu rtl render component should be rendered correctly in RTL direction 1`] = `
HTMLCollection [
<ul
class="ant-menu ant-menu-root ant-menu-vertical ant-menu-light ant-menu-rtl"
data-menu-list="true"
dir="rtl"
role="menu"
tabindex="0"
<ul
class="ant-menu ant-menu-root ant-menu-vertical ant-menu-light ant-menu-rtl"
data-menu-list="true"
dir="rtl"
role="menu"
tabindex="0"
>
<li
class="ant-menu-item"
data-menu-id="rc-menu-uuid-test-tmp_key-0"
role="menuitem"
tabindex="-1"
>
<li
class="ant-menu-item"
data-menu-id="rc-menu-uuid-test-tmp_key-0"
<span
class="ant-menu-title-content"
/>
</li>
<li
class="ant-menu-item-group"
role="presentation"
>
<div
class="ant-menu-item-group-title"
role="presentation"
/>
<ul
class="ant-menu-item-group-list"
role="group"
/>
</li>
<li
class="ant-menu-submenu ant-menu-submenu-vertical"
role="none"
>
<div
aria-controls="rc-menu-uuid-test-tmp_key-2-popup"
aria-expanded="false"
aria-haspopup="true"
class="ant-menu-submenu-title"
data-menu-id="rc-menu-uuid-test-tmp_key-2"
role="menuitem"
tabindex="-1"
>
<span
class="ant-menu-title-content"
/>
</li>
<li
class="ant-menu-item-group"
role="presentation"
>
<div
class="ant-menu-item-group-title"
role="presentation"
<i
class="ant-menu-submenu-arrow"
/>
<ul
class="ant-menu-item-group-list"
role="group"
/>
</li>
<li
class="ant-menu-submenu ant-menu-submenu-vertical"
role="none"
>
<div
aria-controls="rc-menu-uuid-test-tmp_key-2-popup"
aria-expanded="false"
aria-haspopup="true"
class="ant-menu-submenu-title"
data-menu-id="rc-menu-uuid-test-tmp_key-2"
role="menuitem"
tabindex="-1"
>
<span
class="ant-menu-title-content"
/>
<i
class="ant-menu-submenu-arrow"
/>
</div>
</li>
</ul>,
<div
aria-hidden="true"
style="display: none;"
/>,
]
</div>
</li>
</ul>
`;
exports[`Menu should controlled collapse work 1`] = `

View File

@ -5,12 +5,12 @@ import {
PieChartOutlined,
UserOutlined,
} from '@ant-design/icons';
import React, { useState, useMemo } from 'react';
import React, { useMemo, useState } from 'react';
import type { MenuProps, MenuRef } from '..';
import Menu from '..';
import mountTest from '../../../tests/shared/mountTest';
import rtlTest from '../../../tests/shared/rtlTest';
import { fireEvent, render, act } from '../../../tests/utils';
import { act, fireEvent, render } from '../../../tests/utils';
import Layout from '../../layout';
import initCollapseMotion from '../../_util/motion';
import { noop } from '../../_util/warning';
@ -133,7 +133,7 @@ describe('Menu', () => {
</Menu>
);
rtlTest(RtlDemo, { componentName: 'menu' });
rtlTest(RtlDemo);
let div: HTMLDivElement;

View File

@ -1,18 +1,12 @@
import React from 'react';
import dayjs from 'dayjs';
import MockDate from 'mockdate';
import { render } from '../utils';
import React from 'react';
import ConfigProvider from '../../components/config-provider';
import { render } from '../utils';
interface TestOptions {
mockDate?: boolean;
componentName?: string;
}
function rtlTest(Component: React.ComponentType, { mockDate, componentName }: TestOptions = {}) {
describe(`rtl render`, () => {
it(`component should be rendered correctly in RTL direction`, () => {
const isArray = componentName && ['menu'].includes(componentName);
const rtlTest = (Component: React.ComponentType, mockDate = false) => {
describe('rtl render', () => {
it('component should be rendered correctly in RTL direction', () => {
if (mockDate) {
MockDate.set(dayjs('2000-09-28').valueOf());
}
@ -21,13 +15,13 @@ function rtlTest(Component: React.ComponentType, { mockDate, componentName }: Te
<Component />
</ConfigProvider>,
);
expect(isArray ? container.children : container.firstChild).toMatchSnapshot();
expect(container.firstChild).toMatchSnapshot();
if (mockDate) {
MockDate.reset();
}
});
});
}
};
// eslint-disable-next-line jest/no-export
export default rtlTest;