The Case for Cypress

[00:00:00]
>> Now that we've talked about unit testing and some ways for us to approach it, to think about it and to examine the results and qualify the results, I want to shift to end to end testing. And I believe, ultimately that end to end testing is one of the most underrated most high value activities that organizations can do.

[00:00:25]
The reason being is that you have typically a disconnect or a separation between the development team and the QA team. And so not only do you have the separation between the development team and the QA team, you also have a communication gap between the stakeholders. So if you've ever worked on a project, and you've built something, and then, you show it to your stakeholders and they're like, that's not exactly what I had in mind.

[00:00:57]
We've all been there, like you tried to interpret what they say, and they're like, well, of course I didn't tell you that's what I wanted to do, I thought it was obvious. So now imagine you've kind of got these three tiers of stakeholders, developers and your QA department.

[00:01:11]
And so you have a communication gap, you build something, but then you have a time gap for that to be tested and evaluated. And so it creates this disconnected environment where you don't know what you're building and then you don't know if it works. And I have seen projects at scale be completely delayed by weeks because of this kind of asynchronous gap that is really caused by just human beings and the human condition.

[00:01:41]
And so when developers optimize ownership outwards in terms of communication and automation, that they can start to take control of the software development lifecycle, optimize it and create value to the QA department and to the stakeholders. Now, I'm not saying that there should not be a QA department, but I firmly believe that human being should never do what a robot can do perfectly every single time.

[00:02:17]
From here, we're gonna jump into the application and we're gonna walk through what proper testing looks like, end to end testing, in a construct or the confines or context of an Nx workspace. So, End to End Testing with Cypress, the fundamental premise here is that human beings cannot scale.

[00:02:40]
Not only that, human beings are error prone. And so if you think that you as a human being can do the same task perfectly every single time, the same exact way, then I would say you are either a robot or cyborg, or we're not being honest. And I've actually had some kind of contentious relationships with QA because there's a little bit of a territory thing, but at the end of the day, you really have to be honest and say like, I cannot test this application the same way every single time, depending on, are you hungry?

[00:03:21]
Are you angry? Are you in a hurry? It's very easy to cut corners and so, as I said before, never let a human being do what a robot can do perfectly every single time. Now, this is where we stop. And I have to be careful what I say here because I don't want to marginalize anybody's contributions, especially to Open Source Initiative, so I'm trying not to be negative here.

[00:03:55]
So I want to temper what I'm going to say. But I'm about to go on a rant and this is pertinent to, I believe, angular development and really, I feel like the end to end testing community in general. So, just a precursor, in theory I believe that when you're doing automated end to end testing, you are essentially printing money for your company.

[00:04:27]
And in my mind, when I think of automated end to end testing, I'm sitting on a beach and I'm drinking fruity, delicious drinks with little umbrellas in it and life is amazing. So this is what I believe end to end testing should be. Unfortunately, this is what the current state of most end to end testing is for Angular developers.

[00:04:58]
And the reason being is that the default tool for testing in Angular is protractor. Now, to be fair, protractor is, they've done a good job with what they have or what they are allowed to work with, which is selenium. And selenium was simply not built for the modern webstack.

[00:05:27]
And so I have spent more time fighting with protractor and selenium than any other technology in the world. And so even now, my eyes may be twitching from the stress of that environment, that you would run a test or test suite it would work five times in a row, then you would run it again and one random test would fail.

[00:05:52]
You'd run it again and some other random tests would fail. And eventually, it just turns into this situation here. Now fortunately for us, there is cypress. And so cypress is, in my opinion, the SpaceX compared to selenium's NASA. It's progressive and it just works. So not only does it just work, but it's developer friendly, open source, and it's built from the ground up.

[00:06:24]
So the folks at Cypress, they just said this isn't working and so they built an entirely new framework essentially from the ground up to work with modern web applications. And for me, it's magical. It allows you to do time travel, real time reloads, everything that you'd want, spies, stubs, clocks, network traffic control, etc.

[00:06:50]
The one thing that if you notice in this corner here, consistent results, that to me puts a tear in my eye. Like, it literally just works, and the fact that it works every single time it's magical. It has cross browser support, so this is one of, I think, the main criticisms against Cypress up until recently.

[00:07:10]
But it now supports Chrome, Firefox, Edge, Electron, Brave and not only that, the documentation is amazing. And so they've done a really good job of just everything that you could possibly want to do, really laying that out and just putting all the tools, all the information needed right upfront for you to get started.

[00:07:35]
The test runner is next level. And so the big thing here is that you have your command log that you can time travel, you can set your viewport sizing, and you can also see your application in real time as it's being tested. And not only that, is you can run your test against any number of browsers and see all of your tests.

[00:08:00]
And then you can run them all or in one at a time depending on what you wanna do. So if you are like I just wanna run this test, you can jump in and do this. And not only that, is they have an additional kind of paid feature that I think is interesting.

[00:08:17]
And depending on what you're doing, certainly a good value, but the ability to instrument your end to end test on their platform so that you have this kind of master control center to see your runs, organize your results, see your test failures and then respond appropriately. Now, here's the beauty of this, when you use the Angular COI, it comes with protractor.

[00:08:45]
But we get Cypress for free with Nx and for this alone, I believe this is a good reason to use Nx, we get Cypress for free.