Напишите тестовый код для обновления кнопки с помощью Enzyme - PullRequest
0 голосов
/ 12 февраля 2020

Я написал тестовый код «Кнопка обновления» для фермента. Есть 2 компонента, TextField и Button, и кнопка должна быть отключена, если значение TextField пусто, и должна быть включена, если значение TextField не пустое.

export default () => {
  const classes = useStyles();

  const [ disabledSave, setDisabledSave ] = useState(true);

  const handleChangeInput = (e) => {
    if (e.target.value === "") {
      setDisabledSave(true)
    } else {
      setDisabledSave(false);
    }
  };

  return (
    <PageContainer>
      <form className={classes.root} noValidate autoComplete="off">
        <TextField
          label="Input text here..."
          onChange={handleChangeInput}
        />
        <Button 
          variant="contained"
          size="medium"
          color="primary"
          disabled={disabledSave}
        >
          Submit
        </Button>
      </form>
    </PageContainer>
  );
};

А ниже код проверяет код

let onChange;

  beforeAll(() => {
    onChange = jest.fn();
  });

 it('should change state correctly call onChange', () => {
    const component = shallow(<Demo />);
    const textField = component.find(TextField);
    const button = component.find(Button);
    textField.simulate('change', { target: { value: 'test' } });
    component.update();
    expect(button.find('[disabled=true]')).toHaveLength(0);
  });

Не могли бы вы сказать мне, где я ошибся?

Код ошибки

FAIL  src/pages/Demo/Demo.test.jsx   ● Demo › should change state correctly call onChange

    expect(received).toHaveLength(expected)

    Expected length: 0
    Received length: 1
    Received object: {}

      54 |     textField.simulate('change', { target: { value: 'test' } });
      55 |     component.update();
    > 56 |     expect(button.find('[disabled=true]')).toHaveLength(0);
         |                                            ^
      57 |   });
      58 | });
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...