score:1
in order to refer to components, use their name not a string as documented:
wrapper.find(foo) // foo component, not 'foo'
i would like to check if there is a correct number of children components of the radiogroupfield component:
use children()
as documented in the enzyme
api
const radiogroupfield = wrapper.find(radiogroupfield).dive()
expect(radiogroupfield.children()).to.have.length(2)
references:
edit:
add dive()
as this may be needed to render components (non-dom nodes)
update
i have tried with using name and not string for the component and dive method, but all of a sudden i get an error:
referenceerror: radiogroupfield is not defined
any components used in your tests need to be imported.
here's an example:
foo.js:
import react from 'react'
export const bar = (props) => {
return (
<div>
{props.children}
</div>
)
}
export const baz = () => (
<div>foo</div>
)
export const foo = () => (
<bar>
<baz />
<baz />
</bar>
)
export default foo
foo.test.js
import react from 'react'
import { shallow } from 'enzyme'
import foo, { bar, baz } from './foo'
it('foos', () => {
let wrapper = shallow(<foo />)
expect(wrapper.find(bar)).tohavelength(1) // jest syntax
})
score:0
this also works:
const radiooption = wrapper.find(radiogroupfield).dive().find(radiooption);
Source: stackoverflow.com
Related Query
- Testing react component's number of children
- Nested components testing with Enzyme inside of React & Redux
- React - adding class to children components
- Testing React components that fetches data using Hooks
- Only allow specific components as children in React and Typescript
- React: Are there respectable limits to number of props on react components
- Call methods on React children components
- Finding the number of rendered child components in react test using enzyme?
- React - Render a certain number of components dynamically
- React Testing Library: Match Number of Buttons
- How to test components internal functions with React testing library
- How can I unit test parent react components that call methods on children
- Testing React form components
- Testing Webpack built React components with Jest
- How to Listen for Events in children components in React Native?
- Unit testing ES7 React components with Jest
- React Testing Library: Test if children are passed / rendered correctly
- React Testing Library: How to test components that contain useLocation()?
- How to test if React component is returning null or its children using React Testing Library?
- Typescript - IntrinsicAttributes and children type issues when typing React components
- Passing a function down multiple children components in React using ES6
- Getting started testing React components with Enzyme and Jest
- React - Running count of components in children (e.g. for footnotes)
- Is it possible to limit children to specific components using React with TypeScript?
- Testing components that contain react router Link with Enzyme
- Testing React components with Mocha: unexpected token
- How to mock react components with react testing library?
- How to mock stencil web components by using react testing library?
- React testing library + Jest: How to test a component that receives a number then format it
- Testing components that depend on Context using React Testing Library or Jest
More Query from same tag
- Type of Link component passed as 'component' prop
- Button sit at bottom of page centered
- React Test case for the button disabled or not on the basis of state value
- React Tic Tac Toe Tutorial
- React.js Mui Treeview: How to make on nodeselect not collapse
- How to fetch from backend database to display on frontend using react?
- Can't generate webpack-assets.json with webpack-isomorphic-tools
- ReactJS component to upload a file to a Spring MVC/Data-REST server
- display Popup only on selected element
- JavaScript Check if File exists, if not then
- Create an element spanning two Navbars
- How to bind the function by use @inject?
- Trying to fetch axios data with redux, and load it in a component using useEffect
- Why It’s difficult to remember which props or state are used by functions outside of the effect
- Missing state value after function binding in React
- How to load a list of SVGs in React JS
- How to get the value from interface and use it on another function
- Antd Menu - React Js
- How to make checkboxes of Bootstrap table responsive
- Deploying a create-react-app to Plesk Onyx
- How to fix a react-hooks/exhaustive-deps linting error with no dependency
- How to properly search in a list in ReactJS
- React : Returning SVG contents as variable?
- react-router and express child routes not triggering
- Change Page with useState, depending on websocket message 'Can't perform a React state update on an unmounted component'
- How to change the borderColor of Paper component from material-ui react?
- Cannot dispatch in the middle of a dispatch
- helper function overwriting previous values in mapped list in react
- npm throws error for wrong package
- How to reformat react calendar date