1

我正在尝试使用我的所有故事添加快照storybook v5.0.5并对react-testing-library v6.0.3 我的所有故事进行结构测试。

我正在尝试遵循文档:

https://github.com/infinitered/addon-storyshots/blob/master/README.md#serializer

但不是酶,而是使用react-testing-library.

含酶:

import initStoryshots from '@storybook/addon-storyshots';
import toJSON from 'enzyme-to-json';

initStoryshots({
  renderer: mount,
  serializer: toJSON,
  framework: 'react',
  storyRegex: /.*\.stories\.js/,
});

react-testing-library(我正在尝试做的事情):

import initStoryshots from '@storybook/addon-storyshots'
import { render } from 'react-testing-library'

initStoryshots({
  renderer: render,
  framework: 'react',
  storyRegex: /.*\.stories\.js/,
})

我不确定,该render方法是Storyshot api 需要的渲染器。并且还需要一个序列化程序,但我在react-testing-library.

使用这些配置,正在创建快照。然而,这些快照根本不正确......

看起来节点没有属性,而是显示了很多无用的属性......

创建快照示例:

exports[`Storyshots Components.Accordion with a custom button 1`] = `
Object {
  "asFragment": [Function],
  "baseElement": <body>
    <div />
    <div>
    </div>
  </body>,
  "container": <div>
  </div>,
  "debug": [Function],
  "findAllByAltText": [Function],
  "findAllByDisplayValue": [Function],
  "findAllByLabelText": [Function],
  "findAllByPlaceholderText": [Function],
  "findAllByRole": [Function],
  "findAllByTestId": [Function],
  "findAllByText": [Function],
  "findAllByTitle": [Function],
  "findByAltText": [Function],
  "findByDisplayValue": [Function],
  "findByLabelText": [Function],
  "findByPlaceholderText": [Function],
  "findByRole": [Function],
  "findByTestId": [Function],
  "findByText": [Function],
  "findByTitle": [Function],
  "getAllByAltText": [Function],
  "getAllByDisplayValue": [Function],
  "getAllByLabelText": [Function],
  "getAllByPlaceholderText": [Function],
  "getAllByRole": [Function],
  "getAllBySelectText": [Function],
  "getAllByTestId": [Function],
  "getAllByText": [Function],
  "getAllByTitle": [Function],
  "getAllByValue": [Function],
  "getByAltText": [Function],
  "getByDisplayValue": [Function],
  "getByLabelText": [Function],
  "getByPlaceholderText": [Function],
  "getByRole": [Function],
  "getBySelectText": [Function],
  "getByTestId": [Function],
  "getByText": [Function],
  "getByTitle": [Function],
  "getByValue": [Function],
  "queryAllByAltText": [Function],
  "queryAllByDisplayValue": [Function],
  "queryAllByLabelText": [Function],
  "queryAllByPlaceholderText": [Function],
  "queryAllByRole": [Function],
  "queryAllBySelectText": [Function],
  "queryAllByTestId": [Function],
  "queryAllByText": [Function],
  "queryAllByTitle": [Function],
  "queryAllByValue": [Function],
  "queryByAltText": [Function],
  "queryByDisplayValue": [Function],
  "queryByLabelText": [Function],
  "queryByPlaceholderText": [Function],
  "queryByRole": [Function],
  "queryBySelectText": [Function],
  "queryByTestId": [Function],
  "queryByText": [Function],
  "queryByTitle": [Function],
  "queryByValue": [Function],
  "rerender": [Function],
  "unmount": [Function],
}
`;

有人可以帮我吗?如果我不提供renderer配置,快照是空的......但是,看起来这个渲染器中缺少一些东西......

太感谢了!

4

0 回答 0