Questions tagged [testing-library]

Questions about testing JavaScript code with the Testing Library utilities

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…
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,…
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…
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…
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…
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!

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…
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", () => { …