Cannot find module '@testing-library/jest-dom/extend-expect'エラーが出る

はじめに

Jestを設定していたときにChatGPTに頼っていたところうまく行かなかったのでまとめます

問題

以下のテストを書いたところエラーが出ました

page.test.tsx

import React from "react";
import { render, screen } from "@testing-library/react";
import "@testing-library/dom";
import { About } from "../page";

describe("About", () => {
  it("Aboutというタイトルがあること", () => {
    render(About());
    const aboutImage = screen.getByTestId("about-image").querySelector("img");
    expect(aboutImage!).toBeInTheDocument();
  });
});

 Cannot find module '@testing-library/jest-dom/extend-expect' 

解決方法

そもそも最新の@testing-library/jest-domでは、extend-expectのインポートは不要になりました

なので以下をインポートするだけでうまく動くようになりました

page.test.tsx

import '@testing-library/jest-dom';

おわりに

ChatGPTに頼りすぎると思わぬところで沼ってしまうことがよくわかりました
ある程度のところでネットで調べたり、聞き方を変えてみたりしないといけないです