@percy/webdriver-utils 1.27.0-beta.0 → 1.27.0-beta.2

package/dist/driver.js

@@ -3,16 +3,23 @@ import Cache from './util/cache.js';
 const {
   request
 } = utils;
+const log = utils.logger('webdriver-utils:driver');
 export default class Driver {
-  constructor(sessionId, executorUrl) {
+  constructor(sessionId, executorUrl, passedCapabilities) {
     this.sessionId = sessionId;
     this.executorUrl = executorUrl.includes('@') ? `https://${executorUrl.split('@')[1]}` : executorUrl;
+    this.passedCapabilities = passedCapabilities;
   }
   async getCapabilites() {
     return await Cache.withCache(Cache.caps, this.sessionId, async () => {
-      const baseUrl = `${this.executorUrl}/session/${this.sessionId}`;
-      const caps = JSON.parse((await request(baseUrl)).body);
-      return caps.value;
+      try {
+        const baseUrl = `${this.executorUrl}/session/${this.sessionId}`;
+        const caps = JSON.parse((await request(baseUrl)).body);
+        return caps.value;
+      } catch (err) {
+        log.warn(`Falling back to legacy protocol, Error: ${err.message}`);
+        return this.passedCapabilities;
+      }
     });
   }
   async getWindowSize() {
@@ -26,6 +33,11 @@ export default class Driver {
     if (!command.constructor === Object || !(Object.keys(command).length === 2 && Object.keys(command).includes('script') && Object.keys(command).includes('args'))) {
       throw new Error('Please pass command as {script: "", args: []}');
     }
+    // browser_executor is custom BS executor script, if there is anything extra it breaks
+    // percy_automate_script is an anchor comment to identify percy automate scripts
+    if (!command.script.includes('browserstack_executor')) {
+      command.script = `/* percy_automate_script */ \n ${command.script}`;
+    }
     const options = {
       method: 'POST',
       headers: {

package/dist/index.js

@@ -30,11 +30,16 @@ export default class WebdriverUtils {
     this.buildInfo = buildInfo;
   }
   async automateScreenshot() {
-    this.log.info('Starting automate screenshot ...');
-    const automate = ProviderResolver.resolve(this.sessionId, this.commandExecutorUrl, this.capabilities, this.sessionCapabilites, this.clientInfo, this.environmentInfo, this.options, this.buildInfo);
-    this.log.debug('Resolved provider ...');
-    await automate.createDriver();
-    this.log.debug('Created driver ...');
-    return await automate.screenshot(this.snapshotName, this.options);
+    try {
+      this.log.info(`[${this.snapshotName}] : Starting automate screenshot ...`);
+      const automate = ProviderResolver.resolve(this.sessionId, this.commandExecutorUrl, this.capabilities, this.sessionCapabilites, this.clientInfo, this.environmentInfo, this.options, this.buildInfo);
+      this.log.debug(`[${this.snapshotName}] : Resolved provider ...`);
+      await automate.createDriver();
+      this.log.debug(`[${this.snapshotName}] : Created driver ...`);
+      return await automate.screenshot(this.snapshotName, this.options);
+    } catch (e) {
+      this.log.error(`[${this.snapshotName}] : Error - ${e.message}`);
+      this.log.error(`[${this.snapshotName}] : Error Log - ${e.toString()}`);
+    }
   }
 }

package/dist/metadata/desktopMetaData.js

@@ -1,24 +1,32 @@
+import Cache from '../util/cache.js';
 export default class DesktopMetaData {
   constructor(driver, opts) {
     this.driver = driver;
     this.capabilities = opts;
   }
+  device() {
+    return false;
+  }
   browserName() {
-    return this.capabilities.browserName.toLowerCase();
+    var _this$capabilities, _this$capabilities$br;
+    return (_this$capabilities = this.capabilities) === null || _this$capabilities === void 0 ? void 0 : (_this$capabilities$br = _this$capabilities.browserName) === null || _this$capabilities$br === void 0 ? void 0 : _this$capabilities$br.toLowerCase();
   }
   browserVersion() {
-    return this.capabilities.browserVersion.split('.')[0];
+    var _this$capabilities2, _this$capabilities2$b;
+    return (_this$capabilities2 = this.capabilities) === null || _this$capabilities2 === void 0 ? void 0 : (_this$capabilities2$b = _this$capabilities2.browserVersion) === null || _this$capabilities2$b === void 0 ? void 0 : _this$capabilities2$b.split('.')[0];
   }
   osName() {
-    let osName = this.capabilities.os;
-    if (osName) return osName.toLowerCase();
-    osName = this.capabilities.platform;
+    var _this$capabilities3, _osName, _this$capabilities4;
+    let osName = (_this$capabilities3 = this.capabilities) === null || _this$capabilities3 === void 0 ? void 0 : _this$capabilities3.os;
+    if (osName) return (_osName = osName) === null || _osName === void 0 ? void 0 : _osName.toLowerCase();
+    osName = (_this$capabilities4 = this.capabilities) === null || _this$capabilities4 === void 0 ? void 0 : _this$capabilities4.platform;
     return osName;
   }
 
   // showing major version
   osVersion() {
-    return this.capabilities.osVersion.toLowerCase();
+    var _this$capabilities5, _this$capabilities5$o;
+    return (_this$capabilities5 = this.capabilities) === null || _this$capabilities5 === void 0 ? void 0 : (_this$capabilities5$o = _this$capabilities5.osVersion) === null || _this$capabilities5$o === void 0 ? void 0 : _this$capabilities5$o.toLowerCase();
   }
 
   // combination of browserName + browserVersion + osVersion + osName
@@ -39,18 +47,22 @@ export default class DesktopMetaData {
     };
   }
   async screenResolution() {
-    const data = await this.driver.executeScript({
-      script: 'return [(window.screen.width * window.devicePixelRatio).toString(), (window.screen.height * window.devicePixelRatio).toString()];',
-      args: []
+    return await Cache.withCache(Cache.resolution, this.driver.sessionId, async () => {
+      const data = await this.driver.executeScript({
+        script: 'return [(window.screen.width * window.devicePixelRatio).toString(), (window.screen.height * window.devicePixelRatio).toString()];',
+        args: []
+      });
+      const screenInfo = data.value;
+      return `${screenInfo[0]} x ${screenInfo[1]}`;
     });
-    const screenInfo = data.value;
-    return `${screenInfo[0]} x ${screenInfo[1]}`;
   }
   async devicePixelRatio() {
-    const devicePixelRatio = await this.driver.executeScript({
-      script: 'return window.devicePixelRatio;',
-      args: []
+    return await Cache.withCache(Cache.dpr, this.driver.sessionId, async () => {
+      const devicePixelRatio = await this.driver.executeScript({
+        script: 'return window.devicePixelRatio;',
+        args: []
+      });
+      return devicePixelRatio.value;
     });
-    return devicePixelRatio.value;
   }
 }

package/dist/metadata/metaDataResolver.js

@@ -2,9 +2,10 @@ import DesktopMetaData from './desktopMetaData.js';
 import MobileMetaData from './mobileMetaData.js';
 export default class MetaDataResolver {
   static resolve(driver, capabilities, opts) {
+    var _capabilities$platfor, _capabilities$device, _capabilities$device$;
     if (!driver) throw new Error('Please pass a Driver object');
     const platform = opts.platformName || opts.platform;
-    if (['ios', 'android'].includes(platform.toLowerCase())) {
+    if (['ios', 'android'].includes(platform.toLowerCase()) || ['ios', 'android'].includes(capabilities === null || capabilities === void 0 ? void 0 : (_capabilities$platfor = capabilities.platformName) === null || _capabilities$platfor === void 0 ? void 0 : _capabilities$platfor.toLowerCase()) || ['ipad', 'iphone'].includes(capabilities === null || capabilities === void 0 ? void 0 : (_capabilities$device = capabilities.device) === null || _capabilities$device === void 0 ? void 0 : (_capabilities$device$ = _capabilities$device.toString()) === null || _capabilities$device$ === void 0 ? void 0 : _capabilities$device$.toLowerCase())) {
       return new MobileMetaData(driver, capabilities);
     } else {
       return new DesktopMetaData(driver, capabilities);

package/dist/metadata/mobileMetaData.js

@@ -1,34 +1,44 @@
+import Cache from '../util/cache.js';
+// Todo: Implement a base metadata for the common functions.
 export default class MobileMetaData {
   constructor(driver, opts) {
     this.driver = driver;
     this.capabilities = opts;
   }
+  device() {
+    return true;
+  }
   browserName() {
-    return this.capabilities.browserName.toLowerCase();
+    var _this$capabilities, _this$capabilities$br;
+    return (_this$capabilities = this.capabilities) === null || _this$capabilities === void 0 ? void 0 : (_this$capabilities$br = _this$capabilities.browserName) === null || _this$capabilities$br === void 0 ? void 0 : _this$capabilities$br.toLowerCase();
   }
   browserVersion() {
-    var _this$capabilities$br;
-    const bsVersion = (_this$capabilities$br = this.capabilities.browserVersion) === null || _this$capabilities$br === void 0 ? void 0 : _this$capabilities$br.split('.');
+    var _this$capabilities$br2, _this$capabilities2, _this$capabilities2$v;
+    const bsVersion = (_this$capabilities$br2 = this.capabilities.browserVersion) === null || _this$capabilities$br2 === void 0 ? void 0 : _this$capabilities$br2.split('.');
     if ((bsVersion === null || bsVersion === void 0 ? void 0 : bsVersion.length) > 0) {
       return bsVersion[0];
     }
-    return this.capabilities.version.split('.')[0];
+    return (_this$capabilities2 = this.capabilities) === null || _this$capabilities2 === void 0 ? void 0 : (_this$capabilities2$v = _this$capabilities2.version) === null || _this$capabilities2$v === void 0 ? void 0 : _this$capabilities2$v.split('.')[0];
   }
   osName() {
-    let osName = this.capabilities.os.toLowerCase();
+    var _this$capabilities3, _this$capabilities3$o;
+    let osName = (_this$capabilities3 = this.capabilities) === null || _this$capabilities3 === void 0 ? void 0 : (_this$capabilities3$o = _this$capabilities3.os) === null || _this$capabilities3$o === void 0 ? void 0 : _this$capabilities3$o.toLowerCase();
     if (osName === 'mac' && this.browserName() === 'iphone') {
       osName = 'ios';
     }
     return osName;
   }
   osVersion() {
-    return this.capabilities.osVersion.split('.')[0];
+    var _this$capabilities4, _this$capabilities4$o;
+    return (_this$capabilities4 = this.capabilities) === null || _this$capabilities4 === void 0 ? void 0 : (_this$capabilities4$o = _this$capabilities4.osVersion) === null || _this$capabilities4$o === void 0 ? void 0 : _this$capabilities4$o.split('.')[0];
   }
   deviceName() {
-    return this.capabilities.deviceName.split('-')[0];
+    var _this$capabilities5, _this$capabilities5$d;
+    return (_this$capabilities5 = this.capabilities) === null || _this$capabilities5 === void 0 ? void 0 : (_this$capabilities5$d = _this$capabilities5.deviceName) === null || _this$capabilities5$d === void 0 ? void 0 : _this$capabilities5$d.split('-')[0];
   }
   orientation() {
-    return this.capabilities.orientation;
+    var _this$capabilities6;
+    return (_this$capabilities6 = this.capabilities) === null || _this$capabilities6 === void 0 ? void 0 : _this$capabilities6.orientation;
   }
   async windowSize() {
     const dpr = await this.devicePixelRatio();
@@ -41,18 +51,22 @@ export default class MobileMetaData {
     };
   }
   async screenResolution() {
-    const data = await this.driver.executeScript({
-      script: 'return [(window.screen.width * window.devicePixelRatio).toString(), (window.screen.height * window.devicePixelRatio).toString()];',
-      args: []
+    return await Cache.withCache(Cache.resolution, this.driver.sessionId, async () => {
+      const data = await this.driver.executeScript({
+        script: 'return [parseInt(window.screen.width * window.devicePixelRatio).toString(), parseInt(window.screen.height * window.devicePixelRatio).toString()];',
+        args: []
+      });
+      const screenInfo = data.value;
+      return `${screenInfo[0]} x ${screenInfo[1]}`;
     });
-    const screenInfo = data.value;
-    return `${screenInfo[0]} x ${screenInfo[1]}`;
   }
   async devicePixelRatio() {
-    const devicePixelRatio = await this.driver.executeScript({
-      script: 'return window.devicePixelRatio;',
-      args: []
+    return await Cache.withCache(Cache.dpr, this.driver.sessionId, async () => {
+      const devicePixelRatio = await this.driver.executeScript({
+        script: 'return window.devicePixelRatio;',
+        args: []
+      });
+      return devicePixelRatio.value;
     });
-    return devicePixelRatio.value;
   }
 }

package/dist/metadata/normalizeData.js

@@ -0,0 +1,34 @@
+export default class NormalizeData {
+  osRollUp(os) {
+    if (os.toLowerCase().startsWith('win')) {
+      return 'Windows';
+    } else if (os.toLowerCase().startsWith('mac')) {
+      return 'OS X';
+    } else if (os.toLowerCase().includes('iphone') || os.toLowerCase().startsWith('ios')) {
+      return 'iOS';
+    } else if (os.toLowerCase().startsWith('android')) {
+      return 'Android';
+    }
+    return os;
+  }
+  browserRollUp(browserName, device) {
+    if (device) {
+      if (browserName !== null && browserName !== void 0 && browserName.toLowerCase().includes('chrome')) {
+        return 'chrome';
+      } else if (browserName !== null && browserName !== void 0 && browserName.toLowerCase().includes('iphone') || browserName !== null && browserName !== void 0 && browserName.toLowerCase().includes('ipad')) {
+        return 'safari';
+      }
+    }
+    return browserName;
+  }
+
+  // Responses for browser version differ for devices and desktops from capabilities
+  // Differenences in selenium and appium responses causes inconsistency
+  // So to tackle for devices on UI we will show device names else browser versions
+  browserVersionOrDeviceNameRollup(browserVersion, deviceName, device) {
+    if (device) {
+      return deviceName;
+    }
+    return browserVersion === null || browserVersion === void 0 ? void 0 : browserVersion.split('.')[0];
+  }
+}

package/dist/providers/automateProvider.js

@@ -2,6 +2,7 @@ import utils from '@percy/sdk-utils';
 import GenericProvider from './genericProvider.js';
 import Cache from '../util/cache.js';
 import Tile from '../util/tile.js';
+import NormalizeData from '../metadata/normalizeData.js';
 const log = utils.logger('webdriver-utils:automateProvider');
 const {
   TimeIt
@@ -10,6 +11,7 @@ export default class AutomateProvider extends GenericProvider {
   constructor(sessionId, commandExecutorUrl, capabilities, sessionCapabilites, clientInfo, environmentInfo, options, buildInfo) {
     super(sessionId, commandExecutorUrl, capabilities, sessionCapabilites, clientInfo, environmentInfo, options, buildInfo);
     this._markedPercy = false;
+    this.automateResults = null;
   }
   static supports(commandExecutorUrl) {
     return commandExecutorUrl.includes(process.env.AA_DOMAIN || 'browserstack');
@@ -18,21 +20,30 @@ export default class AutomateProvider extends GenericProvider {
     ignoreRegionXpaths = [],
     ignoreRegionSelectors = [],
     ignoreRegionElements = [],
-    customIgnoreRegions = []
+    customIgnoreRegions = [],
+    considerRegionXpaths = [],
+    considerRegionSelectors = [],
+    considerRegionElements = [],
+    customConsiderRegions = []
   }) {
     let response = null;
     let error;
-    log.info('Preparing to capture screenshots on automate ...');
+    log.debug(`[${name}] : Preparing to capture screenshots on automate ...`);
     try {
-      log.debug('Marking automate session as percy ...');
-      let result = await this.percyScreenshotBegin(name);
-      log.debug('Fetching the debug url ...');
-      this.setDebugUrl(result);
+      log.debug(`[${name}] : Marking automate session as percy ...`);
+      const result = await this.percyScreenshotBegin(name);
+      this.automateResults = JSON.parse(result.value);
+      log.debug(`[${name}] : Fetching the debug url ...`);
+      this.setDebugUrl();
       response = await super.screenshot(name, {
         ignoreRegionXpaths,
         ignoreRegionSelectors,
         ignoreRegionElements,
-        customIgnoreRegions
+        customIgnoreRegions,
+        considerRegionXpaths,
+        considerRegionSelectors,
+        considerRegionElements,
+        customConsiderRegions
       });
     } catch (e) {
       error = e;
@@ -55,8 +66,8 @@ export default class AutomateProvider extends GenericProvider {
         this._markedPercy = result.success;
         return result;
       } catch (e) {
-        log.debug(`[${name}] Could not mark Automate session as percy`);
-        log.error(`[${name}] error: ${e.toString()}`);
+        log.debug(`[${name}] : Could not mark Automate session as percy`);
+        log.error(`[${name}] : error: ${e.toString()}`);
         return null;
       }
     });
@@ -72,23 +83,22 @@ export default class AutomateProvider extends GenericProvider {
           state: 'end'
         });
       } catch (e) {
-        log.debug(`[${name}] Could not execute percyScreenshot command for Automate`);
+        log.debug(`[${name}] : Could not execute percyScreenshot command for Automate`);
         log.error(e);
       }
     });
   }
   async getTiles(headerHeight, footerHeight, fullscreen) {
+    var _responseValue$metada;
     if (!this.driver) throw new Error('Driver is null, please initialize driver with createDriver().');
-    log.info('Starting actual screenshotting phase');
+    log.debug('Starting actual screenshotting phase');
+    const dpr = await this.metaData.devicePixelRatio();
     const response = await TimeIt.run('percyScreenshot:screenshot', async () => {
       return await this.browserstackExecutor('percyScreenshot', {
         state: 'screenshot',
         percyBuildId: this.buildInfo.id,
         screenshotType: 'singlepage',
-        scaleFactor: await this.driver.executeScript({
-          script: 'return window.devicePixelRatio;',
-          args: []
-        }),
+        scaleFactor: dpr,
         options: this.options
       });
     });
@@ -99,10 +109,11 @@ export default class AutomateProvider extends GenericProvider {
     const tiles = [];
     const tileResponse = JSON.parse(responseValue.result);
     log.debug('Tiles captured successfully');
+    const windowHeight = (responseValue === null || responseValue === void 0 ? void 0 : (_responseValue$metada = responseValue.metadata) === null || _responseValue$metada === void 0 ? void 0 : _responseValue$metada.window_height) || 0;
     for (let tileData of tileResponse.sha) {
       tiles.push(new Tile({
-        statusBarHeight: 0,
-        navBarHeight: 0,
+        statusBarHeight: tileResponse.header_height || 0,
+        navBarHeight: tileResponse.footer_height || 0,
         headerHeight,
         footerHeight,
         fullscreen,
@@ -110,9 +121,13 @@ export default class AutomateProvider extends GenericProvider {
       }));
     }
 
+    const metadata = {
+      windowHeight: Math.ceil(windowHeight * dpr)
+    };
     return {
       tiles: tiles,
-      domInfoSha: tileResponse.dom_sha
+      domInfoSha: tileResponse.dom_sha,
+      metadata: metadata
     };
   }
   async browserstackExecutor(action, args) {
@@ -132,8 +147,43 @@ export default class AutomateProvider extends GenericProvider {
   async setDebugUrl() {
     if (!this.driver) throw new Error('Driver is null, please initialize driver with createDriver().');
     this.debugUrl = await Cache.withCache(Cache.bstackSessionDetails, this.driver.sessionId, async () => {
-      const sessionDetails = await this.browserstackExecutor('getSessionDetails');
-      return JSON.parse(sessionDetails.value).browser_url;
+      return `https://automate.browserstack.com/builds/${this.automateResults.buildHash}/sessions/${this.automateResults.sessionHash}`;
     });
   }
+  async getTag() {
+    var _automateCaps$os_vers, _ref;
+    if (!this.driver) throw new Error('Driver is null, please initialize driver with createDriver().');
+    if (!this.automateResults) throw new Error('Comparison tag details not available');
+    const automateCaps = this.automateResults.capabilities;
+    const normalizeTags = new NormalizeData();
+    let deviceName = this.automateResults.deviceName;
+    const osName = normalizeTags.osRollUp(automateCaps.os);
+    const osVersion = (_automateCaps$os_vers = automateCaps.os_version) === null || _automateCaps$os_vers === void 0 ? void 0 : _automateCaps$os_vers.split('.')[0];
+    const browserName = normalizeTags.browserRollUp(automateCaps.browserName, this.metaData.device());
+    const browserVersion = normalizeTags.browserVersionOrDeviceNameRollup(automateCaps.browserVersion, deviceName, this.metaData.device());
+    if (!this.metaData.device()) {
+      deviceName = `${osName}_${osVersion}_${browserName}_${browserVersion}`;
+    }
+    let {
+      width,
+      height
+    } = await this.metaData.windowSize();
+    const resolution = await this.metaData.screenResolution();
+    const orientation = (_ref = this.metaData.orientation() || automateCaps.deviceOrientation) === null || _ref === void 0 ? void 0 : _ref.toLowerCase();
+
+    // for android window size only constitutes of browser viewport, hence adding nav / status / url bar heights
+    [this.header, this.footer] = await this.getHeaderFooter(deviceName, osVersion, browserName);
+    height = this.metaData.device() && (osName === null || osName === void 0 ? void 0 : osName.toLowerCase()) === 'android' ? height + this.header + this.footer : height;
+    return {
+      name: deviceName,
+      osName,
+      osVersion,
+      width,
+      height,
+      orientation,
+      browserName,
+      browserVersion,
+      resolution
+    };
+  }
 }

package/dist/providers/genericProvider.js

@@ -56,7 +56,7 @@ export default class GenericProvider {
     }`;
   }
   async createDriver() {
-    this.driver = new Driver(this.sessionId, this.commandExecutorUrl);
+    this.driver = new Driver(this.sessionId, this.commandExecutorUrl, this.capabilities);
     log.debug(`Passed capabilities -> ${JSON.stringify(this.capabilities)}`);
     const caps = await this.driver.getCapabilites();
     log.debug(`Fetched capabilities -> ${JSON.stringify(caps)}`);
@@ -97,21 +97,26 @@ export default class GenericProvider {
     ignoreRegionXpaths = [],
     ignoreRegionSelectors = [],
     ignoreRegionElements = [],
-    customIgnoreRegions = []
+    customIgnoreRegions = [],
+    considerRegionXpaths = [],
+    considerRegionSelectors = [],
+    considerRegionElements = [],
+    customConsiderRegions = []
   }) {
     let fullscreen = false;
     this.addDefaultOptions();
     const percyCSS = (this.defaultPercyCSS() + (this.options.percyCSS || '')).split('\n').join('');
-    log.debug(`Applying the percyCSS - ${this.options.percyCSS}`);
+    log.debug(`[${name}] : Applying the percyCSS - ${this.options.percyCSS}`);
     await this.addPercyCSS(percyCSS);
     log.debug('Fetching comparisong tag ...');
     const tag = await this.getTag();
-    log.debug(`${name} : Tag ${JSON.stringify(tag)}`);
+    log.debug(`[${name}] : Tag ${JSON.stringify(tag)}`);
     const tiles = await this.getTiles(this.header, this.footer, fullscreen);
-    log.debug(`${name} : Tiles ${JSON.stringify(tiles)}`);
-    const ignoreRegions = await this.findIgnoredRegions(ignoreRegionXpaths, ignoreRegionSelectors, ignoreRegionElements, customIgnoreRegions);
+    log.debug(`[${name}] : Tiles ${JSON.stringify(tiles)}`);
+    const ignoreRegions = await this.findRegions(ignoreRegionXpaths, ignoreRegionSelectors, ignoreRegionElements, customIgnoreRegions);
+    const considerRegions = await this.findRegions(considerRegionXpaths, considerRegionSelectors, considerRegionElements, customConsiderRegions);
     await this.setDebugUrl();
-    log.debug(`${name} : Debug url ${this.debugUrl}`);
+    log.debug(`[${name}] : Debug url ${this.debugUrl}`);
     await this.removePercyCSS();
     return {
       name,
@@ -119,10 +124,16 @@ export default class GenericProvider {
       tiles: tiles.tiles,
       // TODO: Fetch this one for bs automate, check appium sdk
       externalDebugUrl: this.debugUrl,
-      ignoredElementsData: ignoreRegions,
+      ignoredElementsData: {
+        ignoreElementsData: ignoreRegions
+      },
+      consideredElementsData: {
+        considerElementsData: considerRegions
+      },
       environmentInfo: [...this.environmentInfo].join('; '),
       clientInfo: [...this.clientInfo].join(' '),
-      domInfoSha: tiles.domInfoSha
+      domInfoSha: tiles.domInfoSha,
+      metadata: tiles.metadata || null
     };
   }
 
@@ -131,6 +142,14 @@ export default class GenericProvider {
     // execute script and return dom content
     return 'dummyValue';
   }
+  async getWindowHeight() {
+    // execute script and return window height
+    return await this.driver.executeScript({
+      script: 'return window.innerHeight',
+      args: []
+    });
+    ;
+  }
   async getTiles(headerHeight, footerHeight, fullscreen) {
     if (!this.driver) throw new Error('Driver is null, please initialize driver with createDriver().');
     const base64content = await this.driver.takeScreenshot();
@@ -145,7 +164,10 @@ export default class GenericProvider {
         fullscreen
       })],
       // TODO: Add Generic support sha for contextual diff for non-automate
-      domInfoSha: await this.getDomContent()
+      domInfoSha: await this.getDomContent(),
+      metadata: {
+        windowHeight: await this.getWindowHeight()
+      }
     };
   }
   async getTag() {
@@ -176,16 +198,14 @@ export default class GenericProvider {
   async setDebugUrl() {
     this.debugUrl = 'https://localhost/v1';
   }
-  async findIgnoredRegions(ignoreRegionXpaths, ignoreRegionSelectors, ignoreRegionElements, customIgnoreRegions) {
-    const ignoreElementXpaths = await this.getIgnoreRegionsBy('xpath', ignoreRegionXpaths);
-    const ignoreElementSelectors = await this.getIgnoreRegionsBy('css selector', ignoreRegionSelectors);
-    const ignoreElements = await this.getIgnoreRegionsByElement(ignoreRegionElements);
-    const ignoreElementCustom = await this.getCustomIgnoreRegions(customIgnoreRegions);
-    return {
-      ignoreElementsData: [...ignoreElementXpaths, ...ignoreElementSelectors, ...ignoreElements, ...ignoreElementCustom]
-    };
+  async findRegions(xpaths, selectors, elements, customLocations) {
+    const xpathRegions = await this.getSeleniumRegionsBy('xpath', xpaths);
+    const selectorRegions = await this.getSeleniumRegionsBy('css selector', selectors);
+    const elementRegions = await this.getSeleniumRegionsByElement(elements);
+    const customRegions = await this.getSeleniumRegionsByLocation(customLocations);
+    return [...xpathRegions, ...selectorRegions, ...elementRegions, ...customRegions];
   }
-  async ignoreElementObject(selector, elementId) {
+  async getRegionObject(selector, elementId) {
     const scaleFactor = parseInt(await this.metaData.devicePixelRatio());
     const rect = await this.driver.rect(elementId);
     const location = {
@@ -208,37 +228,37 @@ export default class GenericProvider {
     };
     return jsonObject;
   }
-  async getIgnoreRegionsBy(findBy, elements) {
-    const ignoredElementsArray = [];
+  async getSeleniumRegionsBy(findBy, elements) {
+    const regionsArray = [];
     for (const idx in elements) {
       try {
         const element = await this.driver.findElement(findBy, elements[idx]);
         const selector = `${findBy}: ${elements[idx]}`;
-        const ignoredRegion = await this.ignoreElementObject(selector, element[Object.keys(element)[0]]);
-        ignoredElementsArray.push(ignoredRegion);
+        const region = await this.getRegionObject(selector, element[Object.keys(element)[0]]);
+        regionsArray.push(region);
       } catch (e) {
         log.warn(`Selenium Element with ${findBy}: ${elements[idx]} not found. Ignoring this ${findBy}.`);
         log.error(e.toString());
       }
     }
-    return ignoredElementsArray;
+    return regionsArray;
   }
-  async getIgnoreRegionsByElement(elements) {
-    const ignoredElementsArray = [];
+  async getSeleniumRegionsByElement(elements) {
+    const regionsArray = [];
     for (let index = 0; index < elements.length; index++) {
       try {
         const selector = `element: ${index}`;
-        const ignoredRegion = await this.ignoreElementObject(selector, elements[index]);
-        ignoredElementsArray.push(ignoredRegion);
+        const region = await this.getRegionObject(selector, elements[index]);
+        regionsArray.push(region);
       } catch (e) {
         log.warn(`Correct Web Element not passed at index ${index}.`);
         log.debug(e.toString());
       }
     }
-    return ignoredElementsArray;
+    return regionsArray;
   }
-  async getCustomIgnoreRegions(customLocations) {
-    const ignoredElementsArray = [];
+  async getSeleniumRegionsByLocation(customLocations) {
+    const elementsArray = [];
     const {
       width,
       height
@@ -247,8 +267,8 @@ export default class GenericProvider {
       const customLocation = customLocations[index];
       const invalid = customLocation.top >= height || customLocation.bottom > height || customLocation.left >= width || customLocation.right > width;
       if (!invalid) {
-        const selector = `custom ignore region ${index}`;
-        const ignoredRegion = {
+        const selector = `custom region ${index}`;
+        const region = {
           selector,
           coOrdinates: {
             top: customLocation.top,
@@ -257,20 +277,19 @@ export default class GenericProvider {
             right: customLocation.right
           }
         };
-        ignoredElementsArray.push(ignoredRegion);
+        elementsArray.push(region);
       } else {
         log.warn(`Values passed in custom ignored region at index: ${index} is not valid`);
       }
     }
-    return ignoredElementsArray;
+    return elementsArray;
   }
-  async getHeaderFooter() {
+  async getHeaderFooter(deviceName, osVersion, browserName) {
     // passing 0 as key, since across different pages and tests, this config will remain same
     const devicesConfig = await Cache.withCache(Cache.devicesConfig, 0, async () => {
       return (await request(DEVICES_CONFIG_URL)).body;
     });
-    let deviceKey = `${this.metaData.deviceName()}-${this.metaData.osVersion()}`;
-    let browserName = this.capabilities.browserName;
+    let deviceKey = `${deviceName}-${osVersion}`;
     return devicesConfig[deviceKey] ? devicesConfig[deviceKey][browserName] ? [devicesConfig[deviceKey][browserName].header, devicesConfig[deviceKey][browserName].footer] : [0, 0] : [0, 0];
   }
 }

package/dist/util/cache.js

@@ -10,6 +10,8 @@ export default class Cache {
   static bstackSessionDetails = 'bstackSessionDetails';
   static systemBars = 'systemBars';
   static devicesConfig = 'devicesConfig';
+  static dpr = 'dpr';
+  static resolution = 'resolution';
 
   // maintainance
   static lastTime = Date.now();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@percy/webdriver-utils",
-  "version": "1.27.0-beta.0",
+  "version": "1.27.0-beta.2",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -29,8 +29,8 @@
     "test:coverage": "yarn test --coverage"
   },
   "dependencies": {
-    "@percy/config": "1.27.0-beta.0",
-    "@percy/sdk-utils": "1.27.0-beta.0"
+    "@percy/config": "1.27.0-beta.2",
+    "@percy/sdk-utils": "1.27.0-beta.2"
   },
-  "gitHead": "2bc16314f51dddcc1cda459e7aa4b7b2db85f00a"
+  "gitHead": "bac46d4a3352884d4466cbc543ea599af33536ca"
 }

package/dist/util/timing.js

@@ -1,47 +0,0 @@
-import validations from './validations.js';
-const {
-  Undefined
-} = validations;
-export default class TimeIt {
-  static data = {};
-  static enabled = process.env.PERCY_METRICS === 'true';
-  static async run(store, func) {
-    if (!this.enabled) return await func();
-    const t1 = Date.now();
-    try {
-      return await func();
-    } finally {
-      if (Undefined(this.data[store])) this.data[store] = [];
-      this.data[store].push(Date.now() - t1);
-    }
-  }
-  static min(store) {
-    return Math.min(...this.data[store]);
-  }
-  static max(store) {
-    return Math.max(...this.data[store]);
-  }
-  static avg(store) {
-    const vals = this.data[store];
-    return vals.reduce((a, b) => a + b, 0) / vals.length;
-  }
-  static summary({
-    includeVals
-  } = {}) {
-    const agg = {};
-    for (const key of Object.keys(this.data)) {
-      agg[key] = {
-        min: this.min(key),
-        max: this.max(key),
-        avg: this.avg(key),
-        count: this.data[key].length
-      };
-      if (includeVals) agg[key].vals = this.data[key];
-    }
-    return agg;
-  }
-  static reset() {
-    this.data = {};
-  }
-}
-;

package/dist/util/validations.js

@@ -1,7 +0,0 @@
-function Undefined(obj) {
-  return obj === undefined;
-}
-export { Undefined };
-
-// export the namespace by default
-export * as default from './validations.js';