Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

[Bug] Erro no mock lista de participantes toHaveLength(participantes.length)

erro apresentado no test

segue meu codigo:

import { render, screen } from "@testing-library/react"
import { RecoilRoot } from "recoil"
import ListaParticipantes from './ListaParticipantes';
import { useListaParticipantes } from "../state/hook/useListaParticipantes";

jest.mock('../state/hook/useListaParticipantes', () => {
    return {
        useListaParticipantes: jest.fn()
    }
})

describe('uma lista de participantes vazia', () => {
    beforeEach(() => {
        (useListaParticipantes as jest.Mock).mockReturnValue([])
    })
    test('deve ser renderizada sem elementos', () => {
            render(<RecoilRoot>
                <ListaParticipantes />
            </RecoilRoot>)

            const itens = screen.queryAllByRole('listitem')
            expect(itens).toHaveLength(0)
        }
    )
})

describe('uma lista de participantes preenchida', () => {
    const participantes = ['Isabela', 'Angélica']

    beforeEach(() => {
        (useListaParticipantes as jest.Mock).mockReturnValue(participantes)
    })
    test('deve ser renderizada com elementos', () => {
            render(<RecoilRoot>
                <ListaParticipantes />
            </RecoilRoot>)

            const itens = screen.queryAllByRole('listitem')
            expect(itens).toHaveLength(participantes.length)
        }
    )
})
3 respostas

Oi Isabela, tudo certo?

Uma possível solução para esse problema é verificar se você está importando corretamente o método toHaveLength do Jest. Certifique-se de que você está importando o toHaveLength corretamente.

Ademais, pode compartilhar o código do seu useListaDeParticipantes.ts? Pode ser alguma coisa lá.

Se conseguir compartilhar seu projeto no Github consigo te ajudar mais!

Bons estudos

Oi Gabriel tudo bem? Então realmente é algo q me intrigou pois os demais testes que precisei de mock passaram, sobre ser com o toHaveLength eu não sei viu porque a função de cima "uma lista de participantes vazia" passa e ela usa o mesmo método me parece que ele nao reconhece o participantes.length mas é mt estranho, segue o projeto no github para você dar uma olhada:

https://github.com/IsabelaAquino/test-jest-alura

Desde já agradeço!

solução!

[RESOLVIDO] Voltando para dizer que resolvi o erro estava no listaParticipante.tsx no array map: onde era participantes.map((participante) => { option.... }) na verdade deveria ser: com () no lugar das {}

Insira aqui a descrição dessa imagem para ajudar na acessibilidade