Form Validation Solution

[00:00:00]
>> So for these they're very similar to what we just did together. Some of the more interesting pieces if you go through the DOM is that, instead of getting an issue where the value is missing, when you type in a not real email address. You don't get that, you get a type mismatch, right?

[00:00:19]
So you can kind of just validate like, what kind of error that way if you don't, because even theoretically, this one relies even on the browser including the same validation method, right? Message across all the different browsers, across time, right, the checking the validity object, which is standardized is probably a better choice.

[00:00:42]
But again, it all kind of depends as well. And the password is, again pretty similar where we'll type in an email, and then we'll submit the form. The one thing that I want to point out is, there's the occasion we might need to type things that aren't actual letters, right?

[00:01:04]
And so Cypress has a syntax for that. So in this case, this is totally valid email address, valid@gmail.com, and then hit the enter key, which the normal behavior of a form at that point is to submit the form. And so that will cause a submit event as opposed to calling submit on the form object itself, or clicking the sign up button.

[00:01:28]
We can actually just hit enter. So you might be wondering, what are the other options? And that's a great question. I'm so glad that you asked it simultaneously with your faces obviously. It is in the kind of cyber stocks backspace, delete all the other buttons on your keyboard that don't have letters or numbers or symbols attached to them.

[00:01:51]
So even like the move to end which is like command arrow on Mac iOS. Something else and other operating systems to be clear, the only reason I use a Mac is because I don't know how to make an M dash or I have the muscle memory around like the Emacs key bindings that's really it.

[00:02:06]
Select all so on and so forth, and then also the ability to have any modifier characters as well. So anything you need to do there, you can also trigger those as well. Enter is the one you'll probably mostly use but again, I'm mostly just putting this in your brain, so that when you.

[00:02:27]
No we hit command K to open up a palette to switch between things, right you can begin to like figure all of that out. All right, so this was the app that we had had the signup and sign in form. And that's great. At one point I was signed in and we saw that there were some posts, right?

[00:02:45]
And if you don't, if you're not signed in, then you would have to you get redirected. So you have to both, before you can sign in you got to make an account, right? But once you make an account, you can't make a duplicate account again, because that account exists, right?

[00:03:04]
So what do you use keep making junk accounts every single time. The other option that I've seen a lot of companies do, it's just like there is a user pool and you kind of check in and check out users, right, for each test. And that means you can almost never paralyze your tests, right?

[00:03:22]
Because we've evolved that user being in the right condition. And if a test ever fails and doesn't clean up, then you end up in a situation where you have to manually go in there or else all the bills break. The other thing that you notice is we've used a lot of before each and you'll see that we've never really used anything else.

[00:03:40]
Because like, even the cleanup stage should happen before, right. Because if a test fails or stops for some reason that after will never the runner goes down or something like that. Cleaning up before makes a lot of sense because you're kind of coming into the test with a clean slate.

[00:03:56]
But I digress, what we really need is a way to create users and sign in. Now, the naïve, not correct, bad implementation that we'll start with is this. I will get some way to make a random email address. Right, this guy's I'm gonna use Date.now we can just like use a uu ID or what have you, I will go and literally go through the process of signing them up.

[00:04:25]
Then I will go through the process of signing them in. And then maybe I can see the page that I wanted to see. Now this we're not doing this, right, but this is like until we learn a few new tricks. What we're going to need to do, right?

[00:04:40]
The few problems is I'm using hack to generate unique users, not cleaning up anything that I'm generating. Mostly because like you can't delete users from the browser. When you're not logged in, and that's a feature not a bug. And, I'm manually creating by dragging the UI. And even the act of doing that is very, very tedious.

[00:05:02]
Now, I could put that before each, but even those before each is limited to a subset describe block, which is limited to a file, which means you'd have to have one giant test file. Or do some really wild stuff with your requires in ways that will probably hurt your feelings, right.

[00:05:20]
And so there are better ways to do all these things so we're going to kind of need to tease this apart. Now what the better way does matter somewhat around your constraints, right. For instance if you are maybe it's a, an older Ruby on Rails application and its server generated pages, you're just using Cypress.

[00:05:46]
Cypress doesn't necessarily know that you're using some fancy schmancy react application. It could be used for anything, right? You might need to like seed your database and reset like a test database or local database development or something along those lines, right? That's one option. Another option is to just mock out the world, right?

[00:06:07]
That works but is it really an end to end test? And you might be like, I don't care, right, like so it comes down to like, what set of trade offs are you willing to make? And what thing are you trying to test, you might have some way you do set the database and as a true end-end test, you might have somewhere to like, listen, I just need to make sure this filtering works.

[00:06:26]
I need to get them onto that page, I don't care what I have to do to get them. No, that's not what I'm trying to test at this point, right. So depending on what you want to do, which strategy of the next few strategies we look at is going to depend, right?

[00:06:38]
So we will kind of figure that out. Now let's go back to that kind of like half tongue in cheek comment that I made. That is a feature not a bug, that a unauthenticated user cannot delete existing users in our application. It's true and so what would we do, if we did need to like reset a database or see the database, this whole idea of like, hey, Cypress, it just hits things in the browser.

[00:07:03]
Could become somewhat limiting. Now I've been in this industry long enough. I know what the natural first move is, which is, not I will just run some bash scripts before we run the tests. We'll just shell out every time, right? Yeah, I've been, I've lived that life that's probably not necessarily the way forward because we wanna be able to do it programmatically in our tests.

[00:07:30]
We want to be able to do it in a describe block. We want to be able to do all these things. But the idea that we might have to do stuff outside the browser is a reasonable thing that we might need to do.