react-testing-library Questions
1
Here is the output from running jest on one of my components:
----------------------------|---------|----------|---------|---------|-------------------
File | % Stmts | % Branch | % Funcs | % Lines...
Resection asked 29/11, 2021 at 6:36
3
Solved
I am making unit tests with jest and react-testing-library for my frontend application which is done with React. My unit tests worked nicely before I added the internationalization with react-i18ne...
Obie asked 22/7, 2019 at 14:22
2
Solved
I'm currently testing an input using Jest & react-testing-library. I'm trying to test whether the onChange function fires whenever my input's field changes. Here's an example of my code:
cons...
Clydesdale asked 11/9, 2018 at 16:49
1
FooterView.tsx
import styles from './Footer.module.scss';
import logo from 'assets/images/logo_header.svg';
import { ReactSVG } from 'react-svg';
import iconTwitter from 'assets/images/logo_twitte...
Walterwalters asked 25/5, 2021 at 14:36
1
Solved
Reproducible repo: https://github.com/hutber/cannotusestatement
What is more worrying is: https://codesandbox.io/s/vigilant-bartik-bmz8x in the sandbox the tests pass. However if you checkout the a...
Mada asked 24/11, 2021 at 20:47
2
Solved
Here is a simple subcomponent that reveals an answer to a question when the button is clicked:
const Question = ({ question, answer }) => {
const [showAnswer, setShowAnswer] = useState(false)
...
Seppala asked 4/2, 2021 at 9:50
3
Here is the test for the :
it("changes the state when body input is changed", () => {
render(<CommentForm />)
// let input = screen.getByLabelText("Your Name");
le...
Return asked 17/3, 2021 at 11:40
2
Solved
I'm new to testing and as I understand, integration tests are aimed to test a bunch of components and how they interact with each other.
But if in a project we use both Cypress for E2E and React te...
Kasandrakasevich asked 29/11, 2020 at 17:36
1
Solved
I have literally trawled everywhere for an answer to this and possibly tried 99% of things out there so i decided to start a thread of its own so others can run their eyes over what i have currentl...
Rone asked 11/11, 2021 at 17:26
1
In react testing library, we have two functions called toBeInTheDocument() and toBeVisible().
1 expect(screen.getByText('hello')).toBeInTheDocument();
2 expect(screen.getByText('hello')).toBeVisibl...
Rigamarole asked 5/11, 2021 at 11:41
2
Solved
I want to get the value of the span element using react testing library.
What i am trying to do?
I have a span element like below displaying some value
render = () => {
const count = 2;
ret...
Amara asked 7/5, 2020 at 9:54
1
Solved
In a nutshell, if I grab a portion of the screen by it's label:
const foo = screen.getByLabelText('Some Label');
I can see that the element I'm interested in exists in the output:
debug(foo);
....
Stadia asked 5/6, 2020 at 22:50
2
I have a component which uses react-virtualized AutoSizer, and inside this component there is a react-virtualized List. The way it is rendered is:
<AutoSizer>
{({width, height}) => (
&l...
Borrego asked 5/6, 2020 at 11:56
2
Solved
I have multiple buttons in my component and all of them should be disabled.
const buttons = screen.getAllByRole('button');
expect(ALL BUTTONS).toHaveAttribute('disabled'); // I want something like...
Markson asked 23/10, 2021 at 3:26
1
Problem
When I try to run my tests via npm test using Jest, with React, and Testing Library I get the following error:
Error
/node_modules/react-dom/cjs/react-dom.development.js:3905
var evt = doc...
Foreandafter asked 23/10, 2021 at 0:14
3
I am using Ant Design's Upload component.
<Upload
accept=".xlsx"
onChange={onImport}
>
<Button>Upload</Button>
</Upload>
I have attempted to simulate the ...
Asthenic asked 23/9, 2020 at 20:59
1
Basic scenario is such: I have a component which has width: 100% as defined in a stylesheet. Therefore it should retain the width of its parent component. I want to calculate the width of my compon...
Blondell asked 5/1, 2020 at 17:13
1
I'm building a React Native application with TypeScript. I'm using React Native Testing Library for my component tests.
I have a simple component that renders two clickable icons and a text. It's ...
Iolenta asked 3/12, 2018 at 8:28
2
i'm newbie on react-testing-library
i'm trying to test my component which inside have conditional rendering.
is my Component:
const ComponentA = () => {
const [isActive, setIsActive] = (fa...
Boulware asked 13/5, 2020 at 19:40
2
Solved
I have a custom hook as below
export const useUserSearch = () => {
const [options, setOptions] = useState([]);
const [searchString, setSearchString] = useState("");
const [userSearc...
Africanize asked 6/10, 2021 at 17:8
1
I am testing my application and encountered a problem. When trying to test whether a row in my Dropdown component applies an effect on hover, I noticed I was not able to check elements for their ba...
Yellowhammer asked 6/10, 2021 at 14:1
3
My Text Input is:
<TextField
className={classes.textField}
data-testid={name}
variant="outlined"
error={false}
required
onChange={(element) => {
if (onTextChange) {
onTextCh...
Heir asked 1/9, 2020 at 20:22
3
I am using Material UI tabs in my application and using react testing library. I need to write test cases which for navigating from one tab to another one. Can anybody help me with this, since the ...
Vespucci asked 27/1, 2021 at 16:39
1
I have a Gatsby site alongside a components library. When running the Gatsby site, I was getting an "Invalid hook call" error, and adding a Webpack alias like suggested here solved the is...
Marrs asked 23/8, 2020 at 12:12
5
Solved
Many React Testing Library examples show how to find and click a button using the getByText query, as in:
fireEvent.click(getByText("Create"))
OR
userEvent.click(getByText("Create&q...
Prewitt asked 27/2, 2020 at 0:5
© 2022 - 2024 — McMap. All rights reserved.