This is a video about Puppeteer Timing, page.goto vs page.click.
The key part to remember is that page.goto() has a built in “waitForNavigation’ in it. page.click() does not! So if you’re using page.click() remember to use something to wait for your next page to resolve.
So I wanted to talk about one little trick here and the difference between page dot. Which is when you navigate directly to a URL and when you click a button, sometimes it may be easy just to click the button. And I want to talk about the difference and why go-to is typically better. Okay. If you can, if there’s URL, I think it’s typically better.
And if not, we need to figure some way to handle it. So first things first let’s show go-to, we’re going to here. We’re going to go to the homepage right here, and then we’re going to go to the blog. So let’s say we go over here, we grab this blog URL and then we navigate around. And then once we navigate to the blog, we’re going to get this entry title right here, this right here, see this element.
So we’ll see that we go over here. It opens up the page, it clicks the blog, and then it gets this data right here. Okay. Now let’s try the same thing as if we click the button. So we come over here, we click this blog button and then it navigates us to here. And then we grabbed the thing. And let’s see it run.
Now. There it is. Oh, it failed. Why did it fail that time? Anyone, anyone, anyone raise your hand? Don’t all speak at once. One of you raised, okay. You, yes, that’s correct. Billy in the front. He got it. Right. So when you do go to go to has built in, wait for navigator. Does it say that now it doesn’t say it. Look, see promise, which is off the menu in case multiple, the navigation will resolve with the response of the last redirect.
Okay. So I think this whole thing is built in navigation. Wait, waiting. That is, as in you push it, go go-to and navigate to the page and it waits for it to load. Then it will proceed. I don’t know what w what line is deciding that? I think it’s just like, almost like the spinner. Probably let’s see, I’m curious.
Now, if it’s really fast website, like if I did the title, it would get this title. Okay. Because that’s like an item that they’re instantly, but any kind of data that thing’s got a load. And that’ll take a little bit of time, so you click it. It’s going to load it. So you gotta do something to wait. So an easy one and the best one that I had, the one I had most luck with wave or selector, and you just put it right in there.
Waiting for a selector is almost always the best. There’s a bunch of other ways for us. You can go wait, page, wait for navigation. This never works as well as you want. It just doesn’t you spot. There’s all these things you can put in there. It never works as well. Now you could do wait for requests. That’s kind of tricky.
You can make sure this request is completed also kind of hard. Sandy Lewis’ response, timeout, or wait for a C there’s a wait for time. That was where you can pass a hard time. That’s just. We’ll make your thing slower, because what happens if you say, wait for time out of five seconds and you paid loads in three seconds, you just lost two seconds every time.
So waivers selector is best. If you can pull it off, sometimes it’s tricky, but let’s try that with wait for a selector and see if we can actually get this thing to work.
Bam. There we go. Cool. There we go. That is it. I wanted to tell the difference between. Before a page I go to and page.click. Okay. Did you do okay. That’s all for today. Thank you.