Current section: Authenticated End-to-End 3 exercises

Intro to Auth E2E

Loading lesson


00:00 So now we want to do the authenticated end-to-end test. This is actually easier than it used to be. So most of our apps, when you've got a login, a lot of the logic that really matters is it requires a logged-in user.

00:17 And so what your job is is to make the browser that Playwright is running have the same sort of setup that an authenticated user would have. So in our application, we have cookies. When I was working at PayPal, we had, I don't know, maybe 10 cookies. And I had to figure out which one of those

00:36 applied to authentication and simulate that same sort of thing in the test environment. So that's what you're going to be doing in this one. Luckily, we only need one cookie. And we have awesome tools now. And so we can actually use our source code for generating that cookie, along with a couple other nice utilities.

00:55 And then once you generate the cookie, then you can add cookies to the browser context. This browser context comes from page.context. So you're going to be using that to create a cookie config. And then you can set or add that cookie to the browser context. And yeah, you'll be ready to roll.

01:13 The reason we're doing this, or a more naive way to do this, would be to say, how about we just take our onboarding or our login test. And we'll stick that in a function. And then we just call that function everywhere we need a logged in user. And you could totally do that. It would work.

01:31 The big problem with that is, well, there are two big problems with that. For one, however long it takes to do that login process, you've just added that to every single one of your authenticated tests. So whether it's 500 milliseconds or two seconds, that's unnecessary.

01:48 And so it's just going to add to the length of time it takes to run your test. And then secondly, it's just if there is a problem in the login process, all of your tests are going to fail. And that can be overwhelming and can be difficult to identify the actual problem.

02:07 And so you want to just keep those concepts a little more isolated. This is what I always do. I'll have a set of tests that are just dedicated to authentication related stuff. And then all of my other tests will just sort of mock that out a little bit using this method that we're going to demonstrate here.

02:27 We also have two-factor authentication. And the test that you're going to be working in in this exercise is the enable two-factor auth flow and make sure that that actually does work. We're not actually going to have an official exercise step for that because there's no new learning outcomes there from what you've already gone through and everything.

02:47 But I do welcome you to actually finish the test if you'd like to because this is actually a really pretty short exercise. So if you've got some extra time, that would be a fun one to test out, to write yourself if you would like to. And you can always check the diff

03:06 to see if anything actually, or if you're getting it quite right. Or at least compare. It's not necessarily right. There are multiple ways to do this stuff. So I think that's everything that you need to get going and be successful with this. So have a good time writing your first authenticated end-to-end test.