Início / coding / Perguntas / 79237164
Accepted
Riphale
Asked: 2024-11-29 20:50:54 +0800 CST

ReferenceError: o documento não está definido no Jest ao testar o componente React em um projeto Next.js

  • 772

Estou tentando escrever um teste unitário para um componente React no meu projeto Next.js usando Jest e React Testing Library. No entanto, estou encontrando o seguinte erro ao executar o teste:

`Testando o componente Home › renderiza um título

The error below may be caused by using the wrong test environment, see https://jestjs.io/docs/configuration#testenvironment-string.
Consider using the "jsdom" test environment.

ReferenceError: document is not defined`

Aqui está meu código de teste:

Início.teste.tsx

import { render, screen } from "@testing-library/react";
import Home from "./Home"; // Adjust based on your file structure

describe("Testing Home Component", () => {
  it("renders a heading", () => {
    render(<Home />);
    const text = screen.getByText(/Home/i);
    expect(text).toBeInTheDocument();
  });
});

Início.tsx

'use client'

import React from 'react'

const Home = () => {
  return (
    <div>
      Home
    </div>
  )
}

export default Home

Tentei executar um teste Jest para um componente React em um projeto Next.js usando @testing-library/react. O teste renderiza o componente Home e verifica se um título contendo o texto "Home" está presente no documento.

Aqui está o teste que usei:

import { render, screen } from "@testing-library/react";
import Home from "./Home"; // Adjust based on your file structure

describe("Testing Home Component", () => {
  it("renders a heading", () => {
    render(<Home />);
    const text = screen.getByText(/Home/i);
    expect(text).toBeInTheDocument();
  });
});

Eu esperava que o teste passasse com sucesso, o que significa que o componente Home seria renderizado, e o título com o texto "Home" seria encontrado no documento. No entanto, encontrei o seguinte erro:

ReferenceError: document is not defined

next.js

6 respostas

  1. Best Answer
    • 4

  2. O mesmo aqui. Isso deve ser algo relacionado ao Jest ou algo assim, nada relacionado ao código-fonte em si...

    Ontem, todos os meus pipelines foram executados com sucesso e hoje o mesmo código está apresentando esse problema.

    • 1

  3. Também estou tendo o mesmo problema. Tentei congelar versões antigas das minhas dependências (incluindo next) e executar testes novamente - mesmo erro.

    Concordo com a opinião de Alberto - esse não é o problema com a base de código, mas com a dependência externa. Mas não consigo descobrir qual exatamente. O Jest e todos os pacotes relacionados a ele foram lançados há pelo menos alguns dias, então eles não devem quebrar tudo só hoje.

    Talvez seja o problema com o Next. A princípio pensei que fosse o transformador personalizado do Next para testes escritos em Typescript, que depende do compilador SWC:

    próximo/dist/build/swc/jest-transformer.js

    No entanto, ele não foi atualizado por alguns meses e parece funcionar bem. Também uso o Next 14, então nem é o último lançamento principal. Então, verifiquei essas bibliotecas também

    • O JSDom, que cria uma abstração DOM para esses testes, foi publicado pela última vez há 2 meses.
    • @testing-library/jest-dom foi publicado pela última vez há meses
    • @testing-library/react foi publicado há 3 meses
    • O próprio Jest foi publicado há 4 meses

    Meu palpite é que uma dependência de qualquer uma dessas bibliotecas é o problema. Por enquanto, eu apenas desabilitei os testes do React para preservar os pipelines de CI

    • 1

  4. Se você reconstruir seu package-lock.json, tudo estará bem agora. A dependência do pacote ofensivo (nwsapi) já foi atualizada.

    • 0

  5. Este é o link para o problema oficial com uma possível solução temporária: forçar o nwsapi para a versão 2.2.13

    https://github.com/dperini/nwsapi/issues/135

    • 0

  6. O problema parece estar resolvido agora, com a atualização do nwsapi para a versão 2.2.16

    • 0

relate perguntas