Integration Tests for Logout

[00:00:00]
>> Mike North: Currently I can see I'm logged in, let me just refresh. Looks like that's firmly in local storage, I should click log out. And it's gone from local storage. I am not logged in anymore and if I try to hit the back button to go like, that was the team's page there or if I try to go to like slash Teams.

[00:00:23]
I just keep seeing this login screen, right? And it's not like it's just rendering the lot the login screen for that URL. I'm actually redirected. Log back in, sign in and now I can refresh all I want and I remain logged in. And there's my local storage. So there you go, we've got some state that's saved in local storage and we have guarded our routes.

[00:00:47]
We've got login, logout. And it's pretty easy to see how these actions with the on modifier can wire things up and there's not a lot of ceremony involved with getting the right things, triggering the right responses. Let's check our tests to make sure they are still looking good.

[00:01:11]
>> Mike North: I left a paused test in there, oops. That's okay, that's how you know that this is the real deal. We have await pause test. Okay, having removed that and from our logout test, that erroneous line, we can see that things are not happy. And forecasts are failing, so the sidebar's failing.

[00:01:37]
This to me as an ember aficionado, I can tell you this looks a lot like we have our initially generated test that ember gave us and we've put stuff in this component and it's no longer empty. So that's not gonna be an interesting one to fix. I'm gonna worry most about this acceptance test so I can click rerun, now we're only looking at this one test here.

[00:02:03]
So let's look at the title that we left ourselves. It is a test for logging out visiting teams, clicking logout so that should in fact log you out. And it looks like we expected to land on teams and instead we found ourselves at the login page. To me, this looks like we've been redirected, right?

[00:02:29]
The test started, we were not authenticated, we tried to go to teams and we could never reach there, we were kicked out. So we can use our stub service for this, thank goodness we put this in place. All we need to do is set ourselves up at the beginning of this test with a user ID.

[00:02:46]
Does everyone understand why it has this failing now though? We've been kicked out. This feature we added has appropriately said there is no current user for you. So here we go, this owner, look up. So we're grabbing the service. This is our instance of the service and we can just say current user ID is 1.

[00:03:16]
>> Mike North: And now what's going on here? Undefined is not a valid call back. Okay, I can tell you what this is too. So what's changed about our auth service recently?
>> Student: We added a function, log out.
>> Mike North: We added this log out action, and our stub service has this or doesn't?

[00:03:38]
Doesn't, so we've tried, we've swapped out the service, we're using that in our tests. And it's saying okay, on modifier when the logout buttons click, it's this dot off, dot log out, and that's undefined. So the on modifier can't even set itself up properly. Let's go take care of it.

[00:04:03]
>> Mike North: So here, someone help me out, how would I implement log out with the stub service?
>> Student: User ID to null.
>> Mike North: Works for me.
>> Mike North: And we're gonna use the action decorator to make sure that it gets bound properly.
>> Mike North: Now we're down to one, what's going on?

[00:04:33]
Visiting teams, clicking logout, that failed.
>> Student2: Do you want to transition back to login?
>> Mike North: Pardon?
>> Student3: You were checking that it went to the URL, but it got redirected?
>> Mike North: Checking that it went to the URL, but it got redirected.
>> Student4: You failed later on the test.

[00:04:50]
>> Mike North: Later on I expected login, got it. And I should still be at teams.
>> Student2: Because in your mark, you didn't redirect.
>> Mike North: Thank you, good catch. So we need to add that to log out. That's the best way to do this, right? Rather than insert it into the test.

[00:05:16]
>> Mike North: Now we're good to go.
>> Student3: Why didn't you use the action decorator on the other method above on the user ID?
>> Mike North: Good question. Why didn't I use an action decorator here. Under what circumstances should I use an action decorator?
>> Student3: Calling it from the template.
>> Mike North: Yes, and it turns out this particular method is never called from a template.

[00:05:38]
It is called from log in forum here.
>> Student4: Is there any harm from adding the action decorator to that method in case you might call for the template later on?
>> Mike North: It's unnecessary and I would say like, mild harm in that you're sending a signal to your fellow developers that this is a template consumed function.

[00:06:04]
Also if for some strange reason you depended on this being something very specific that's not the class. It's like mega convoluted, but I would just generally say it's not necessary and it would kinda be in the same realm as like we don't wrap everything in promises just in case they might one day be a sync.

[00:06:32]
Same deal here, you wanna use code with intent. I would definitely not put it on absolutely everything cuz effectively what this is doing is, it's creating a bound version of the method on each instants of the component or on each instance of the service. So it marginally increases the cost, the memory footprint of each instance.

[00:06:53]
But that's the only way that we can make sure that like these functions are properly handled.