Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

225
Visualizações
Formik test returning "You seem to have overlapping act() calls, this is not supported"

I have a simple form im trying to test:

Form:

<Formik
    enableReinitialize
    onSubmit={(values, actions) => {
        console.log('---DEBUG---');
        onSubmit(values, actions);
    }}
    validationSchema={ValidationSchema}
    >
        {(formik) => {
            const { errors } = formik;

            return (
                <Form noValidate autoComplete="off">
                    {/* USER PICKER */}
                    <FastField
                        id="name"
                        name="name"
                        type="text"
                        onChange={({ event, value }) => {
                            handleChange(event);
                            setUserIdOrName(value);
                        }}
                        value={values.name}
                        errorMessage={
                        !!errors.name && !!touched.name
                            ? errors.name
                            : ''
                        }
                        as={TextField}
                    />
                    {/* SUBMIT BUTTON */}
                    <Button
                        color="red"
                        type="submit"
                        onClick={() => { console.log('-----CLICKED----'); }}
                    />
                </Form>
            );
        }}
</Formik>

Test:

  it.only('shows required error messages', async () => {
    render(<MyForm />);

    const button = screen.getByRole('button');
    userEvent.click(button);

    // Formik and Yup validation are async methods
    const required = await screen.findByText(/required/i);
    expect(required).toBeInTheDocument();
  });

Error:

console.error Warning: You seem to have overlapping act() calls, this is not supported. Be sure to await previous act() calls before making a new one.

TestingLibraryElementError: Unable to find an element with the text: /required/i. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.
about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

Try with:

it.only('shows required error messages', async () => {
    render(<MyForm />);

    const button = screen.getByRole('button');
    await userEvent.click(button);

    // Formik and Yup validation are async methods
    const required = await screen.findByText(/required/i);
    expect(required).toBeInTheDocument();
  });
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda