Cypress Tips April 2023

Pick the Cypress "Testing The Swag" course lessons to make free 🗳️

Hello everyone,

First, let me confess: the bahmutov/cypress-playwright plugin announcement was my April 1st joke, but it did catch many people off guard 😂 It was made in good fun, I promise!

Testing The Swag Store

My course https://cypress.tips/courses/swag-store has grown. A lot. I originally planned 30-40 lessons covering Cypress testing basics, but the course now has 100 lessons, covers end-to-end and component testing, and has 30+ bonus lessons that show how to set up code coverage to reach 100% code covered.

Cypress tests cover 100% of the application source code

Honestly, it turned out to be a good course, and I raised its price to $99. I am now recording videos for every lesson, showing my solution to every exercise.

Only 5 lessons out of 100 are free, which is too low. I want my courses to have at least 10% of the lessons publicly available. Can you help me pick which lesson(s) to make public to everyone? Vote in the poll below and I will make the top two lessons free.

Tip: you can sponsor any particular lesson to make it public, and I will put up a banner with the sponsor’s name on the lesson so everyone knows whom to thank. Contact me for details and pricing.

There is one more very special new course announcement coming, stay tuned 🎁

Cypress Level Up Online Workshop

If you haven’t seen the announcement, I will donate the full online workshop in April to anyone who was affected by the recent tech layoffs. We will have 4 days of Cypress studying covering https://github.com/bahmutov/cypress-workshop-basics material and it costs only $10.

Cypress April Workshop dates and time

For details see my blog post https://glebbahmutov.com/blog/cypress-level-up-workshop/ and if you know anyone who might benefit from the new skill when searching for a new job, forward it to them.

New blog posts and videos

• 📝 Upgrade Cypress From Version 9 to Version 12

• 📝 Fix For Cypress Plugin Events

• 📝 Retry Or Not

• 📝 Full Code Coverage For Free 👀

• 📺 Fun With Cypress Query Commands And Asynchronous Functions

• 📺 Learn :has and :contains CSS Selectors

• 📺 Three Ways Of Checking If Element Becomes Visible

• 📺 Get And Set Multiple Elements Attributes

• 📺 Minimatch Unit Tests Inside Cypress

• 📺 Check CSS Color Using jQuery-Chai Assertion "have.css"

• 📺 Negative Assertions

• 📺 Select Invalid Option

• 📺 Test Microsoft FAST Design Library Select Web Component

• 📺 Confirm All HTML data- Attributes At Once By Using The dataset Property

As always, every Cypress video and blog post I make is scraped and can be found by searching its text from https://cypress.tips/search 🔎

In other news…

Alex Sanzhanov has created two very nice summary tables with all CSS and jQuery selectors that you can use in Cypress. Here is the first screenshot, for more see his “Selecting elements in Cypress tests: basic + advanced patterns (2 useful Cheatsheets)” post.

Cypress selectors: CSS

You can find my examples for selecting elements at https://glebbahmutov.com/cypress-examples/commands/querying.html which now has a Dark mode theme for all you night 🦉🦉🦉 out there:

Cypress querying commands examples in Dark mode