@percy/webdriver-utils 1.28.8-beta.1 → 1.28.8-beta.3

package/dist/index.js

@@ -1,26 +1,36 @@
 import ProviderResolver from './providers/providerResolver.js';
 import utils from '@percy/sdk-utils';
+import PlaywrightProvider from './providers/playwrightProvider.js';
 export default class WebdriverUtils {
-  static async automateScreenshot({
+  static async captureScreenshot({
     sessionId,
     commandExecutorUrl,
     capabilities,
-    sessionCapabilites,
+    sessionCapabilities,
+    frameGuid,
+    pageGuid,
+    framework,
     snapshotName,
     clientInfo,
     environmentInfo,
     options = {},
     buildInfo = {}
   }) {
-    const log = utils.logger('webdriver-utils:automateScreenshot');
+    const log = utils.logger('webdriver-utils:captureScreenshot');
     try {
       const startTime = Date.now();
-      log.info(`[${snapshotName}] : Starting automate screenshot ...`);
-      const automate = ProviderResolver.resolve(sessionId, commandExecutorUrl, capabilities, sessionCapabilites, clientInfo, environmentInfo, options, buildInfo);
-      log.debug(`[${snapshotName}] : Resolved provider ...`);
-      await automate.createDriver();
+      log.info(`[${snapshotName}] : Starting automate screenshot capture ...`);
+      let provider;
+      switch (framework ? framework.toLowerCase() : null) {
+        case 'playwright':
+          provider = new PlaywrightProvider(sessionId, frameGuid, pageGuid, clientInfo, environmentInfo, options, buildInfo);
+          break;
+        default:
+          provider = ProviderResolver.resolve(sessionId, commandExecutorUrl, capabilities, sessionCapabilities, clientInfo, environmentInfo, options, buildInfo);
+      }
+      await provider.createDriver();
       log.debug(`[${snapshotName}] : Created driver ...`);
-      const comparisonData = await automate.screenshot(snapshotName, options);
+      const comparisonData = await provider.screenshot(snapshotName, options);
       comparisonData.metadata.cliScreenshotStartTime = startTime;
       comparisonData.metadata.cliScreenshotEndTime = Date.now();
       comparisonData.sync = options.sync;
@@ -31,6 +41,7 @@ export default class WebdriverUtils {
     } catch (e) {
       log.error(`[${snapshotName}] : Error - ${e.message}`);
       log.error(`[${snapshotName}] : Error Log - ${e.toString()}`);
+      throw e; // Re-throw the error to maintain consistency in error handling
     }
   }
 }

package/dist/playwrightDriver.js

@@ -0,0 +1,34 @@
+import utils from '@percy/sdk-utils';
+const {
+  request
+} = utils;
+export default class PlaywrightDriver {
+  constructor(sessionId) {
+    this.sessionId = sessionId;
+  }
+  requestPostOptions(command) {
+    return {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json;charset=utf-8'
+      },
+      body: JSON.stringify(command)
+    };
+  }
+
+  // command => {script: "", args: []}
+  async executeScript(command) {
+    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 = this.requestPostOptions(command);
+    const baseUrl = `https://cdp.browserstack.com/wd/hub/session/${this.sessionId}/execute`;
+    const response = JSON.parse((await request(baseUrl, options)).body);
+    return response;
+  }
+}

package/dist/providers/automateProvider.js

@@ -2,18 +2,21 @@ 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';
 import TimeIt from '../util/timing.js';
+import MetaDataResolver from '../metadata/metaDataResolver.js';
+import Driver from '../driver.js';
 const log = utils.logger('webdriver-utils:automateProvider');
 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');
   }
+  async createDriver() {
+    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)}`);
+    this.metaData = MetaDataResolver.resolve(this.driver, caps, this.capabilities);
+  }
   async screenshot(name, {
     ignoreRegionXpaths = [],
     ignoreRegionSelectors = [],
@@ -51,62 +54,12 @@ export default class AutomateProvider extends GenericProvider {
     }
     return response;
   }
-  async percyScreenshotBegin(name) {
-    return await TimeIt.run('percyScreenshotBegin', async () => {
-      try {
-        let result = await this.browserstackExecutor('percyScreenshot', {
-          name,
-          percyBuildId: this.buildInfo.id,
-          percyBuildUrl: this.buildInfo.url,
-          state: 'begin'
-        });
-        // Selenium Hub, set status error Code to 13 if an error is thrown
-        // Handling error with Selenium dialect is != W3C
-        if ((result === null || result === void 0 ? void 0 : result.status) === 13) throw new Error((result === null || result === void 0 ? void 0 : result.value) || 'Got invalid error response');
-        this._markedPercy = result.success;
-        return result;
-      } catch (e) {
-        var _e$response, _JSON$parse, _e$response2;
-        log.debug(`[${name}] : Could not mark Automate session as percy`);
-        log.error(`[${name}] : error: ${e.toString()}`);
-        /**
-         * - Handling Error when dialect is W3C
-         * ERROR response format from SeleniumHUB `{
-         * sessionId: ...,
-         * status: 13,
-         * value: { error: '', message: ''}
-         * }
-         */
-        const errResponse = (e === null || e === void 0 ? void 0 : (_e$response = e.response) === null || _e$response === void 0 ? void 0 : _e$response.body) && ((_JSON$parse = JSON.parse(e === null || e === void 0 ? void 0 : (_e$response2 = e.response) === null || _e$response2 === void 0 ? void 0 : _e$response2.body)) === null || _JSON$parse === void 0 ? void 0 : _JSON$parse.value) || {};
-        const errMessage = (errResponse === null || errResponse === void 0 ? void 0 : errResponse.message) || (errResponse === null || errResponse === void 0 ? void 0 : errResponse.error) || (e === null || e === void 0 ? void 0 : e.message) || (e === null || e === void 0 ? void 0 : e.error) || (e === null || e === void 0 ? void 0 : e.value) || e.toString();
-        throw new Error(errMessage);
-      }
-    });
-  }
-  async percyScreenshotEnd(name, error) {
-    return await TimeIt.run('percyScreenshotEnd', async () => {
-      try {
-        var _this$buildInfo, _this$options;
-        await this.browserstackExecutor('percyScreenshot', {
-          name,
-          percyScreenshotUrl: (_this$buildInfo = this.buildInfo) === null || _this$buildInfo === void 0 ? void 0 : _this$buildInfo.url,
-          status: error ? 'failure' : 'success',
-          statusMessage: error ? `${error}` : '',
-          state: 'end',
-          sync: (_this$options = this.options) === null || _this$options === void 0 ? void 0 : _this$options.sync
-        });
-      } catch (e) {
-        log.debug(`[${name}] : Could not execute percyScreenshot command for Automate`);
-        log.error(e);
-      }
-    });
-  }
   async getTiles(fullscreen) {
-    var _this$options2;
+    var _this$options;
     if (!this.driver) throw new Error('Driver is null, please initialize driver with createDriver().');
     log.debug('Starting actual screenshotting phase');
     const dpr = await this.metaData.devicePixelRatio();
-    const screenshotType = (_this$options2 = this.options) !== null && _this$options2 !== void 0 && _this$options2.fullPage ? 'fullpage' : 'singlepage';
+    const screenshotType = (_this$options = this.options) !== null && _this$options !== void 0 && _this$options.fullPage ? 'fullpage' : 'singlepage';
     const response = await TimeIt.run('percyScreenshot:screenshot', async () => {
       return await this.browserstackExecutor('percyScreenshot', {
         state: 'screenshot',
@@ -143,20 +96,6 @@ export default class AutomateProvider extends GenericProvider {
       metadata: metadata
     };
   }
-  async browserstackExecutor(action, args) {
-    if (!this.driver) throw new Error('Driver is null, please initialize driver with createDriver().');
-    let options = args ? {
-      action,
-      arguments: args
-    } : {
-      action
-    };
-    let res = await this.driver.executeScript({
-      script: `browserstack_executor: ${JSON.stringify(options)}`,
-      args: []
-    });
-    return res;
-  }
   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 () => {
@@ -164,35 +103,22 @@ export default class AutomateProvider extends GenericProvider {
     });
   }
   async getTag() {
-    var _automateCaps$os_vers, _ref;
+    var _this$metaData$orient;
     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();
-    return {
-      name: deviceName,
-      osName,
-      osVersion,
+    const orientation = (_this$metaData$orient = this.metaData.orientation()) === null || _this$metaData$orient === void 0 ? void 0 : _this$metaData$orient.toLowerCase();
+    const device = this.metaData.device();
+    const tagData = {
       width,
       height,
+      resolution,
       orientation,
-      browserName,
-      browserVersion,
-      resolution
+      device
     };
+    return await super.getTag(tagData);
   }
 }

package/dist/providers/genericProvider.js

@@ -1,24 +1,21 @@
 import utils from '@percy/sdk-utils';
-import MetaDataResolver from '../metadata/metaDataResolver.js';
+import TimeIt from '../util/timing.js';
 import Tile from '../util/tile.js';
 import Driver from '../driver.js';
+import MetaDataResolver from '../metadata/metaDataResolver.js';
+import NormalizeData from '../metadata/normalizeData.js';
 const log = utils.logger('webdriver-utils:genericProvider');
 export default class GenericProvider {
-  clientInfo = new Set();
-  environmentInfo = new Set();
-  options = {};
-  constructor(sessionId, commandExecutorUrl, capabilities, sessionCapabilites, clientInfo, environmentInfo, options, buildInfo) {
-    this.sessionId = sessionId;
-    this.commandExecutorUrl = commandExecutorUrl;
-    this.capabilities = capabilities;
-    this.sessionCapabilites = sessionCapabilites;
-    this.addClientInfo(clientInfo);
-    this.addEnvironmentInfo(environmentInfo);
-    this.options = options;
-    this.buildInfo = buildInfo;
-    this.driver = null;
+  clientInfoDetails = new Set();
+  environmentInfoDetails = new Set();
+  constructor(args) {
+    Object.assign(this, args);
+    this.addClientInfo(this.clientInfo);
+    this.addEnvironmentInfo(this.environmentInfo);
+    this._markedPercy = false;
     this.metaData = null;
     this.debugUrl = null;
+    this.driver = null;
     this.header = 0;
     this.footer = 0;
     this.statusBarHeight = 0;
@@ -36,19 +33,19 @@ export default class GenericProvider {
     log.debug(`Passed capabilities -> ${JSON.stringify(this.capabilities)}`);
     const caps = await this.driver.getCapabilites();
     log.debug(`Fetched capabilities -> ${JSON.stringify(caps)}`);
-    this.metaData = await MetaDataResolver.resolve(this.driver, caps, this.capabilities);
+    this.metaData = MetaDataResolver.resolve(this.driver, caps, this.capabilities);
   }
   static supports(_commandExecutorUrl) {
     return true;
   }
   addClientInfo(info) {
     for (let i of [].concat(info)) {
-      if (i) this.clientInfo.add(i);
+      if (i) this.clientInfoDetails.add(i);
     }
   }
   addEnvironmentInfo(info) {
     for (let i of [].concat(info)) {
-      if (i) this.environmentInfo.add(i);
+      if (i) this.environmentInfoDetails.add(i);
     }
   }
   isIOS() {
@@ -74,6 +71,72 @@ export default class GenericProvider {
       args: []
     });
   }
+  async browserstackExecutor(action, args) {
+    if (!this.driver) throw new Error('Driver is null, please initialize driver with createDriver().');
+    let options = args ? {
+      action,
+      arguments: args
+    } : {
+      action
+    };
+    let res = await this.driver.executeScript({
+      script: `browserstack_executor: ${JSON.stringify(options)}`,
+      args: []
+    });
+    return res;
+  }
+  async percyScreenshotBegin(name) {
+    return await TimeIt.run('percyScreenshotBegin', async () => {
+      try {
+        let result = await this.browserstackExecutor('percyScreenshot', {
+          name,
+          percyBuildId: this.buildInfo.id,
+          percyBuildUrl: this.buildInfo.url,
+          state: 'begin'
+        });
+        // Selenium Hub, set status error Code to 13 if an error is thrown
+        // Handling error with Selenium dialect is != W3C
+        if ((result === null || result === void 0 ? void 0 : result.status) === 13) {
+          throw new Error((result === null || result === void 0 ? void 0 : result.value) || 'Got invalid error response');
+        }
+        this._markedPercy = result.success;
+        return result;
+      } catch (e) {
+        var _e$response, _JSON$parse, _e$response2;
+        log.debug(`[${name}] : Could not mark Automate session as percy`);
+        log.error(`[${name}] : error: ${e.toString()}`);
+        /**
+         * - Handling Error when dialect is W3C
+         * ERROR response format from SeleniumHUB `{
+         * sessionId: ...,
+         * status: 13,
+         * value: { error: '', message: ''}
+         * }
+         */
+        const errResponse = (e === null || e === void 0 ? void 0 : (_e$response = e.response) === null || _e$response === void 0 ? void 0 : _e$response.body) && ((_JSON$parse = JSON.parse(e === null || e === void 0 ? void 0 : (_e$response2 = e.response) === null || _e$response2 === void 0 ? void 0 : _e$response2.body)) === null || _JSON$parse === void 0 ? void 0 : _JSON$parse.value) || {};
+        const errMessage = (errResponse === null || errResponse === void 0 ? void 0 : errResponse.message) || (errResponse === null || errResponse === void 0 ? void 0 : errResponse.error) || (e === null || e === void 0 ? void 0 : e.message) || (e === null || e === void 0 ? void 0 : e.error) || (e === null || e === void 0 ? void 0 : e.value) || e.toString();
+        throw new Error(errMessage);
+      }
+    });
+  }
+  async percyScreenshotEnd(name, error) {
+    return await TimeIt.run('percyScreenshotEnd', async () => {
+      try {
+        var _this$buildInfo, _this$options;
+        await this.browserstackExecutor('percyScreenshot', {
+          name,
+          percyScreenshotUrl: (_this$buildInfo = this.buildInfo) === null || _this$buildInfo === void 0 ? void 0 : _this$buildInfo.url,
+          status: error ? 'failure' : 'success',
+          statusMessage: error ? `${error}` : '',
+          state: 'end',
+          sync: (_this$options = this.options) === null || _this$options === void 0 ? void 0 : _this$options.sync
+        });
+      } catch (e) {
+        log.debug(`[${name}] : Could not execute percyScreenshot command for Automate`);
+        log.error(e);
+      }
+    });
+  }
   async screenshot(name, {
     ignoreRegionXpaths = [],
     ignoreRegionSelectors = [],
@@ -110,12 +173,21 @@ export default class GenericProvider {
       consideredElementsData: {
         considerElementsData: considerRegions
       },
-      environmentInfo: [...this.environmentInfo].join('; '),
-      clientInfo: [...this.clientInfo].join(' '),
+      environmentInfo: this.getUserAgentString(this.environmentInfoDetails),
+      clientInfo: this.getUserAgentString(this.clientInfoDetails),
       domInfoSha: tiles.domInfoSha,
       metadata: tiles.metadata || null
     };
   }
+  getUserAgentString(data) {
+    let result = '';
+    if (data instanceof Set) {
+      result = [...data].join('; ');
+    } else if (typeof data === 'string') {
+      result = data;
+    }
+    return result;
+  }
 
   // TODO: get dom sha for non-automate
   async getDomContent() {
@@ -150,33 +222,13 @@ export default class GenericProvider {
       }
     };
   }
-  async getTag() {
-    if (!this.driver) throw new Error('Driver is null, please initialize driver with createDriver().');
-    let {
-      width,
-      height
-    } = await this.metaData.windowSize();
-    const resolution = await this.metaData.screenResolution();
-    const orientation = this.metaData.orientation();
-    return {
-      name: this.metaData.deviceName(),
-      osName: this.metaData.osName(),
-      osVersion: this.metaData.osVersion(),
-      width,
-      height,
-      orientation: orientation,
-      browserName: this.metaData.browserName(),
-      browserVersion: this.metaData.browserVersion(),
-      resolution: resolution
-    };
-  }
 
   // TODO: Add Debugging Url for non-automate
   async setDebugUrl() {
     this.debugUrl = 'https://localhost/v1';
   }
   async doTransformations() {
-    var _this$options;
+    var _this$options2;
     const hideScrollbarStyle = `
     /* Hide scrollbar for Chrome, Safari and Opera */
     ::-webkit-scrollbar {
@@ -197,7 +249,7 @@ export default class GenericProvider {
       script: jsScript,
       args: []
     });
-    if ((_this$options = this.options) !== null && _this$options !== void 0 && _this$options.fullPage || this.isIOS()) {
+    if ((_this$options2 = this.options) !== null && _this$options2 !== void 0 && _this$options2.fullPage || this.isIOS()) {
       await this.getInitialScrollLocation();
     }
   }
@@ -225,11 +277,11 @@ export default class GenericProvider {
     }
   }
   async getRegionObjectFromBoundingBox(selector, element) {
-    var _this$options2;
+    var _this$options3;
     const scaleFactor = await this.metaData.devicePixelRatio();
     let scrollX = 0,
       scrollY = 0;
-    if ((_this$options2 = this.options) !== null && _this$options2 !== void 0 && _this$options2.fullPage) {
+    if ((_this$options3 = this.options) !== null && _this$options3 !== void 0 && _this$options3.fullPage) {
       scrollX = this.initialScrollLocation.value[0];
       scrollY = this.initialScrollLocation.value[1];
     }
@@ -265,14 +317,14 @@ export default class GenericProvider {
     return regionsArray;
   }
   async updatePageShiftFactor(location, scaleFactor, scrollFactors) {
-    var _this$options3;
+    var _this$options4;
     if (this.isIOS() || this.currentTag.osName === 'OS X' && parseInt(this.currentTag.browserVersion) > 13 && this.currentTag.browserName.toLowerCase() === 'safari') {
       this.pageYShiftFactor = this.statusBarHeight;
     } else {
       this.pageYShiftFactor = this.statusBarHeight - scrollFactors.value[1] * scaleFactor;
     }
     this.pageXShiftFactor = this.isIOS() ? 0 : -(scrollFactors.value[0] * scaleFactor);
-    if (this.isIOS() && !((_this$options3 = this.options) !== null && _this$options3 !== void 0 && _this$options3.fullPage)) {
+    if (this.isIOS() && !((_this$options4 = this.options) !== null && _this$options4 !== void 0 && _this$options4.fullPage)) {
       if (scrollFactors.value[0] !== this.initialScrollLocation.value[0] || scrollFactors.value[1] !== this.initialScrollLocation.value[1]) {
         this.pageXShiftFactor = -1 * this.removeElementShiftFactor;
         this.pageYShiftFactor = -1 * this.removeElementShiftFactor;
@@ -282,7 +334,7 @@ export default class GenericProvider {
     }
   }
   async getRegionObject(selector, elementId) {
-    var _this$options4;
+    var _this$options5;
     const scaleFactor = await this.metaData.devicePixelRatio();
     const rect = await this.driver.rect(elementId);
     const location = {
@@ -296,7 +348,7 @@ export default class GenericProvider {
     let scrollX = 0,
       scrollY = 0;
     const scrollFactors = await this.getScrollDetails();
-    if ((_this$options4 = this.options) !== null && _this$options4 !== void 0 && _this$options4.fullPage) {
+    if ((_this$options5 = this.options) !== null && _this$options5 !== void 0 && _this$options5.fullPage) {
       scrollX = scrollFactors.value[0];
       scrollY = scrollFactors.value[1];
     }
@@ -362,4 +414,38 @@ export default class GenericProvider {
     }
     return elementsArray;
   }
+  async getTag(tagData) {
+    var _automateCaps$os_vers;
+    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, tagData.device);
+    const browserVersion = normalizeTags.browserVersionOrDeviceNameRollup(automateCaps.browserVersion, deviceName, tagData.device);
+    if (!tagData.device) {
+      deviceName = `${osName}_${osVersion}_${browserName}_${browserVersion}`;
+    }
+    let {
+      width,
+      height
+    } = {
+      width: tagData.width,
+      height: tagData.height
+    };
+    const resolution = tagData.resolution;
+    const orientation = tagData.orientation || automateCaps.deviceOrientation || 'landscape';
+    return {
+      name: deviceName,
+      osName,
+      osVersion,
+      width,
+      height,
+      orientation,
+      browserName,
+      browserVersion,
+      resolution
+    };
+  }
 }

package/dist/providers/playwrightProvider.js

@@ -0,0 +1,136 @@
+import utils from '@percy/sdk-utils';
+import TimeIt from '../util/timing.js';
+import NormalizeData from '../metadata/normalizeData.js';
+import Tile from '../util/tile.js';
+import GenericProvider from './genericProvider.js';
+import PlaywrightDriver from '../playwrightDriver.js';
+const log = utils.logger('webdriver-utils:genericProvider');
+export default class PlaywrightProvider extends GenericProvider {
+  constructor(sessionId, frameGuid, pageGuid, clientInfo, environmentInfo, options, buildInfo) {
+    super({
+      sessionId,
+      frameGuid,
+      pageGuid,
+      clientInfo,
+      environmentInfo,
+      options,
+      buildInfo
+    });
+  }
+  async createDriver() {
+    this.driver = new PlaywrightDriver(this.sessionId);
+  }
+  async setDebugUrl() {
+    this.debugUrl = `https://automate.browserstack.com/builds/${this.automateResults.buildHash}/sessions/${this.automateResults.sessionHash}`;
+  }
+  async screenshot(name, options) {
+    let response = null;
+    let error;
+    log.debug(`[${name}] : Preparing to capture screenshots on playwrght with automate ...`);
+    try {
+      log.debug(`[${name}] : Marking automate session as percy ...`);
+      const result = await this.percyScreenshotBegin(name);
+      this.automateResults = JSON.parse(result.value);
+      log.debug(`[${name}] : Begin response ${this.automateResults}`);
+      log.debug(`[${name}] : Fetching the debug url ...`);
+      this.setDebugUrl();
+      const tiles = await this.getTiles();
+      log.debug(`[${name}] : Tiles ${JSON.stringify(tiles)}`);
+      log.debug('Fetching comparisong tag ...');
+      const tag = await this.getTag(tiles.tagData);
+      log.debug(`[${name}] : Tag ${JSON.stringify(tag)}`);
+      response = {
+        name,
+        tag,
+        tiles: tiles.tiles,
+        // TODO: Fetch this one for bs automate, check appium sdk
+        externalDebugUrl: this.debugUrl,
+        ignoredElementsData: {
+          ignoreElementsData: tiles.ignoreRegionsData
+        },
+        consideredElementsData: {
+          considerElementsData: tiles.considerRegionsData
+        },
+        environmentInfo: this.environmentInfo,
+        clientInfo: this.clientInfo,
+        domInfoSha: tiles.domInfoSha,
+        metadata: tiles.metadata || null
+      };
+    } catch (e) {
+      console.trace(e);
+      error = e;
+      throw e;
+    } finally {
+      await this.percyScreenshotEnd(name, error);
+    }
+    return response;
+  }
+  async getTiles(fullscreen = true) {
+    var _this$options;
+    log.debug(`Starting actual screenshotting phase with Page GUID: ${this.pageGuid}, Frame GUID: ${this.frameGuid}`);
+    const screenshotType = (_this$options = this.options) !== null && _this$options !== void 0 && _this$options.fullPage ? 'fullpage' : 'singlepage';
+    const response = await TimeIt.run('percyScreenshot:screenshot', async () => {
+      return await this.browserstackExecutor('percyScreenshot', {
+        state: 'screenshot',
+        percyBuildId: this.buildInfo.id,
+        screenshotType: screenshotType,
+        scaleFactor: 1,
+        options: this.options,
+        frameworkData: {
+          frameGuid: this.frameGuid,
+          pageGuid: this.pageGuid
+        },
+        framework: 'playwright'
+      });
+    });
+    log.debug(`Response ${JSON.stringify(response)}`);
+    const responseValue = JSON.parse(response.value);
+    if (!responseValue.success) {
+      throw new Error('Failed to get screenshots from Automate.' + ' Check dashboard for error.');
+    }
+    const tiles = [];
+    log.debug('Capturing tiles');
+    const tileResponse = JSON.parse(responseValue.result);
+    log.debug(`Tiles captured successfully ${JSON.stringify(tileResponse)}`);
+    for (let tileData of tileResponse.tiles) {
+      tiles.push(new Tile({
+        statusBarHeight: tileData.status_bar || 0,
+        navBarHeight: tileData.nav_bar || 0,
+        headerHeight: tileData.header_height || 0,
+        footerHeight: tileData.footer_height || 0,
+        fullscreen,
+        sha: tileData.sha.split('-')[0] // drop build id
+      }));
+    }
+
+    const tagData = {
+      width: tileResponse.comparison_tag_data.width,
+      height: tileResponse.comparison_tag_data.height,
+      resolution: tileResponse.comparison_tag_data.resolution
+    };
+    const ignoreRegionsData = tileResponse.ignore_regions_data || [];
+    const considerRegionsData = tileResponse.consider_regions_data || [];
+    const metadata = {
+      screenshotType: screenshotType
+    };
+    return {
+      tiles: tiles,
+      domInfoSha: tileResponse.dom_sha,
+      metadata: metadata,
+      tagData: tagData,
+      ignoreRegionsData: ignoreRegionsData,
+      considerRegionsData: considerRegionsData
+    };
+  }
+  async getTag(tagData) {
+    if (!this.automateResults) throw new Error('Comparison tag details not available');
+    const mobileOS = ['ANDROID'];
+    const normalizeTags = new NormalizeData();
+    const automateCaps = this.automateResults.capabilities;
+    const osName = normalizeTags.osRollUp(automateCaps.os);
+    const device = mobileOS.includes(osName.toUpperCase());
+    tagData.device = device;
+    console.log(`Device: ${device}`);
+    return await super.getTag(tagData);
+  }
+}

package/dist/providers/providerResolver.js

@@ -3,7 +3,17 @@ import AutomateProvider from './automateProvider.js';
 export default class ProviderResolver {
   static resolve(sessionId, commandExecutorUrl, capabilities, sessionCapabilities, clientInfo, environmentInfo, options, buildInfo) {
     // We can safely do [0] because GenericProvider is catch all
-    const Klass = [AutomateProvider, GenericProvider].filter(x => x.supports(commandExecutorUrl))[0];
-    return new Klass(sessionId, commandExecutorUrl, capabilities, sessionCapabilities, clientInfo, environmentInfo, options, buildInfo);
+    const Klass = [AutomateProvider, GenericProvider].filter(provider => provider.supports(commandExecutorUrl))[0];
+    const args = {
+      sessionId,
+      commandExecutorUrl,
+      capabilities,
+      sessionCapabilities,
+      clientInfo,
+      environmentInfo,
+      options,
+      buildInfo
+    };
+    return new Klass(args);
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@percy/webdriver-utils",
-  "version": "1.28.8-beta.1",
+  "version": "1.28.8-beta.3",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -29,8 +29,8 @@
     "test:coverage": "yarn test --coverage"
   },
   "dependencies": {
-    "@percy/config": "1.28.8-beta.1",
-    "@percy/sdk-utils": "1.28.8-beta.1"
+    "@percy/config": "1.28.8-beta.3",
+    "@percy/sdk-utils": "1.28.8-beta.3"
   },
-  "gitHead": "d31a9746c7be6d74db284b8f30c3248d2bba916e"
+  "gitHead": "60fcc0cc0e65b1dd9f81286a3a3cd7383f1f6220"
 }