Strato 组件测试

此软件包包含测试助手 @dynatrace/strato-components 软件包.

欢乐

配置

此测试软件包包含一个会配置 jest 的预设, 以配合 @dynatrace/strato-components 软件包。 您可以在您的预设中添加 jest.config.js 这样的文件 :

const {
  stratoPreset,
} = require('@dynatrace/strato-components-testing/jest/preset');

/** @type {import('jest').Config} */
module.exports = {
  ...stratoPreset,
  // your config
  ...
  // your per test setup
  setupFilesAfterEnv: [
    '@dynatrace/strato-components-testing/jest/setup',
  // your per test setup
    "./jest.setup-env.ts"
  ],
  moduleNameMapper: {
    ...stratoPreset.moduleNameMapper,
    // your other moduleNameMappers
  },
};

设置

设置在 @dynatrace/strato-components-testing/jest/setup,您在上面配置的.

但你也可以设置或清除个人的模拟:

import {
  setupScreenSizeMock,
  clearScreenSizeMock,
} from '@dynatrace/strato-components-testing/jest';

// use where needed

测试助手

此包还包含测试助手.

测试帮助者是什么?

测试助手是帮助您在测试中选择和与组件交互的功能,所以您不必依赖组件的多姆,比如 role, (中文(简体) ), label,或 test-id。 。 。 .

使用量

请注意,这个测试包还没有帮助者. 一旦有帮手,你就会像这样使用他们:

import {
  render,
  getTextInputHelper,
} from '@dynatrace/strato-components-testing/jest';
import { TextInput } from '@dynatrace/strato-components/forms';

it('test', async () => {
  render(
    <TextInput
      aria-label="test input"
      data-testid="text-input-test"
      placeholder="Test input"
    />,
  );

  await getTextInputHelper('text-input-test').type('abc');
  expect(getTextInputHelper('text-input-test').value).toEqual('abc');
});

测试钩

renderHook 将钩子装入相同的提供者 render (单位:千美元)IntlProvider 与 locale="en" 财务报告和审定财务报表 timeZone="UTC" (默认)和接受相同的 locale, (中文(简体) ), timeZone,以及 wrapper 选项。 这两份文件都提供了 jest 财务报告和审定财务报表 vitest 进入点.

import { renderHook } from '@dynatrace/strato-components-testing/jest';

it('formats with the active locale', () => {
  const { result } = renderHook(() => useMyHook(), { locale: 'de' });
  expect(result.current).toEqual('1,5');
});