From 0a288dde154651648a8b4d9181acd7a9650bb46f Mon Sep 17 00:00:00 2001
From: helena <48861601+helenanull@users.noreply.github.com>
Date: Sat, 3 Apr 2021 19:46:53 +0300
Subject: [PATCH] Update README.md

---
 README.md | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/README.md b/README.md
index e014ce2..2cc75f0 100644
--- a/README.md
+++ b/README.md
@@ -42,6 +42,10 @@ Config files:
 1. `cypress.json` - Main config file where default behavior of Cypress can be modified. [More info](https://docs.cypress.io/guides/references/configuration#cypress-json)
 2. `plugins/index.js` - Plugins file is where we can programmatically alter the resolved configuration [More info](https://docs.cypress.io/guides/tooling/plugins-guide#Use-Cases)
 
+This test suite is supporting multiple viewports (mobile and desktop). 
+
+One solution is to use [cy.viewport()](https://docs.cypress.io/api/commands/viewport) command inside the test, to change the viewports, but very often websites also check user agent to get the device information(and show the mobile view). Since user agent is something [we can't change in the middle of the test](https://github.com/cypress-io/cypress/issues/2100), we need to pass config value when launching tests. In `cypress.json` we have a `device` parameter and in plugins file `index.js`, we decide viewports and user agent parameter values based on device value.
+
 ## :grey_question: Q&A
 1. Why keep selectors separately (not hard-coded to tests)
     - **tests are much more readable** - css selectors are by design hard to read - even if we add data-test attributes. We might need 2nd child or want to verify that selector is a child for another element, like `.class2 > ul:nth-child(2)` (alternative `get().find()` or `get().parent()` is bad practice because of [this](https://docs.cypress.io/guides/core-concepts/retry-ability.html#Only-the-last-command-is-retried) )