Merge pull request #75 from uktrade/feat/use-cypress-config-for-resol…

…ution Use cypress config for resolution
haim-io · Mar 21, 2022 · d6a7ece · d6a7ece
2 parents b163838 + 25cb10c
commit d6a7ece
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 8 deletions.
diff --git a/Dockerfile b/Dockerfile
@@ -3,7 +3,7 @@ FROM node:14.17.0
 ENV NPM_CONFIG_LOGLEVEL    warn
 ENV NPM_CONFIG_UNSAFE_PERM true
 ENV TERM                   xterm
-ENV CHROME_VERSION         86.0.4240.75-1
+ENV CHROME_VERSION         99.0.4844.82-1
 
 RUN apt-get update
 

diff --git a/README.md b/README.md
@@ -112,11 +112,13 @@ Folder structure is hard coded (see below). There will be enhancements coming in
 
 ### Force resolution size
 
-In order to force the screenshot resolution when running a test you will need to set the following environment variables:
+In order to force the screenshot resolution when running a test you will need to set the following cypress config values in `cypress.json`:
 
 ```js
-export HEIGHT=1980 // Default is set to 1440
-export WIDTH=2240 // Default is set to 1980
+{
+  "viewportWidth": 1000, // Default value: 1280
+  "viewportHeight": 660 // Default value: 720
+}
 ```
 
 ### Please notice

diff --git a/cypress.json b/cypress.json
@@ -3,5 +3,7 @@
   "pluginsFile": "cypress/plugins/index.js",
   "supportFile": "cypress/support/index.js",
   "defaultCommandTimeout": 20000,
-  "requestTimeout": 20000
+  "requestTimeout": 20000,
+  "viewportWidth": 1280,
+  "viewportHeight": 720
 }
diff --git a/src/plugin.js b/src/plugin.js
@@ -100,7 +100,7 @@ async function compareSnapshotsPlugin(args) {
   return percentage
 }
 
-const getCompareSnapshotsPlugin = on => {
+const getCompareSnapshotsPlugin = (on, config) => {
   // Create folder structure
   setupFolders()
 
@@ -109,8 +109,9 @@ const getCompareSnapshotsPlugin = on => {
 
   // Force screenshot resolution to keep consistency of test runs across machines
   on('before:browser:launch', (browser, launchOptions) => {
-    const width = process.env.WIDTH || '1280'
-    const height = process.env.HEIGHT || '720'
+    const width = config.viewportWidth || '1280'
+    const height = config.viewportHeight || '720'
+
     if (browser.name === 'chrome') {
       launchOptions.args.push(`--window-size=${width},${height}`)
       launchOptions.args.push('--force-device-scale-factor=1')