Как сделать снимок для проверки случайных ключей карты на компонентах React с помощью jest - PullRequest
Новая
       38

Как сделать снимок для проверки случайных ключей карты на компонентах React с помощью jest

0 голосов
/ 08 февраля 2019

У меня есть компонент React, его код выглядит следующим образом: 

const TakeADecision = ({
  decisions,
  decisionTaken,
  preDecisionsSection,
  takeDecision,
  title,
  titlePrefix,
}) => (

  <div className="take-a-decision">

    <Title text={title} prefix={titlePrefix} />

    { preDecisionsSection }

    <SelectionButtonGroup>
      {
        decisions.map((decisionItem, i) => (
          <SelectionButton
            selected={decisionItem.statusCode === decisionTaken}
            action={takeDecision}
            key={shortId.generate()}
            index={i}
            alt={decisionItem.label}
          >
            {decisionItem.label}
          </SelectionButton>
        ))
      }

    </SelectionButtonGroup>
  </div>
);

Мне нужно сделать снимок, чтобы протестировать этот компонент с мелкими и энзимными в json.Тест выглядит следующим образом: 

  const props = {
    title: 'This is the title',
    titlePrefix: '0',
    preDecisionsSection: 'This should be the preDecisionsSection',
    decisions: [
      { label: 'One', statusCode: 'one' },
      { label: 'Two', statusCode: 'two' },
    ],
    choice: 'This is the choice text',
    decisionTaken: 'one',
    takeDecision: jest.fn(),
  }

  it('renders correctly based on the given decisions', () => {
    const wrapper = shallow(<TakeDecisionStep {...props} />);
    expect(toJson(wrapper)).toMatchSnapshot();
  });

В результате получается снимок, подобный следующему: 

exports[`TakeDecisionStep component renders correctly based on the given decisions 1`] = `
<div
  className="take-decision-step"
>
  <Title
    prefix="0"
    text="This is the title"
  />
  This should be the preDecisionsSection
  <Connect(SelectionButtonGroup)>
    <SelectionButton
      action={[Function]}
      alt="One"
      image=""
      index={0}
      key="MKSGeZOIs"
      selected={true}
    >
      One
    </SelectionButton>
    <SelectionButton
      action={[Function]}
      alt="Two"
      image=""
      index={1}
      key="fFzPmlHg9m"
      selected={false}
    >
      Two
    </SelectionButton>
  </Connect(SelectionButtonGroup)>
</div>
`;

Как видите, он генерирует случайный ключ для каждого элемента.Проблема в том, что, если я снова запустите эти тесты, он потерпит крах, так как он сгенерирует случайный ключ, снова отличный от того, который у меня уже был.Как вы, ребята, имеете дело с такими случаями?

Спасибо!

1 Ответ

0 голосов
/ 08 февраля 2019

Когда вы тестируете, дайте генератору shortId начальное число.

shortId.seed(1)

Случайные движки должны выплевывать то же самое, если вы начнете его первым.

https://github.com/dylang/shortid#shortidseedinteger

...