Questions about testing JavaScript code with the Testing Library utilities
Questions tagged [testing-library]
282 questions
0
votes
1 answer
Spy on function called from a React Functional Component
I have a React Functional Component, and I want to write a unit test that checks if a function that gets called further down the chain has actually been called as a result of the component getting rendered.
I don't care which library I use, or which…

Ben
- 5,085
- 9
- 39
- 58
0
votes
1 answer
Get ref value from HTML element
How can I get the ref prop from a HTML element on testing library react? I have this so far:
it('element container ref should be null if prop noSwipe is passed', () => {
const onCloseMock = jest.fn()
render(

Harry
- 39
- 4
0
votes
0 answers
Test if an element was focused at least once using Jest and Testing Library
I'm trying to test a React component that should focus all the fields having certain ids at least once, using Jest and Testing Library. For example, if the rendered components are:
import { render } from '@testing-library/react';
const { container…

Mr_Somebody
- 21
- 9
0
votes
1 answer
Can't test the input checkbox properly when the element is disabled using @testing-library/vue
I'm trying to create some tests for a checkbox component but looks like I can't make an assertion for an input[type="checkbox"] when is disabled.
In the first two blocks I'm testing if the checkbox can be checked/uncheck if the element is disabled,…

Vinicius Cainelli
- 616
- 5
- 16
0
votes
1 answer
If 'app-user' is an Angular component and it has 'InwelcomeMsg' input, then verify that it is part of this module
I am getting an error as follows when i test the child component:
1. If 'app-user' is an Angular component and it has 'InwelcomeMsg' input, then verify that it is part of this module.
on testing the component. i am using testing-library for angular…

user2024080
- 1
- 14
- 56
- 96
0
votes
1 answer
Testing-library: not picking up the match by text
No matter what I use .getByText(), or .toHaveTextContent() I am unable to select the text inside my Dom element which looks like this :
Total Score- {score || 0}
Here I am trying to run the test By ID…
vaibhav
- 762
- 2
- 12
- 34
0
votes
1 answer
Vue3/TS/Jest/testing-ligrary: can not run tests
I create project through vue cli with options: vue3, TS, JEST and add @testing-library/vue . my package.json looks like this
{
"name": "todo-app",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
…

flasher2085
- 141
- 2
- 9
0
votes
0 answers
How to get the expected string with a expression regular in testing library?
I'm trying to test a component that, when I click in the buttons 'Adicionar ao final'(add to the end) or 'Adicionar ao início'(add to the begin), it shows something like that:
Id:1627223765317 Valor:1627223765317
Id:1627223765150…

Uriel Libano
- 55
- 9
0
votes
1 answer
Writing tests for React JS
I've just started to study about tests and i'm trying to test a component that has a initial state = false. On click, it should change to !state and if it's true, render a Child Component.
I'm trying to write, at least, a test to check if it changes…

Uriel Libano
- 55
- 9
0
votes
1 answer
How to use React Testing Library to test for appearance/disappearance of elements in Gutenberg editor using Puppeteer?
I have the following set up:
E2E Test Utils - standard WP Gutenberg e2e testing set that uses Jest and Puppeteer
testing-library/pptr-testing-library - All your favorite user-centric querying functions from @testing-library/react &…

crs1138
- 926
- 1
- 12
- 23
0
votes
2 answers
Is it possible to check the html tag name on which it is present after getting the element using test id?
Suppose I have this code in my component.tsx file. Is there a possibility to check the tag name on which a paricular test id is present ?
Welcome!

Franklin Pious
- 3,670
- 3
- 26
- 30
0
votes
1 answer
Jest-dom unable to find module inside of its folder in node_modules
When I add into my test-setup.js import "@testing-library/jest-dom"; Jest throws me this error when I run any test. If I remove the import everything works fine. Tried to add the import directly in test files, without success.
This is how…

woaouh
- 1
- 1
0
votes
0 answers
Test async components with react
I have the following component which displays a list of items as cards fetched using the fetch api call from a data.json file.
const [items, setItems] = useState([]);
useEffect((): void => {
getData().then((response: any): void => {
…

Chief
- 854
- 12
- 27
0
votes
2 answers
How to override 'data-testid' in the 'findByTestId function from Cypress Testing Library
Most of my existing codebase uses a 'id' only in few places 'data-testId' attribute present.
tried this code
import { configure } from '@testing-library/cypress';
configure({ testIdAttribute: ['data-testId','id'] });
But, still its not working.
Is…

imBollaveni
- 99
- 1
- 13
0
votes
2 answers
Why is my header component defined but never used in my test?
Im trying to get a react testing library test going but having lots of issues
import React from 'react'
import Header from './Header'
import {render, cleanup} from '@testing-library/react'
test("Renders's the header and required inputs", () => {
…

VibrationPositive
- 301
- 2
- 8