score:1
Accepted answer
Try the code below
import { shallow } from 'enzyme'
import MyComponent from './MyComponent'
describe('<MyComponent />', () => {
it('simulates click events', () => {
const component = shallow(<MyComponent />);
component.find(Button).simulate("click");
});
});
EDIT Try the code below:
expect(component
.find(Button)
.closest('.settings'))
.simulate("click");
score:1
The type of element isn't a Button
, thats the component name. It is probably a button
or input
. You can do it like this depending on what element type the node is:
const foo = shallow(<MyComponent />);
foo.find(".settings[button]").simulate("click");
To make this more specific you could always add a class to the button.
Or, per the documentation, if you'd like to you can target it by inputting the component to the test and then finding it that way:
import Bar from '../components/Foo';
const wrapper = shallow(<MyComponent />);
wrapper.find(Bar).simulate("click");
Finally, without any additional imports you can use the display name of the component like so:
const baz = shallow(<MyComponent />);
baz.find('Button').simulate("click");
Source: stackoverflow.com
Related Query
- How to find a React component inside an element with specific class using enzyme?
- Find element with Enzyme in nested React component
- How can I convert a class with a constructor to a functional component using React Hooks?
- How to test a function inside React functional component using jest.spyOn with React Testing Library
- Using React Jest Enzyme - How to pass a constructor object to my component with Shallow?
- How can I find the input with a specific ID using the React Testing Library?
- How to test action props from ReactiveDict inside React component with Enzyme
- How do I toggle class with React radio component using Hooks?
- Unable to find svg element for unit-testing of d3 component in React using enzyme and cheerio
- How to test the style inside the CSS class for React component using Jest and Enzyme?
- How to display an unordered list into a JSX <ul> element in a React Form using class component
- How to mock React component methods with jest and enzyme
- How to test style for a React component attribute with Enzyme
- How do I get an attribute of an element nested in a React component using Jest and/or Enzyme?
- How to declare defaultProps on a React component class using TypeScript?
- How do I export more than one class component with React JS?
- How to distribute fonts or other static assets with a React component library built using Webpack?
- Testing functions inside stateless React component with Enzyme
- How to test methods inside functional component using enzyme as instance() returns null for shallow wrapper?
- How to use jest.spyOn with React function component using Typescript
- Mock React useRef or a function inside a functional component with enzyme and jest?
- How to get a React Component reference to change its class using classList?
- How can I search for a component with specific key in React Developer Tools?
- How to read console.log from a mounted component with Enzyme and Jest in Create React App
- How to get the element with the testid using react testing library?
- How to test React state after calling a component method that updates state - using Enzyme
- How to ensure a constant inside a component is only calculated once on start in React (Native) with hooks?
- React: How to add onChange functionality inside of Function component using React Hooks? Need onClick event from a checkbox to influence input state
- how to change image src using props with styled component and react
- How to prevent component re-render (update) inside animations with REACT
More Query from same tag
- How to use Graphql typescript types in react
- How to style an individual <li> as opposed to all <li> in React?
- How to pass mouse events between overlapping components in ReactJS
- How to deal with missing fields in react.js
- Basic hello world with react-router and webpack not working
- Passing Multiple Arguments to Function in React
- Cannot get prevState value using userRef hook for array of objects
- React - Uncaught TypeError: Cannot read property 'state' of > null
- How can i host MERN website on plesk (windows)
- Expected Array but received array in Jest
- Failed to access props inside the ComponentDidMount method
- Why does conditionally imported component not render?
- How to break one array value into two string on index base in react native
- What is this React syntax – <ReactMarkdown components={{pre() {}}} />?
- How to arrange nested array of object data for react table component display
- What is the purpose of using JSON.stringify()?
- Connecting component to store
- CytoscapeJS calling setState function in React
- How to reduce the bar width in chart js doughnut chart
- Use component onClick
- How to send events from electron to react components only after all components are ready?
- How to get Current User using ReactJs
- How to prevent user multiple click submit button error for a login form in react?
- Create page with single script file given to browser using react.js
- How do I tell what file this error is coming from?
- How can use ref to access current node
- react-bootstrap-modal not showing
- First input autofocus for OTP input fields in React
- How to optimize the rendering on my threejs program
- I deployed my project, I am getting this error Input file contains unsupported image format