Question

我在电子邮件字段上有一个on Blur，如果验证不正确，应该会在onBlur上引发错误。

function ParentComponent () {
.
.
.

    const [emailError, setError] = useState(null)

    const handleOnBlur = useCallback((target) => {
        setError(false)
        if (target.value && !target.checkValidity()) {
          setError(true)
          target.focus()
        }
      }, [setError])

return (
    <FormControl>
      <TextInputField value={emailValue} data-testid='emailField' error={emailError} type='email' length={100} onBlurAction={handleOnBlur} />
    </FormControl>
.
.
)
}

export default ParentComponent

我正在用酶开玩笑

const mockSetEmailError = jest.fn()

  jest.mock('setError', () => ({
    __esModule: true,
    useState: () => ({ setError: mockSetEmailError, emailError: false })
  }))

然后我渲染组件并尝试在Blur上进行测试

function wrapper (state) {
    mockStore = configureMockStore([thunk])(state)
    return (
      <Provider store={mockStore}>
        <ParentComponent />
      </Provider>
    )
  }

it('calls setEmailError on Email Blur', () => {
    const { getByTestId } = render(wrapper(mutateSampleState(state => {
      state.loading['page'] = 'done'
    })))
    fireEvent.blur(getByTestId('emailField'))
    expect(mockSetEmailError).toHaveBeenCalledTimes(1)
  })

我不断收到›遇到声明异常。最好的测试方法是什么？

Jest Enzyme测试onBlur不支持模拟

0 个答案: