Testing Text Input Fields

[00:00:00]
>> So, now it is time for you to try a few things out. Actually I have one other thing to kinda show you, and then I'm gonna pass the baton over to you, which is, this is taking a static page and viewing it, yeah?
>> Quick question on the, talking about get.

[00:00:20]
So am I understanding correctly that the line on Line 9 where we see cy.get(), that will pull every form on the page. And it will look if every form contains, so if it's one or more, is that right?
>> It depends, right? That's a really great question. The question was, basically if we're thinking outside of jQuery, where everything is a document query selector or is a document query selector all, right?

[00:00:48]
This is one of the places where despite the fact that that Cypress is using jQuery under the hood, it does behave a little bit differently. So jQuery, for instance, will get you a collection with almost any selector. And if we go back and look at the test in this case, let's see if it's, I don't think I saved the file, so we should be good.

[00:01:11]
Well, that's from the form. Let's actually save the file. I'm just gonna delete this piece real quick. It will find the first one in this case. Now, theoretically there's abilities to iterate over things so on and so forth, right? But if you just make an assertion, it's going to assume that you want the first one that it found.

[00:01:35]
Which again is why we, probably, generally speaking, wanna have better data attributes and selectors versus go find me an H1, right? Or hoping that the structure of the DOM doesn't change, so on and so forth. But in this case, if we say should have a form, we go view that it is definitely this one that it thinks that we're talking about as well.

[00:02:01]
So one other thing that I might want to do in this case is, this is great, I've validated and things are on the page. But again your users a lot of times are gonna do stuff, right? And your tests should be well aware that they might want to do stuff.

[00:02:18]
So the other kind of piece there is for, let's say, this input field. We can grab it and I can hit copy real quick. Input field, that seems like good name for a test. And here we do cy.get(), paste that in, and then we can type, yeah, one of the things I should pack is a good attitude.

[00:02:55]
As well, you can see as it runs to the test it will type that into the input field. I'll leave it as a, to your imagination, what click does. For all the other fun input fields, we will deal with them in a little bit. The ones that you can click on like a checkbox, you can actually check it or click it.

[00:03:13]
It will simulate a click event. For some of the other fun ones like a range slider, that's why there's a thing there called input obstacle course. As well, kind of play around with some of those, but we can go ahead and we can type into a field. We can click on a given button, we can start to manipulate the page itself.