jest : 프론트 앤드 테스트 라이브러리

joyoung·2024년 4월 14일

설치후 파일이름에

파일이름.test.jsx 으로 설정하거나
test 폴더 하위에 위치한 파일의 경우 자동으로 테스트를 진행해준다

test, it 등으로 테스트를 정의 할 수 잇는데

describe 은 테스트 구룹을 정의 하는데 쓰인다


describe("Calculator Functions", () => {
  test("test adds 1 + 2 to equal 3", () => {
    expect(1 + 2).toBe(3);
  });

  it("it adds 1 + 2 to equal 3", () => {
    expect(1 + 2).toBe(3);
  });
});

컴포넌트 테스트 시 컴포넌트 최상위레벨은 container

testing-library/react에서 나온 컴포넌트를 테스트하기 위해 사용되는 외부 함수들이다

아래는 app 컴포넌트를 콘솔로 찍어본 결과

 {
      container: HTMLDivElement {
        '__reactContainer$4q2rajhf34': FiberNode {
          tag: 3,
          key: null,
          elementType: null,
          type: null,
          stateNode: [FiberRootNode],
          return: null,
          child: null,
          sibling: null,
          index: 0,
          ref: null,
          pendingProps: null,
          memoizedProps: null,
          updateQueue: [Object],
          memoizedState: [Object],
          dependencies: null,
          mode: 1,
          flags: 0,
          subtreeFlags: 0,
          deletions: null,
          lanes: 16,
          childLanes: 0,
          alternate: [FiberNode],
          actualDuration: 0,
          actualStartTime: -1,
          selfBaseDuration: 0,
          treeBaseDuration: 0,
          _debugSource: null,
          _debugOwner: null,
          _debugNeedsRemount: false,
          _debugHookTypes: null
        },
        _reactListening0pyhj63guiv9: true
      },
      baseElement: HTMLBodyElement {},
      debug: [Function: debug],
      unmount: [Function: unmount],
      rerender: [Function: rerender],
      asFragment: [Function: asFragment],
      findAllByLabelText: [Function: bound ],
      findByLabelText: [Function: bound ],
      getAllByLabelText: [Function: bound ],
      getByLabelText: [Function: bound ],
      queryAllByLabelText: [Function: bound ],
      queryByLabelText: [Function: bound ],
      findAllByPlaceholderText: [Function: bound ],
      findByPlaceholderText: [Function: bound ],
      getAllByPlaceholderText: [Function: bound ],
      getByPlaceholderText: [Function: bound ],
      queryAllByPlaceholderText: [Function: bound ],
      queryByPlaceholderText: [Function: bound ],
      findAllByText: [Function: bound ],
      findByText: [Function: bound ],
      getAllByText: [Function: bound ],
      getByText: [Function: bound ],
      queryAllByText: [Function: bound ],
      queryByText: [Function: bound ],
      findAllByDisplayValue: [Function: bound ],
      findByDisplayValue: [Function: bound ],
      getAllByDisplayValue: [Function: bound ],
      getByDisplayValue: [Function: bound ],
      queryAllByDisplayValue: [Function: bound ],
      queryByDisplayValue: [Function: bound ],
      findAllByAltText: [Function: bound ],
      findByAltText: [Function: bound ],
      getAllByAltText: [Function: bound ],
      getByAltText: [Function: bound ],
      queryAllByAltText: [Function: bound ],
      queryByAltText: [Function: bound ],
      findAllByTitle: [Function: bound ],
      findByTitle: [Function: bound ],
      getAllByTitle: [Function: bound ],
      getByTitle: [Function: bound ],
      queryAllByTitle: [Function: bound ],
      queryByTitle: [Function: bound ],
      findAllByRole: [Function: bound ],
      findByRole: [Function: bound ],
      getAllByRole: [Function: bound ],
      getByRole: [Function: bound ],
      queryAllByRole: [Function: bound ],
      queryByRole: [Function: bound ],
      findAllByTestId: [Function: bound ],
      findByTestId: [Function: bound ],
      getAllByTestId: [Function: bound ],
      getByTestId: [Function: bound ],
      queryAllByTestId: [Function: bound ],
      queryByTestId: [Function: bound ]
    }
profile
꾸준히

0개의 댓글