Comments (3)
That's a very good use case.
I really don't know if your components undergo minifications or not when it renders in the UI. You can try something like below:
cy.react('MyEmailInput', {input:{name:"workEmail"}}).should(....) // do your job
// or you can go wild card
cy.react('*', {input:{name:"workEmail"}}).should(....)
Now, you can also make use of Chrome React Dev Tools to actually spy on the component and props. I have given a demo here to show how I am getting the component and props for my sample test cases.
If you need further help, would you mind sharing a mini-repo and I can play with that? Let me know if any of these suggestions work for you.
from cypress-react-selector.
I built a simple CRA app and an associated Cypress test spec that uses cy.react()
.
Hopefully people will find some of the info herein useful. Feel free to borrow or steal into the cypress-react docs or examples however you see fit. See the README for instructions.
https://github.com/gregfenton/example-cypress-react-selector-formik
One recommendation for the cypress-react-selector doc is to have more than just { someBooleanProp: true }, { someBooleanState: true }
listed in the examples. It gave me the impression that the properties had to be boolean and primative. This example repo shows that cy.react()
is more complex than that.
@abhinaba-ghosh - many thank yous for your contribution!!
from cypress-react-selector.
Hi @gregfenton , your example looks great and definitely will force me to update the manual. Feel free to raise PRs if you see there is a lack in the documentation, example, or process. Again, I cant thank you enough for the working example.
from cypress-react-selector.
Related Issues (20)
- Cannot read properties of undefined (reading 'waitToLoadReact') HOT 2
- Would this work with 3rd party libraries? Such as Material UI? HOT 2
- getting webpack-dev-server warning on resqInjector.js attaching the error. HOT 1
- Selectors are failing when upgrading to React 18 HOT 12
- Update plugin to be compatible with Cypress 10 HOT 4
- Could not find instance of React in given element HOT 6
- Functions react() and getReact() don't retry upcoming assertions
- Functions react() and getReact() - infinite retrying for failed upcoming assertions HOT 1
- Is it possible to get a component from a portal?
- No "sourceType" field on TSConfig compiler options HOT 1
- Using getCurrentState
- Cypress 12 Compatibility
- Can't find component by props with value of type array of objects. HOT 1
- Not able to access the sample tests (e2e tests) HOT 1
- incompatibility with Reactjs version 18
- Selector is reporting too many/duplicate items
- How to call the function inside of a component? HOT 1
- Option to suppress cy.log in getProps and getCurrentState
- warning message with resq
- Error when using Vite preprocessor due to require.resolve
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from cypress-react-selector.