Testing web applications

Part I: Elements

Let’s try to workaround client-side validation in the browser. It is useful to know how to work with the Elements tab for a QA.

  1. Open this article.
  2. Turn off any AdBlock tool you use.
  3. Scroll down till the pop-up about the subscription or registration. If a pop-up doesn’t appear, scroll the other articles on the site.
  4. Inspect at any position of the page out of the pop-up message borders.
  5. Find and delete containers:
    • class="zephr-article-modal-modal zephr-generic-modal no-close";
    • class="zephr-ad-block-detected-backdrop zephr-backdrop";
    • class="zephr-ad-block-detected-modal zephr-generic-modal no-close";
  6. Scroll up and find body.
  7. Double click on class="zephr-modal-open zephr-article-modal-modal-open" on the body element.
  8. Delete class="zephr-modal-open zephr-article-modal-modal-open".

Attach the video of the successfully closed pop-up.

Part II: Console

The console tab helps developers and QAs work with the browser.

  1. Go to this article.
  2. There is a task. You have to find the reason why the second picture is not shown.
  3. Fix the bug, so that the second picture is shown.
  4. Report a bug using template in the document. Attach a link to the bug with the screenshot with fixed bug and logs.

Part III: Network

cURL is a tool for sending requests using Terminal. It could be used for bug reproducing when you need to send a certain request.
In this task, you can observe an example of the request sent from the Terminal which will create an article.

  1. Open a New Incognito Window.
  2. Go to conduit app.
  3. Open DevTools > Network.
  4. Sign in (or Sign Up) and Create an article.
  5. Find a request which is responsible for creating the article.
  6. Copy this request as cURL (right click on request > Copy > Copy as cURL).
  7. Paste the request to the Unix Terminal (or GitBash, but not Windows PowerShell) and press Enter.
  8. Check your account: one more article should be created.
  9. Paste copied cURL and link to the screenshot with two created articles to your homework.

Part IV: Application

  1. Open a New Incognito Window.
  2. Go to DemoQA app.
  3. Open DevTools > Application.
  4. Log in.
  5. Find the cookie that helped you to log in (there are 4 cookies).
    To find them all, delete cookies one by one and use the app simultaneously. If after deleting the cookie the app starts working wrong, this is one needed cookie.
  6. List these cookies in your homework.