protractor-image-comparison - npm Package Compare versions

Comparing version 0.1.1 to 0.1.2

CHANGELOG.md

@@ -0,1 +1,16 @@
+<a name="0.1.2"></a>
+## [0.1.2](https://github.com/wswebcreation/protractor-image-comparison/compare/v0.1.1...v0.1.2) (2016-11-21)
+
+
+### Bug Fixes
+
+* **_getIOSPosition:** remove app specific implementation ([62295a1](https://github.com/wswebcreation/protractor-image-comparison/commit/62295a1))
+* **baseline:** replace baselineimages for resizeDimensions ([ee82ee7](https://github.com/wswebcreation/protractor-image-comparison/commit/ee82ee7))
+* **basline:** replace baseline images for resizeDimensions ([04e1399](https://github.com/wswebcreation/protractor-image-comparison/commit/04e1399))
+* **dependencies:** set hard devdependencies ([d38fff8](https://github.com/wswebcreation/protractor-image-comparison/commit/d38fff8))
+* **nativeWebScreenshot:** fix nativeWebScreenshot only overrule if value is false ([94e0636](https://github.com/wswebcreation/protractor-image-comparison/commit/94e0636))
+* **resizeDimensions:** fix false statement ([f3d819e](https://github.com/wswebcreation/protractor-image-comparison/commit/f3d819e))
+
+
+
 <a name="0.1.1"></a>
@@ -2,0 +17,0 @@ ## [0.1.1](https://github.com/wswebcreation/protractor-image-comparison/compare/v0.1.0...v0.1.1) (2016-11-10)

docs/appium.md

@@ -39,4 +39,10 @@ Appium
 ### Javascript
-When the scroll is automated with a Javascript scroll `browser.executeScript('arguments[0].scrollIntoView();', element(by.css('div h1')).getWebElement());` the view is scrolled, but the addressbar AND the toolbar **ARE NOT INFLUENCED** BY THIS BEHAVIOUR.
+When the scroll is automated with a Javascript scroll 
 
+```js
+browser.executeScript('arguments[0].scrollIntoView();', element(by.css('div h1')).getWebElement());
+``` 
+
+the view is scrolled, but the addressbar AND the toolbar **ARE NOT INFLUENCED** BY THIS BEHAVIOUR.
+
 ## Capabilities iOS
@@ -55,3 +61,3 @@
 ## Browser
-Appium can **ONLY** automate **Chrome** on Android. The stockbrowser **CAN"T** be used. When an Emulator is used Chrome is only default provided from Android > 7.0.
+When an Emulator is used Chrome is only default provided from Android > 7.0.
 If an older version of Android needs to be used, Chrome needs to be installed manually. 
@@ -62,3 +68,3 @@
 
-* Download a Chrome APK from (APKMirror)[http://www.apkmirror.com/apk/google-inc/chrome/], check which processor is used in the Emulator (ARM or X86, X86 is faster).
+* Download a Chrome APK from [APKMirror](http://www.apkmirror.com/apk/google-inc/chrome/), check which processor is used in the Emulator (ARM or X86, X86 is faster).
 * Open the Emulator
@@ -65,0 +71,0 @@ * Install the `chrome.apk` from the folder where it is saved with the following command `adb install chrome.apk`.

docs/examples.md

 Examples
 ========
+##Configuration file setup:
+Load it from the configuration file of *protractor*
 
-**Jasmine Example:**
-```javascript
+```js
+exports.config = {
+   // your config here ...
+
+    onPrepare: function() {
+        const protractorImageComparison = require('protractor-image-comparison');
+        browser. protractorImageComparison = new protractorImageComparison(
+            {
+                basePath: 'path/to/baseline/',
+                diffPath: 'path/to/diff/'
+            }
+        );
+    },
+}
+```
+
+##Jasmine Example:
+Load it in a *spec* file
+
+```js
 const protractorImageComparison = require('protractor-image-comparison');
@@ -38,4 +58,6 @@
 
-**Cucumber Example:**
-```javascript
+##Cucumber Example:
+Load it in a *step* file
+
+```js
 const expect = require('chai').expect,
@@ -42,0 +64,0 @@ protractorImageComparison = require('protractor-image-comparison');

index.js

@@ -22,4 +22,4 @@ 'use strict';
  * @param {boolean} options.blockOutStatusBar  If the statusbar on mobile / tablet needs to blocked out by default
- * @param {object} androidOffsets Object that will hold new values for the statusBar, addressBar and toolBar
- * @param {object} iosOffsets Object that will hold the new values for the statusBar and addressBar
+ * @param {object} options.androidOffsets Object that will hold custom values for the statusBar, addressBar and toolBar
+ * @param {object} options.iosOffsets Object that will hold the custom values for the statusBar and addressBar
  *
@@ -42,3 +42,3 @@ * @property {string} actualFolder Path where the actual screenshots are saved
         this.baseFolder = path.normalize(options.screenshotPath);
-        this.formatString = options.formatImageName || '{tag}-{browserName}-{width}x{height}';
+        this.formatString = options.formatImageName || '{tag}-{browserName}-{width}x{height}-dpr-{dpr}';
 
@@ -140,3 +140,3 @@ this.nativeWebScreenshot = options.nativeWebScreenshot ? true : false;
                     console.log('\n WARNING: The y-coordinate may not be negative. No height resizing of the element has been executed\n');
-                } else if (((y - this.resizeDimensions) + height + 2 * this.resizeDimensions) > this.width) {
+                } else if (((y - this.resizeDimensions) + height + 2 * this.resizeDimensions) > this.height) {
                     console.log('\n WARNING: The new coordinate may not be outside the screen. No height resizing of the element has been executed\n');
@@ -313,3 +313,6 @@ } else {
                 this.deviceName = browserConfig.capabilities.deviceName ? browserConfig.capabilities.deviceName.toLowerCase() : '';
-                this.nativeWebScreenshot = browserConfig.capabilities.nativeWebScreenshot ? true : false;
+                // this.nativeWebScreenshot of the constructor can be overruled by the capabilities when the constructor value is false
+                if(!this.nativeWebScreenshot){
+                    this.nativeWebScreenshot = browserConfig.capabilities.nativeWebScreenshot ? true : false;
+                }
 
@@ -335,12 +338,8 @@ // Retrieving height / width is different for desktop and mobile
      * device screenshot including:
-     * - statusbar (given default height = 20px) !IMPORTANT The statusbar is visible in the app, but it doesn't effect the
-     *   webview height. Checked this with team native
-     *   @todo For the iPhone an extra margin needs to be added to the body to make sure the element is below the statusbar
-     *   somehow this doesn't always work for the iPad. That's why it it not done for the iPad. If this gives errors on more
-     *   projects this needs to be investigated. For now (2016-080-2) it works
-     * - navbar (can variate in height in Safari. In Safari is can be max 44px but after scroll it will be smaller. Because
+     * - statusbar (given default height = 20px)
+     * - addressbar (can variate in height in Safari. In Safari is can be max 44px but after scroll it will be smaller. Because
      *   through automation a scrollIntoView is done the navigationbar an button bar are not influenced. A physical scroll
      *   will influence the heights.  The app doesn't has a navbar)
-     * - the view
-     * - buttonbar (this buttonbar is only visible when the page is not scrolled, it is not visible in the app, by default
+     * - the viewpot
+     * - toolbar (this buttonbar is only visible when the page is not scrolled, it is not visible in the app, by default
      *   it is 44px, not used for determining the position of the element and not present on an iPad)
@@ -353,5 +352,3 @@ * @param {Promise} element The ElementFinder that is used to get the position
         function getDataObject(element, addressBar, statusBar) {
-            var
-                divePixelRatio = window.devicePixelRatio,
-                screenHeight = window.screen.height,
+            var screenHeight = window.screen.height,
                 screenWidth = window.screen.width,
@@ -361,4 +358,2 @@ windowInnerHeight = window.innerHeight,
                 rotatedScreenHeight = screenHeight > screenWidth ? screenWidth : screenHeight,
-                userAgent = window.navigator.userAgent.toLocaleLowerCase(),
-                isIPhone = /iphone/.test(userAgent),
                 elementPosition,
@@ -369,6 +364,2 @@ y;
                 /* the app */
-                /* the statusbar is transparent and over the webview, so add a margin to the body to be sure it on the right position, only for iPhone */
-                if (isIPhone) {
-                    document.body.style.marginTop = divePixelRatio * statusBar + 'px';
-                }
                 elementPosition = element.getBoundingClientRect();
@@ -466,4 +457,10 @@ y = elementPosition.top;
      * @method checkElement
+     *
      * @example
-     *     browser.protractorImageComparison.checkElement(element(By.id('elementId')), 'imageA'});
+     * // default usage
+     * browser.protractorImageComparison.checkElement(element(By.id('elementId')), 'imageA');
+     * // blockout example
+     * browser.protractorImageComparison.checkElement(element(By.id('elementId')), 'imageA', {blockOut: [{x: 10, y: 132, width: 100, height: 50}]});
+     * // Add 15 px to top, right, bottom and left when the cut is calculated (it will automatically use the DPR)
+     * browser.protractorImageComparison.saveElement(element(By.id('elementId')), 'imageA', {resizeDimensions: 15});
      *
@@ -473,2 +470,4 @@ * @param {Promise} element The ElementFinder that is used to get the position
      * @param {object} options non-default options
+     * @param {object} options.blockOut blockout with x, y, width and height values
+     * @param {int} options.resizeDimensions the value to increase the size of the element that needs to be saved
      * @return {Promise} When the promise is resolved it will return the percentage of the difference
@@ -505,7 +504,15 @@ * @public
      * @method checkScreen
+     *
      * @example
-     *     browser.protractorImageComparison.checkScreen('imageA');
+     * // default
+     * browser.protractorImageComparison.checkScreen('imageA');
+     * // Blockout the statusbar
+     * browser.protractorImageComparison.checkScreen('imageA', {blockOutStatusBar: true});
+     * // Blockout a given region
+     * browser.protractorImageComparison.checkScreen('imageA', {blockOut: [{x: 10, y: 132, width: 100, height: 50}]});
      *
      * @param {string} tag The tag that is used
      * @param {object} options (non-default) options
+     * @param {boolean} options.blockOutStatusBar blockout the statusbar yes or no
+     * @param {object} options.blockOut blockout with x, y, width and height values, it will override the global
      * @return {Promise} When the promise is resolved it will return the percentage of the difference
@@ -527,3 +534,2 @@ * @public
                 if (this._isMobile() && blockOutStatusBar) {
-                    console.log('use blockout');
                     const statusBarHeight = this._isAndroid() ? this.androidOffsets.statusBar : this.iosOffsets.statusBar,
@@ -557,4 +563,8 @@ statusBarBlockOut = this._multiplyObjectValuesAgainstDPR({
      * @method saveElement
+     *
      * @example
-     *     browser.protractorImageComparison.saveElement(element(By.id('elementId')), 'imageA');
+     * // Default
+     * browser.protractorImageComparison.saveElement(element(By.id('elementId')), 'imageA');
+     * // Add 15 px to top, right, bottom and left when the cut is calculated (it will automatically use the DPR)
+     * browser.protractorImageComparison.saveElement(element(By.id('elementId')), 'imageA', {resizeDimensions: 15});
      *
@@ -564,2 +574,3 @@ * @param {Promise} element The ElementFinder that is used to get the position
      * @param {object} options (non-default) options
+     * @param {int} options.resizeDimensions the value to increase the size of the element that needs to be saved
      * @returns {Promise} The images has been saved when the promise is resolved
@@ -597,4 +608,5 @@ * @public
      * @method saveScreen
+     *
      * @example
-     *     browser.protractorImageComparison.saveScreen('imageA');
+     * browser.protractorImageComparison.saveScreen('imageA');
      *
@@ -601,0 +613,0 @@ * @param {string} tag The tag that is used

package.json

 {
   "name": "protractor-image-comparison",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "description": "npm-module to compare images with protractor",
@@ -8,2 +8,3 @@ "main": "index.js",
     "changelog": "node ./test/changelog.js",
+    "docs": "jsdoc2md ./index.js > ./docs/index.md",
     "test": "node ./test/cli image-comparison",
@@ -37,10 +38,11 @@ "wd-update": "node_modules/.bin/webdriver-manager update"
   "devDependencies": {
-    "chalk": "^1.1.3",
-    "commander": "^2.9.0",
-    "conventional-changelog": "^1.1.0",
-    "ghooks": "^1.3.2",
-    "jasmine-spec-reporter": "^2.7.0",
-    "protractor": "^4.0.10",
-    "validate-commit-msg": "^2.8.2",
-    "wd": "^1.0.0",
+    "chalk": "1.1.3",
+    "commander": "2.9.0",
+    "conventional-changelog": "1.1.0",
+    "ghooks": "1.3.2",
+    "jasmine-spec-reporter": "2.7.0",
+    "jsdoc-to-markdown": "^2.0.1",
+    "protractor": "4.0.10",
+    "validate-commit-msg": "2.8.2",
+    "wd": "1.0.0",
     "wd-bridge": "0.0.2"
@@ -57,2 +59,2 @@ },
   }
-}
+}

README.md

 protractor-image-comparison
 ==========
 
-A lightweight protractor plugin for image comparison.
-
 [![dependencies Status](https://david-dm.org/wswebcreation/protractor-image-comparison/status.svg)](https://david-dm.org/wswebcreation/protractor-image-comparison) [![Build Status](https://travis-ci.org/wswebcreation/protractor-image-comparison.svg?branch=master)](https://travis-ci.org/wswebcreation/protractor-image-comparison) [![Sauce Test Status](https://saucelabs.com/buildstatus/wswebcreation-nl)](https://saucelabs.com/u/wswebcreation-nl)
@@ -12,4 +10,18 @@
 
+##What can it do?
+*protractor-image-comparison* is a lightweight *protractor* plugin for browsers / mobile browsers / hybrid apps to do image comparison on screens or elements.
+
+You can:
+
+- compare screens / elements against a baseline
+- blockout custom regions during comparison (all)
+- increase the element dimenisions screenshots (all)
+- provide custom iOS and Android offsets for status-/address-/toolbar (mobile only)
+- automatically exclude a statusbar during screencomparison (mobile only)
+
+Comparison is based on [ResembleJS](https://github.com/Huddle/Resemble.js).
+
 ##Installation
 Install this module locally with the following command:
+
 ```shell
@@ -20,2 +32,3 @@ npm install protractor-image-comparison
 Save to dependencies or dev-dependencies:
+
 ```shell
@@ -27,6 +40,7 @@ npm install --save protractor-image-comparison
 ##Usage
-protractor-image-comparison can be used for:
+*protractor-image-comparison* can be used for:
 
 - desktop browsers (Chrome / Firefox / Safari / Internet Explorer 11 / Microsoft Edge)
-- mobile / tablet browsers (Chrome / Safari on emulators / real devices) based on Appium
+- mobile / tablet browsers (Chrome / Safari on emulators / real devices) via Appium
+- Hybrid apps via Appium
 
@@ -41,139 +55,12 @@ For more information about mobile testing see the [Appium](./docs/appium.md) documentation.
 The comparison methods return a result in percentages like `0` or `3.94`.
-*protractor-image-comparison* can work with Jasmine and Cucumber.js. See [Examples](./docs/examples.md) for the Jasmine and CucumberJS implementation.
+*protractor-image-comparison* can work with Jasmine and Cucumber.js. See [Examples](./docs/examples.md) for or a *protractor*-config setup, or a Jasmine or a CucumberJS implementation.
 
-###saveScreen or checkScreen 
-The methods `saveScreen` and `checkScreen` create a screenshot of the visible viewport. Be aware that there are different webdriver implementations in creating complete screenshots.
-For example:
+More information about the **methods** can be found [here](./docs/methods.md).
 
-- **screenshot of visible viewport:**
-    - Chrome
-    - Safari
-    - Firefox when geckodriver is used (as of version 48 and higher)
-    - Microsoft Edge
-- **screenshots of complete page**
-    - Firefox when firefoxdriver is used (verion 47 and lower)
-    - Internet Explorer (11 and lower)
-
-###saveElement or checkElement 
-Images are cropped from the complete screenshot by using the `saveElement` or `checkElement` function. 
-The method will calculate the correct dimensions based upon the webdriver element selector.
-
-###protractor-image-comparison Parameters:
-
-* `baselineFolder` Defines the path to the reference images that are to be compared.
-* `screenshotPath` Defines the path to where the "actual" captured images need to be saved.
-* `formatString` Naming format for images (default: `{tag}-{browserName}-{width}x{height}`), see **Conventions: image naming** for more info
-* `nativeWebScreenshot` *protractor-image-comparison* needs to calculate element position based on a native device screenshot(default: false), see the [Appium docs](./docs/appium.md) for more info.
-* `blockOutStatusBar` *protractor-image-comparison* can blockout the statusbar of a device by default when comparion screens. This means that for example the time in the statusbar won't cause a failure (default:false)
-* `androidOffsets` An object that will hold the pixels of the `statusBar`, `addressBar` and or the `toolBar`. The values are used to calculate the position of an element on a screen (for `saveElement` or `checkElement`). They are defaulted, but can be overridden. These values can be different per Android version. Look up the docs for developing for Android to see the values. If not provided the defaults will be used.
-* `iosOffsets` An object that will hold the pixels of the `statusBar` and or the `addressBar`. The values are used to calculate the position of an element on a screen (for `saveElement` or `checkElement`). They are defaulted, but can be overridden. These values can be different per iOS version. Look up the docs for developing for iOS to see the values. If not provided the defaults will be used.
-
-**For example:**
-
-`````
-browser.protractorImageComparison = new protractorImageComparison({
-	baselineFolder: './baseline/',
-	screenshotPath: './.tmp/',
-	nativeWebScreenshot: true,
-	blockOutStatusBar: true,
-	androidOffsets: {
-		statusBar: 50,
-		addressBar: 100,
-		toolBar: 60
-	},
-   iosOffsets: {
-		statusBar: 40,
-		addressBar: 100
-	}
-});
-`````
-
-###Method options:
-#### blockOut
-Sometimes, it is necessary to block-out some specific areas in an image that should be ignored for comparisons. For example, this can be IDs or even time-labels that change with the time. Adding block-outs to images may decrease false positives and therefore stabilizes these comparisons (see the [examples](./docs/examples.md)). 
-It can be used for `checkElement` and `checkScreen` and is an object or list of objects with coordinates that should be blocked before comparing. (default: none).
-
-**Keep in mind that the devicepixelratio on a browser / device influences the coordinates needed to create the blockout. Calculate the blockouts based on a screenshot (of an element) that already has been created, use for example Photoshop for this.** 
-
-#### resizeDimensions
-Sometimes it is needed that the cut of an image should be bigger then the element itself. Take for example the hover state. A kind of a box / halo can be presented around the element that is not placed within but outside the element. With `resizeDimensions` the size of the cut of the element image can be made bigger. `resizeDimensions` accepts an integer and the value need to represent pixels. Calculation against the devicepixelratio will be done by `protractor-image-comparison`
-For example:
-
-`````
-expect(browser.imageComparson.saveElement(element(by.css('#id')), 'tagName', {resizeDimensions: 15})).toEqual(0);
-// or
-expect(browser.imageComparson.checkElement(element(by.css('#id')), 'tagName', {resizeDimensions: 15})).toEqual(0);
-`````
-
-
 ## Conventions
-There are directory and naming conventions that must be met.
+See [conventions.md](./docs/conventions.md).
 
-###Directory structure**
-```text
-path
-└── to
-    └── screenshots
-        ├── diff
-        │   └── examplePage-chrome-1280x1024.png
-        ├── examplePage-chrome-800x600.png
-        ├── examplePage-chrome-1280x1024.png
-        ├── examplePageTitle-chrome-800x600.png
-        └── examplePageTitle-chrome-1280x1024.png
-```
-The `baselineFolder` directory must contain all the *approved* images. You may create subdirectories for better organisation, but the relative path should then be given in the test spec method. Failed comparisons generate a diff image under the **diff** folder.
+## Contribution
+See [CONTRIBUTING.md](./docs/CONTRIBUTING.md).
 
-### image naming
-Images should obey the following default format:
-
-`````
-{descriptionInCamelCase}-{browserName}-{browserWidth}x{browserHeight}.png
-`````
-
-The naming convention can be customized by passing the parameter `formatString` with a format string like:
-
-`````
-{browserName}_{tag}__{width}-{height}
-`````
-
-The following variables can be passed to format the string
-* `browserName` The browser name property from the capabilities
-* `deviceName` The deviceName from capabilities
-* `dpr` The device pixel ratio
-* `logName` The logName from capabilities
-* `mobile` This will add `_app`, of `browserName` after the deviceName to distingues app screenshots from browser screenshots
-* `name` The name from capabilities
-
-Images specified via name in the spec method will be selected according to the browsers current resolution. That is to say that multiple images can share the same name differentated by resolution.
-
-##Tests
-There are several test that need to be executed to be able to test the module:
-
-### Local
-- `npm t` or `npm t -- -e local`: Run all tests on a local machine on Chrome and Firefox (job uses direct connect, first run `npm run wd-update` to update the webdriver. This needs to be done once after install)
-
-### local on Appium
-**First make sure Appium v 1.5.3 or higher is installed**
-
-- `npm t -- -e android.adb`: Run all tests with Appium on an Android emulator with the ADB driver on Chrome (`appium --port 4728 --avd AVD_for_Nexus_5_by_Google`)
-- `npm t -- -e android.chromedriver`: Run all tests with Appium on an Android emulator with the ChromeDriver on Chrome (`appium --port 4727 --avd AVD_for_Nexus_5_by_Google`)
-- `npm t -- -e ios.simulator`: Run all tests with Appium on Apple iOS simulator on Safari (`appium --port 4726`)
-
-### Travis-ci with Sauce Labs
-- `npm t -- -e saucelabs`: This command is used to test the build through [Travis-ci](https://travis-ci.org/wswebcreation/protractor-image-comparison/). It will test against a lot of configurations that can be found [here](./test/conf/protractor.saucelabs.conf.js)
-
-### Perfecto (cloud services for real devices)
-**Make sure you have an account and create a `perfecto.config.json` file in the root of this project with a `user`, a `password`- and a `seleniumAddress` key! like this:**
-
-`````
-{
-  "password": "password",
-  "user": "username",
-  "seleniumAddress": "https://yourcloud.perfectomobile.com/nexperience/perfectomobile/wd/hub/"
-}
-`````
-
-- `npm t -- -e perfecto.android`: Run all tests on a real Android device on Chrome in the cloud (credentials are needed to be able to test this)
-- `npm t -- -e perfecto.ios`: Run all tests on a real Apple iOS device on Safari in the cloud (credentials are needed to be able to test this)
-
 ## Credits
@@ -184,3 +71,3 @@ - Basic logic of `index.js` based on [PixDiff](https://github.com/koola/pix-diff)
 ## TODO
-* Update documentation for Mobile and different webdriver implementation
+* Update documentation for Mobile
 * Update tests
@@ -187,0 +74,0 @@ * New (mobile friendly) testpage

test/conf/protractor.local.conf.js

@@ -23,10 +23,10 @@ let config = require('./protractor.shared.conf.js').config;
     },
-    // {
-    //     browserName: 'firefox',
-    //     logName: 'Firefox',
-    //     maxInstances: 10,
-    //     shardTestFiles: true
-    // }
+    {
+        browserName: 'firefox',
+        logName: 'Firefox',
+        maxInstances: 10,
+        shardTestFiles: true
+    }
 ];
 
 exports.config = config;

test/conf/protractor.shared.conf.js

 const SpecReporter = require('jasmine-spec-reporter');
 
 exports.config = {
-    baseUrl: 'http://example.wswebcreation.nl',
+    baseUrl: 'https://wswebcreation.github.io/protractor-image-comparison/',
     framework: 'jasmine2',
@@ -10,5 +10,3 @@ jasmineNodeOpts: {
         isVerbose: true,
-        includeStackTrace: true,
-        print: function () {
-        }
+        includeStackTrace: true
     },
@@ -15,0 +13,0 @@ onPrepare: function () {

test/jasmine.spec.js

@@ -24,14 +24,6 @@ 'use strict';
 
-    const browserName = browser.browserName.replace(/ /g, ''),
-        logName = camelCase(browser.logName),
-        dpr = {
-            "chrome": 1,
-            "firefox": 1,
-            "internetexplorer": 1,
-            "microsoftedge": 1,
-            "safari": 1
-        },
+    const logName = camelCase(browser.logName),
         resolution = '1366x768',
         dangerAlert = element(by.css('.uk-alert-danger')),
-        headerElement = element(by.css('h1.page-header'));
+        headerElement = element(by.css('h1.uk-heading-large'));
 
@@ -43,3 +35,3 @@ describe('basics', () => {
             browser.imageComparson.saveScreen(tagName)
-                .then(() => expect(fs.existsSync(`${screenshotPath}/${tagName}-${logName}-${resolution}-dpr-${dpr[browserName]}.png`)).toBe(true));
+                .then(() => expect(fs.existsSync(`${screenshotPath}/${tagName}-${logName}-${resolution}-dpr-1.png`)).toBe(true));
         });
@@ -51,3 +43,3 @@
             browser.imageComparson.saveElement(headerElement, tagName)
-                .then(() => expect(fs.existsSync(`${screenshotPath}/${tagName}-${logName}-${resolution}-dpr-${dpr[browserName]}.png`)).toBe(true));
+                .then(() => expect(fs.existsSync(`${screenshotPath}/${tagName}-${logName}-${resolution}-dpr-1.png`)).toBe(true));
         });
@@ -67,3 +59,3 @@ });
             browser.imageComparson.checkScreen(examplePageFail)
-                .then(() => expect(fs.existsSync(`${differencePath}/${examplePageFail}-${logName}-${resolution}-dpr-${dpr[browserName]}.png`)).toBe(true));
+                .then(() => expect(fs.existsSync(`${differencePath}/${examplePageFail}-${logName}-${resolution}-dpr-1.png`)).toBe(true));
         });
@@ -104,3 +96,3 @@
             browser.imageComparson.checkElement(dangerAlert, dangerAlertElementFail)
-                .then(() => expect(fs.existsSync(`${differencePath}/${dangerAlertElementFail}-${logName}-${resolution}-dpr-${dpr[browserName]}.png`)).toBe(true));
+                .then(() => expect(fs.existsSync(`${differencePath}/${dangerAlertElementFail}-${logName}-${resolution}-dpr-1.png`)).toBe(true));
         });
@@ -107,0 +99,0 @@

test/mobile.spec.js

@@ -35,3 +35,3 @@ 'use strict';
         dangerAlert = element(by.css('.uk-alert-danger')),
-        headerElement = element(by.css('h1.page-header'));
+        headerElement = element(by.css('h1.uk-heading-large'));
 
@@ -38,0 +38,0 @@ let ADBScreenshot;

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

8649791

increased by24.7%

Number of package files

127

increased by4.1%

Number of medium supply chain risk alerts

1

decreased by-50%

Worsened metrics

Dev dependency count

10

increased by11.11%

Lines of code

1620

decreased by-9.19%

Number of lines in readme file

71

decreased by-61.41%

No dependency changes