aded regions support (#929)

* aded regions

* lint

* test

* updated cli to 1.30.9

* resolved comments

Author: amandeepsingh333

createRegion.js

@@ -0,0 +1,53 @@
+const createRegion = function({
+  boundingBox = null,
+  elementXpath = null,
+  elementCSS = null,
+  padding = null,
+  algorithm = 'ignore',
+  diffSensitivity = null,
+  imageIgnoreThreshold = null,
+  carouselsEnabled = null,
+  bannersEnabled = null,
+  adsEnabled = null,
+  diffIgnoreThreshold = null
+} = {}) {
+  const elementSelector = {};
+  if (boundingBox) elementSelector.boundingBox = boundingBox;
+  if (elementXpath) elementSelector.elementXpath = elementXpath;
+  if (elementCSS) elementSelector.elementCSS = elementCSS;
+
+  const region = {
+    algorithm,
+    elementSelector
+  };
+
+  if (padding) {
+    region.padding = padding;
+  }
+
+  const configuration = {};
+  if (['standard', 'intelliignore'].includes(algorithm)) {
+    if (diffSensitivity) configuration.diffSensitivity = diffSensitivity;
+    if (imageIgnoreThreshold) configuration.imageIgnoreThreshold = imageIgnoreThreshold;
+    if (carouselsEnabled) configuration.carouselsEnabled = carouselsEnabled;
+    if (bannersEnabled) configuration.bannersEnabled = bannersEnabled;
+    if (adsEnabled) configuration.adsEnabled = adsEnabled;
+  }
+
+  if (Object.keys(configuration).length > 0) {
+    region.configuration = configuration;
+  }
+
+  const assertion = {};
+  if (diffIgnoreThreshold) {
+    assertion.diffIgnoreThreshold = diffIgnoreThreshold;
+  }
+
+  if (Object.keys(assertion).length > 0) {
+    region.assertion = assertion;
+  }
+
+  return region;
+};
+
+module.exports = { createRegion };

cypress/e2e/index.cy.js

@@ -1,4 +1,5 @@
 import helpers from '@percy/sdk-utils/test/helpers';
+import { createRegion } from '../../createRegion';
 
 const { match } = Cypress.sinon;
 
@@ -198,4 +199,79 @@ describe('percySnapshot', () => {
       });
     });
   });
+
+  describe('createRegion function', () => {
+    it('creates a region object with default values', () => {
+      const region = createRegion();
+      expect(region).to.deep.equal({ algorithm: 'ignore', elementSelector: {} });
+    });
+
+    it('creates a region object with provided values', () => {
+      const region = createRegion({ boundingBox: { x: 10, y: 20, width: 100, height: 200 }, algorithm: 'standard' });
+      expect(region).to.deep.equal({
+        algorithm: 'standard',
+        elementSelector: { boundingBox: { x: 10, y: 20, width: 100, height: 200 } }
+      });
+    });
+
+    it('adds configuration properties when using standard or intelliignore', () => {
+      const region = createRegion({ algorithm: 'standard', diffSensitivity: 0.5 });
+      expect(region).to.have.property('configuration');
+      expect(region.configuration).to.deep.equal({ diffSensitivity: 0.5 });
+    });
+
+    it('adds assertion properties if diffIgnoreThreshold is provided', () => {
+      const region = createRegion({ diffIgnoreThreshold: 0.1 });
+      expect(region).to.have.property('assertion');
+      expect(region.assertion).to.deep.equal({ diffIgnoreThreshold: 0.1 });
+    });
+
+    it('includes padding when provided', () => {
+      const region = createRegion({ padding: { top: 10 } });
+      expect(region).to.have.property('padding').that.deep.equals({ top: 10 });
+    });
+
+    it('includes configuration when algorithm is standard', () => {
+      const region = createRegion({ algorithm: 'standard', diffSensitivity: 5 });
+      expect(region.configuration.diffSensitivity).to.equal(5);
+    });
+
+    it('includes configuration when algorithm is intelliignore', () => {
+      const region = createRegion({ algorithm: 'intelliignore', imageIgnoreThreshold: 0.2 });
+      expect(region.configuration.imageIgnoreThreshold).to.equal(0.2);
+    });
+
+    it('does not include configuration for ignore algorithm', () => {
+      const region = createRegion({ algorithm: 'ignore', diffSensitivity: 5 });
+      expect(region.configuration).to.be.undefined;
+    });
+
+    it('sets elementXpath in elementSelector', () => {
+      const region = createRegion({ elementXpath: "//div[@id='test']" });
+      expect(region.elementSelector.elementXpath).to.equal("//div[@id='test']");
+    });
+
+    it('sets elementCSS in elementSelector', () => {
+      const region = createRegion({ elementCSS: '.test-class' });
+      expect(region.elementSelector.elementCSS).to.equal('.test-class');
+    });
+  });
+
+  it('includes carouselsEnabled in configuration if provided', () => {
+    const region = createRegion({ algorithm: 'standard', carouselsEnabled: true });
+    expect(region).to.have.property('configuration');
+    expect(region.configuration).to.have.property('carouselsEnabled', true);
+  });
+
+  it('includes bannersEnabled in configuration if provided', () => {
+    const region = createRegion({ algorithm: 'standard', bannersEnabled: true });
+    expect(region).to.have.property('configuration');
+    expect(region.configuration).to.have.property('bannersEnabled', true);
+  });
+
+  it('includes adsEnabled in configuration if provided', () => {
+    const region = createRegion({ algorithm: 'standard', adsEnabled: true });
+    expect(region).to.have.property('configuration');
+    expect(region.configuration).to.have.property('adsEnabled', true);
+  });
 });

index.js

@@ -1,4 +1,5 @@
 const utils = require('@percy/sdk-utils');
+const { createRegion } = require('./createRegion');
 
 // Collect client and environment information
 const sdkPkg = require('./package.json');
@@ -127,3 +128,5 @@ Cypress.Commands.add('percySnapshot', (name, options = {}) => {
     });
   });
 });
+
+module.exports = { createRegion };