[react testing library] #react

testing-library.tsx

https://testing-library.com/docs/react-testing-library/migrate-from-enzyme


// getByRole, queryByRole, getAllByRole, queryAllByRole, findByRole, findAllByRole
// getByLabelText, queryByLabelText, getAllByLabelText, queryAllByLabelText, findByLabelText, findAllByLabelText
// getByPlaceholderText, queryByPlaceholderText, getAllByPlaceholderText, queryAllByPlaceholderText, findByPlaceholderText, findAllByPlaceholderText
// getByText, queryByText, getAllByText, queryAllByText, findByText, findAllByText
// getByDisplayValue, queryByDisplayValue, getAllByDisplayValue, queryAllByDisplayValue, findByDisplayValue, findAllByDisplayValue
// getByAltText, queryByAltText, getAllByAltText, queryAllByAltText, findByAltText, findAllByAltText
// getByTitle, queryByTitle, getAllByTitle, queryAllByTitle, findByTitle, findAllByTitle
// getByTestId, queryByTestId, getAllByTestId, queryAllByTestId, findByTestId, findAllByTestId

screen.getByText('456').closest('a')
screen.getByRole('button', { name: EXPECTED_LABEL })

//////////////////////////
// https://testing-library.com/docs/dom-testing-library/api-debugging
screen.getByRole('foobar')
screen.debug()

//////////////////////////
// REACT https://testing-library.com/docs/react-testing-library/api
const { rerender } = renderWithDi(<ComponentForTest />);
rerender(<ComponentForTest />);


jest.useFakeTimers();
const { rerender } = renderWithDi(<ComponentForTest />, DEPS);
act(() => {
    jest.runAllTimers();
});
rerender(<ComponentForTest />);

//////////////////////////
// https://github.com/testing-library/jest-dom
toBeDisabled
toBeEnabled
toBeEmptyDOMElement
toBeInTheDocument
toBeInvalid
toBeRequired
toBeValid
toBeVisible
toContainElement
toContainHTML
toHaveAccessibleDescription
toHaveAccessibleErrorMessage
toHaveAccessibleName
toHaveAttribute
toHaveClass
toHaveFocus
toHaveFormValues
toHaveStyle
toHaveTextContent
toHaveValue
toHaveDisplayValue
toBeChecked
toBePartiallyChecked
toHaveRole
toHaveErrorMessage