Jest vscode Snippet 만들기

vscode 스니펫 추가

F1 키 또는 ⌘ + ⇧ + P (윈도우는 Ctrl + Shift + P) 를 누르고  Snippet 검색

Snippet : Configure User Snippet 클릭.

아래 처럼 어떤 언어에 대한 스니펫을 추가할지 파일이 나옴

원하는 파일형식을 지정 

 

typescirptreact.json 을 선택하고

 

"/ComponentTest": {
  "prefix": "/ComponentTest",
  "body": [
    "// 필요한 모듈 임포트",
    "import React from 'react';",
    "import { render, screen } from '@testing-library/react';",
    "import '@testing-library/jest-dom/extend-expect';",
    "import MyComponent from '@/path/to/MyComponent';",
    "",
    "describe('MyComponent', () => {",
    "  // 기본 렌더링 테스트",
    "  test('renders MyComponent', () => {",
    "    render(<MyComponent />);",
    "    const myComponentElement = screen.getByText(/MyComponent content/i);",
    "    expect(myComponentElement).toBeInTheDocument();",
    "  });",
    "",
    "  // 다른 테스트 케이스를 추가하세요.",
    "});",
    ""
  ],
  "description": "/ComponentTest"
}

스니펫 복사 붙혀넣기

 

참고 : vscode Snippet 만들기 (velog.io)