Тестирование ввода формы в jest и энзиме - PullRequest
Новая
       4

Тестирование ввода формы в jest и энзиме

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

Я работал с тестами в React, и у меня проблемы с тестированием входных данных формы.

Компонент FormInput в регистре 

 <FormInput
          data-test="form-input"
          className={`${errors.username && "input-error"}`}
          name="username"
          type="text"
          ariaLabel="Username" placeholder="Username"
          value={values.username}
          onChange={handleChange}
          onBlur={handleBlur}
          icon={
            <FaUser size={"3rem"} color={theme.colors.formInputBorderColor} />
          }
        />

Это компонент FormInput 

export const FormInput = React.memo(({name,type,placeholder,value,onChange,onBlur,icon,className,ariaLabel}) => {

  return (
      <>
      <Input className={className} name={name} type={type} placeholder={placeholder} value={value} onChange={onChange} onBlur={onBlur} aria-label={ariaLabel}/>
      {icon}

      </>
  )
})

Тестовые строки тоже такие. У меня есть 3 FormInput в регистре, поэтому я использовал "at (0)" 

it("Testing input events",() => {

      const component = wrapper.find("input").at(0);
      console.log(component.debug())
       //for selecting one input
       component.simulate("change",{
        target:{value:"username"}
       })

       expect(component.props().value).toEqual("username")
    })

И результат: 

 Expected: "username"
    Received: ""

      54 |        })
      55 | 
    > 56 |        expect(component.props().value).toEqual("username")
         |                                        ^
      57 |     })
      58 |     it("Should render one form", () => {
      59 |       const component = findByTestAtrr(wrapper, "form");

Что именно мне делать? Спасибо

...