Невозможно протестировать стили для смоделированных событий, таких как: focus - PullRequest
Новая
       25

Невозможно протестировать стили для смоделированных событий, таких как: focus

0 голосов
/ 07 мая 2020

Я использую styled-components, enzyme и jest-styled-components для тестирования своих компонентов. Это работает нормально, но я застрял, когда дело доходит до тестирования таких вещей, как :focus, при моделировании события с помощью .simulate('focus') ожидаемые стили не установлены. Я пробовал использовать mount вместо shallow, а также пытался использовать input.update() после моделирования, но безуспешно. Также, похоже, не может найти никаких связанных с этим проблем на github.

Простое воспроизведение: 

const Input = styled.input`
  color: purple;

  &:focus {
    color: pink;
  }
`;

describe('Input', () => {

  const input = shallow(<Input></Input>);

  input.simulate('focus');

  expect(input).toHaveStyleRule('color', 'pink');
});

Тест не проходит с: 

"Value mismatch for property 'color'"

Expected
  "color: pink"
Received:
  "color: purple"

Версии: 

"react": "16.3.1"
"enzyme": "3.10.5",
"styled-components": "5.1.0",
"jest-styled-components": "7.0.2"

Что я здесь делаю не так?

...