-
Notifications
You must be signed in to change notification settings - Fork 46.4k
-
Notifications
You must be signed in to change notification settings - Fork 46.4k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add e2e tests for inline package #22646
Comments
Speaking of libraries which one we should use, |
Would like to work on this, Puppeter would be a good choice for this |
If we use puppeteer we can only test extension on chrome. |
Yeah and the docs of cypress is super beginner friendly how about we both work together and make pull request in patches? |
Yeah I have no issues in working together. But I want opinion on this issue by @bvaughn . |
Well he gave us some, firstly we would have to individually write test for. Hooks, props etc too see if it's viable or not |
I mean the Library isn't decided yet. |
Yeah let bvaughn decide! |
To be honest, I don't know 😄 Let's see what others say: |
Already voted let see! 😀😀 |
So far it seems like a lot of votes for Cypress with some write-ins for Playwright |
I want to do some research on playwright as it might be better option than cypress. |
Seems pretty promising, yes. I'm interested in Playwright now as well. |
ok i would also try to do some work with playwright |
At this point, my vote is for Playwright. If either of you would like to put together a demo/PR that tests the react-devtools-inline package– that would be a great starting point. |
sure will start working on it |
@bvaughn As it is a demo I haven't emulated the 2021-11-02.12-56-34.mp4 |
@akgupta0777 Thanks for sharing the demo.
Just in case there's any confusion, this is the part I'm specifically interested in 😄 |
Sure will ask from you. |
@bvaughn Are these ids attached to inputs and other components dynamic or static ? I rebuild the |
@akgupta0777 Should probably attach test ids to things we want to have automated tests for. |
@bvaughn what assertion should I make to test props on ListItems. See attached image below for reference I am thinking of making an assertion on props exist or not if exist test will PASS and if not it will FAIL. |
Let's just start with a proof of concept test. The specifics of what it tests isn't super important. |
Uhmm... Proof of concept ? Sorry I don't know what doest that mean. Can you explain a little bit please 😅😅 |
Just an example test. |
To clarify, I don't have much bandwidth right now to describe/design specific test scenarios. I just filed this task for my team to consider for later. |
Ok I will try my best and report back to you. |
I tried a lot of things, different approaches ,strategies with cypress but it is really very hard to write tests with iframes. Anyways, I am dropping the Proof of concept. #22754 |
I love the direction we're going with Playwright. One additional thing we could consider in the future is to use the (still experimental) test selector API for e2e testing purposes. (See #22760.) This would not be as complete a solution as Playwright, but would have the added benefit of dog fooding our own APIs. |
I am keeping an eye on test selector API too. Will try to get involved in development of API |
You can now test it out in the Here's a readme: |
|
@akgupta0777 I'm still not able to run #22754 locally. Would appreciate your help if you have any insight. |
I am happy to help and I am on it to find the root cause. |
running |
@akgupta0777 So e2e tests pass for you, but (regular) unit tests fail with the |
No just ignore that it was a mistake I did when trying to fix this. Actually the problem is test runners like playwright only uses commonjs and |
Hey @akgupta0777! Thanks to the fix from @eps1lon, I can run these locally now 🥳 But the third test added in #22754 consistently fails for me: |
@bvaughn I know this problem and I identified it and already fix this in the #22868 . The problem is why it fails is it waits for selector with exact |
Let me know if you need some help. |
Builds on top of the existing Playwright tests to plug in the test selector API: https://gist.github.com/bvaughn/d3c8b8842faf2ac2439bb11773a19cec My goals in doing this are to... 1. Experiment with the new API to see what works and what doesn't. 2. Add some test selector attributes (and remove DOM-structure based selectors). 3. Focus the tests on DevTools itself (rather than the test app). I also took this opportunity to add a few new test cases– like named hooks, editable props, component search, and profiling- just to play around more with the Playwright API. Relates to issue #22646
Once #23019 lands, we can close this issue out. (It will run the new e2e tests we have in Circle CI automatically with each new PR.) |
Yes |
Builds on top of the existing Playwright tests to plug in the test selector API: https://gist.github.com/bvaughn/d3c8b8842faf2ac2439bb11773a19cec My goals in doing this are to... 1. Experiment with the new API to see what works and what doesn't. 2. Add some test selector attributes (and remove DOM-structure based selectors). 3. Focus the tests on DevTools itself (rather than the test app). I also took this opportunity to add a few new test cases– like named hooks, editable props, component search, and profiling- just to play around more with the Playwright API. Relates to issue facebook#22646
Builds on top of the existing Playwright tests to plug in the test selector API: https://gist.github.com/bvaughn/d3c8b8842faf2ac2439bb11773a19cec My goals in doing this are to... 1. Experiment with the new API to see what works and what doesn't. 2. Add some test selector attributes (and remove DOM-structure based selectors). 3. Focus the tests on DevTools itself (rather than the test app). I also took this opportunity to add a few new test cases– like named hooks, editable props, component search, and profiling- just to play around more with the Playwright API. Relates to issue facebook#22646
DevTools has good unit test coverage but no e2e test coverage. This is because the support for testing extensions is pretty limited in e2e testing libraries. That being said, we could probably get 80% of the value of e2e testing leveraging our
react-devtools-inline
package.We should create a few example tests (e.g. load hook names, select a component and edit props/state, etc) to see how viable this is.
For now, these tests should not block PRs from landing.
The text was updated successfully, but these errors were encountered: