react-challengers / Codefolio

부트캠프 수강생들이 작업한 프로젝트를 체계적으로 정리하여 채용과 연계할 수 있는 포트폴리오 공유 서비스
https://code-folio.vercel.app/
1 stars 2 forks source link

(진행 보류) Jest & RTL 설치와 설정 #401

Closed arch-spatula closed 1 year ago

arch-spatula commented 1 year ago
chore/jest-rtl
git checkout -b "chore/jest-rtl"

https://nextjs.org/docs/testing


https://www.youtube.com/watch?v=mJn0B7mXmDI

https://www.youtube.com/watch?v=yPBtVxDEC0w&t=273s

arch-spatula commented 1 year ago
yarn add jest jest-environment-jsdom @testing-library/react @testing-library/jest-dom --dev
"devDependencies": {
    "@testing-library/jest-dom": "5.16.4",
    "@testing-library/react": "14.0.0",
    "@testing-library/user-event": "14.4.3",
    "@types/react": "18.0.28",
    "@types/testing-library__jest-dom": "5.14.5",
    "jest": "29.5.0",
    "jest-environment-jsdom": "29.5.0",
    "typescript": "4.9.5"
  }
arch-spatula commented 1 year ago
import { render, screen } from "@testing-library/react";
import PrimaryButton from "./PrimaryButton";
import { ThemeProvider } from "styled-components";
import theme from "../../styles/theme";
// import theme from "@/styles/theme";
import "@testing-library/jest-dom";

describe("????", () => {
  test("!!!!", () => {
    const text = "hello world";
    render(
      <ThemeProvider theme={theme}>
        <PrimaryButton
          buttonType="default"
          size="m"
          text={text}
          onClick={() => {}}
        />
      </ThemeProvider>
    );
    const textElement = screen.getByText(text);
    expect(textElement).toBeInTheDocument();
  });
});
// jest.config.mjs
import nextJest from "next/jest.js";
/
const createJestConfig = nextJest({
  // Provide the path to your Next.js app to load next.config.js and .env files in your test environment
  dir: "./",
});

// Add any custom config to be passed to Jest
/** @type {import('jest').Config} */
const config = {
  // Add more setup options before each test is run
  setupFilesAfterEnv: ["<rootDir>/jest.setup.js", "jest-styled-components"],
  testEnvironment: "jest-environment-jsdom",
  moduleNameMapper: {
    "^@/components/(.*)$": "<rootDir>/components/$1",
  },
};

// createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async
export default createJestConfig(config);
// jest.setup.js
import "@testing-library/jest-dom/extend-expect";
arch-spatula commented 1 year ago

rust 컴파일러를 활용할 수 없습니다.