Merge pull request #50 from bbc/NOTICKET/upgrade_nightwatch-v2

Rewrite captureElementScreenshot to use new API function from Nightwatch v2
bbc · Sep 16, 2022 · ed22b30 · ed22b30
2 parents 54c0d8b + 47b61c7
commit ed22b30
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 45 deletions.
diff --git a/README.md b/README.md
@@ -96,10 +96,10 @@ In order to use `nightwatch-vrt`, you only need to invoke the `screenshotIdentic
 
 ```JavaScript
 module.exports = {
-    'Test crunch.io main content is correct': (browser) => {
+    'Test Google UI loads correctly': (browser) => {
         browser
-            .url('https://crunch.io')
-            .assert.screenshotIdenticalToBaseline('.body.entry-content',  /* Optional */ 'custom-name', {threshold: 0.5}, 'VRT custom-name complete.')
+            .url('https://www.google.co.uk')
+            .assert.screenshotIdenticalToBaseline('body',  /* Optional */ 'custom-name', {threshold: 0.5}, 'VRT custom-name complete.')
             .end()
     }
 }

diff --git a/commands/captureElementScreenshot.js b/commands/captureElementScreenshot.js
@@ -28,49 +28,10 @@ CaptureElementScreenshot.prototype.command = function command(
     const api = this.client.api
 
     Promise.all([
-        promisifyCommand(api, 'getLocationInView', [selector]),
-        promisifyCommand(api, 'getElementSize', [selector]),
-        promisifyCommand(api, 'screenshot', [false])
-    ]).then(async ([location, size, screenshotEncoded]) => {
-
-        /*
-         * Here we get the pixel density of the window and 
-         * ensure that we adjust the width and height accordingly
-         */
-        await new Promise((resolve) => {
-            api.execute(function () {
-                return window.devicePixelRatio
-            }, [], function (devicePixelRatio) {
-                location.x *= devicePixelRatio.value
-                location.y *= devicePixelRatio.value
-                size.width *= devicePixelRatio.value
-                size.height *= devicePixelRatio.value
-                resolve()
-            })
-        })
-
-        if (size.width === 0 || size.height === 0) {
-            this.api.assert.fail(`The element identified by the selector <${selector}> is not visible or its dimensions equals 0. width: ${size.width}, height: ${size.height}`)
-        }
+        promisifyCommand(api, 'takeElementScreenshot', [selector])
+    ]).then(async ([screenshotEncoded]) => {
 
         Jimp.read(new Buffer(screenshotEncoded, 'base64')).then((screenshot) => {
-            /**
-             * https://www.w3.org/TR/webdriver/#take-screenshot
-             * "The Take Screenshot command takes a screenshot of the top-level browsing context’s viewport."
-             *
-             * If the target element extends outside of the viewport, the expected
-             * dimentions will exceed the actual dimensions, resulting in a
-             * "RangeError: out of range index" exception (from Buffer)
-             */
-            if ((location.y + size.height) > screenshot.bitmap.height) {
-                size.height = (screenshot.bitmap.height - location.y)
-            }
-
-            if ((location.x + size.width) > screenshot.bitmap.width) {
-                size.width = (screenshot.bitmap.width - location.x)
-            }
-
-            screenshot.crop(location.x, location.y, size.width, size.height)
             this.api.assert.ok(true, `The screenshot for selector <${selector}> was captured successfully.`);
 
             callback(screenshot)

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@bbc/nightwatch-vrt",
-    "version": "1.1.5",
+    "version": "2.0.0",
     "description": "Nightwatch Visual Regression Testing tools",
     "license": "MIT",
     "homepage": "https://github.com/bbc/nightwatch-vrt",