Cypress vs. Playwright: end-to-end testing showdown

[utterances-bot]

Cypress vs. Playwright: end-to-end testing showdown

Like Cypress, Playwright is also a framework for end-to-end testing. Find out what are some of the differences and write your first Playwright test!

https://silvenon.com/blog/e2e-testing-with-cypress-vs-playwright

[punkpeye]

I have mixed feelings. I like that Playwright is faster, but I do like that Cypress runs tests in the browser itself, i.e. I can use any JavaScript library to run those tests. In Playwright, you will need to rewrite logic to make it playwright specific – like the example of @testing-library/cypress.

[silvenon]

You can make your own custom library that provides helpers like Testing Library does, which uses Playwright under the hood, if you want to. Did I understand correctly?

[punkpeye]

You can, just means that you are now building tools specific to Playwright, as opposed to using browser APIs.

[silvenon]

You can use browser API by evaluating JavaScript, I think that way you can build @testing-library/playwright just like @testing-library/cypress.

[bugzpodder]

Safari "This helped me catch a CSS bug that I would otherwise probably never catch."

Just curious what the issue is and how you caught it? Normally we write tests that find and do stuff with dom elements, not CSS. did you test pass in chrome but fails in safari?

[silvenon]

Something was causing the page to overflow horizontally in Safari, I can't remember what, though. The point is that the overflow test was failing on Safari, that's how I caught the problem.

As you say, usually it's hard to test for CSS problems, but in this case the problem was easy to detect.