Local and Session Storage, Cookies | Bondar Academy
Course: Mastering testRigor
Module: Advanced Tricks and Techniques
Instructor: Artem Bondar
Lesson Summary
In this lesson, we explore how to interact with browser session storage , local storage , and cookies using Test Trigger to optimize test execution. Key Concepts Test Application: The lesson uses the Conduit QA app to demonstrate the process. Login Process: When logging in, a JWT token is stored in the browser's local storage, allowing the user to bypass repeated logins. Steps to Optimize Test Execution Log into the application and observe the storage values. Use a reusable rule to obtain the access token . Save the access token in local storage under the name JWT token . Utilize the set item method to store the token. Reload the browser to apply changes. Example Code setItem("JWT token", storedValue.accessToken); By implementing these steps, the test execution time decreased from 7 seconds to 4 seconds, demonstrating significant optimization. Conclusion In summary, we performed programmatic authentication by saving the access token in local storage. Remember to reload the browser after making changes to ensure they take effect. For further information, refer to the Test Trigger documentation for additional prompts related to cookies and storage management.
Video Transcript
In this lesson, we're going to talk about how to interact with the browser session storage, local storage, and cookies using Test Trigger. And that way, how you can optimize your test a little bit. So let's get into it. So this is our test application and Conduit QA app that we were using before. If I go back over here to create article or delete the articles, we have to be as the logged in user. But you wonder what is actually happening when you enter your username and password and log into application. So let me show you that. So I click on my user and I log out. Click log out. Then I go to inspect, right click, click on the application. And here on the left, we have information about the local storage, session storage, and cookies for the application. If I expand it right now, we see that URL for the application in the local storage and session storage, and we have some cookie values related, but nothing in the local storage and session storage. So if I log into application back again, sign in, enter my email. So it's in the settings, authentication. This is email and password. Welcome, sign in. And you can see that now we have a new value showed up in the browser local storage. So the key is JWT token and the token value is saved in the local storage. So that way browser is authorized to perform operation as this logged in user. And we can technically bypass the step of logging into our application every time if we just save the token value into the browser local storage. And that way, every time we run the test, we don't need to enter username and password. For our test, our browser will be automatically authorized. And let me show you how to do that using test trigger. So going back to our test and I create a new test. So test cases, new test, and I'll call it programmatic login. To perform the programmatic login, we will need the value of the token. Let me close this real quick. And for that, we created a reusable rules. So here is login to application. This is the entire flow. And this is just a reusable rule to get access token. So by calling this rule, we will generate new access token that we can save later in the browser local storage. So I just call this method. So let me open a new tab. And get access token. All right. And after that, we need to save the value of the access token, which is access token, which is this one, into the browser local storage under the name JWT token. Exactly how it is right now in the browser. So how to do that? Here in the test trigger documentation, you can find different prompts with examples, how to interact with the cookies, local storage, or session storage. We are looking for to interact with the local storage, which is this one. So Hugo, we need this set item in local storage as item name. Going back to the test and copy here. And now we need to update just these values in double quotes. So set item, we want to set the value of the token that we received from get access token. And we want to get it from stored value. And the value is access token. And I'll take this value and paste it here. So set item from stored value access token in local storage as, and we need to save it as that JWT token. Exactly how our application is working. So JWT token. And that's pretty much it. And after we perform this operation and set the value in the browser, we need to refresh or reload the browser for these changes to take effect and be applied for the user session. And we need to call command reload. And that's pretty much it. So let's quickly run this test to see if it is working. All right. And test pass successfully. Here we go. This is the view of the screen when the user is not logged in. Then we set the item access token as JWT token, made a reload, and here we go. Our user is authorized. And also the execution became faster because we skipped this step of logging into the application. So if you can see the test run for this particular flow took four seconds only. While when we were using the normal logging flow with entering username and password, clicking login button, it took seven seconds to perform exactly the same expected result. So this is how you can use the local storage or session storage to save the user session or any other information about the user to optimize the test execution. And here in the test rigor documentation, you can use other prompts related to working with browser cookies, local storage. You can read the items from the session storage. You can clear the storage or get the item from the local storage. And the same way you would work with the cookies, for example, if the session of your user driven by the cookies, you can save those value into the cookies using this prompt. So pretty straightforward process, but can boost your test a lot. All right, so that's it. Let's quickly summarize what we did in this lesson. We perform programmatic authentication to our test application. We got access token, and then we saved this access token into the browser local storage as a JWT token. When you perform operation with local storage session storage, you need to reload your browser to make sure that changes that you made to the browser made effect. All right, that's it guys. And see you in the next lesson.