> For the complete documentation index, see [llms.txt](https://bharat-tiwari.gitbook.io/our-tech-journal/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://bharat-tiwari.gitbook.io/our-tech-journal/react/react-testing-library.md).

# React Testing Library

```
 @testing-library/react, jest
```

{ `render` } from the react-testing-lib allow us to mount/render a component in virtual memory 

{ `screen` } from the lib allow us to read the rendered HTML

`screen` has few methods to query elements from the rendered HTML, can be used to confirm the expected elements are rendered - 

```
const myElement = screen.getByText("some Text");
expect(myElement).toBeInTheDocument()
```

 `getByText`, `getByTestId` (uses `data-testid` attribute), `getByAltText` etc. methods can be used

To Test a component linked to redux, render it wrapping inside `<Provider>`  with its's store attribute set to mock store data

```
import { render } from '@testing-library/react';
import { Provider } from 'react-redux';
import { createStore } from 'redux';

// .... inside some test
const store = createStore(appReducer, initialState);
const { rerender, ...rest } = render(
    <Provider store={store}>
      <Component {...props} />
    </Provider>,
  );
  
// use rerender, to rerender with some new store values

```