@applitools/eyes-cypress 3.28.1 → 3.28.2

package/CHANGELOG.md

@@ -12,6 +12,13 @@
 
 
 
+## 3.28.2 - 2023/1/17
+
+### Features
+### Bug fixes
+- Fix types to include region options when passing an element
+- Add support for region options for coded floating and accessibility when using elements
+
 ## 3.28.1 - 2023/1/5
 
 ### Features

package/dist/browser/spec-driver.js

@@ -3,9 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.getCookies = exports.getUrl = exports.getTitle = exports.findElements = exports.findElement = exports.transformSelector = exports.setViewportSize = exports.getViewportSize = exports.childContext = exports.parentContext = exports.mainContext = exports.executeScript = void 0;
 function executeScript(context, script, arg) {
     let scriptToExecute;
-    if (script.includes('dom-snapshot') ||
-        script.includes('dom-capture') ||
-        script.includes('dom-shared')) {
+    if (script.includes('dom-snapshot') || script.includes('dom-capture') || script.includes('dom-shared')) {
         scriptToExecute = script;
     }
     else {
@@ -26,7 +24,6 @@ function parentContext(context) {
     if (!context) {
         throw new Error('Context is not accessible');
     }
-    ;
     return context === mainContext() ? context : context.defaultView.frameElement.ownerDocument;
 }
 exports.parentContext = parentContext;
@@ -43,7 +40,7 @@ function getViewportSize() {
     const currWindow = cy.state('window');
     const viewportSize = {
         width: currWindow.innerWidth || currWindow.document.documentElement.clientWidth || currWindow.document.body.clientWidth,
-        height: currWindow.innerHeight || currWindow.document.documentElement.clientHeight || currWindow.document.body.clientHeight
+        height: currWindow.innerHeight || currWindow.document.documentElement.clientHeight || currWindow.document.body.clientHeight,
     };
     return viewportSize;
 }

package/index.d.ts

@@ -6,6 +6,7 @@ type MaybeArray<T> = T | T[]
 type LegacyRegion = {left: number; top: number; width: number; height: number}
 type Selector = {selector: string; type?: 'css' | 'xpath', nodeType?: 'element' | 'shadow-root'} | 'string'
 type Element = HTMLElement | JQuery<HTMLElement>
+type ElementWithOptions = {element: Element, regionId?: string, padding?: any}
 
 interface CypressCheckSettings extends api.CheckSettingsAutomationPlain<Element, Selector>{
   tag?: CypressCheckSettings['name']
@@ -14,12 +15,12 @@ interface CypressCheckSettings extends api.CheckSettingsAutomationPlain<Element,
   selector?: Selector
   element?: Element
 
-  ignore?: MaybeArray<NonNullable<CypressCheckSettings['ignoreRegions']>[number] | LegacyRegion>
-  layout?: MaybeArray<NonNullable<CypressCheckSettings['layoutRegions']>[number] | LegacyRegion>
-  content?: MaybeArray<NonNullable<CypressCheckSettings['contentRegions']>[number] | LegacyRegion>
-  strict?: MaybeArray<NonNullable<CypressCheckSettings['strictRegions']>[number] | LegacyRegion>
-  floating?: MaybeArray<NonNullable<CypressCheckSettings['floatingRegions']>[number] | (({element: Element} | Selector | LegacyRegion) & {maxUpOffset?: number; maxDownOffset?: number; maxLeftOffset?: number; maxRightOffset?: number})>
-  accessibility?: MaybeArray<NonNullable<CypressCheckSettings['accessibilityRegions']>[number] | (({element: Element} | Selector | LegacyRegion) & {accessibilityType?: api.AccessibilityRegionTypePlain})>
+  ignore?: MaybeArray<NonNullable<CypressCheckSettings['ignoreRegions']>[number] | LegacyRegion | ElementWithOptions>
+  layout?: MaybeArray<NonNullable<CypressCheckSettings['layoutRegions']>[number] | LegacyRegion| ElementWithOptions>
+  content?: MaybeArray<NonNullable<CypressCheckSettings['contentRegions']>[number] | LegacyRegion| ElementWithOptions>
+  strict?: MaybeArray<NonNullable<CypressCheckSettings['strictRegions']>[number] | LegacyRegion | ElementWithOptions>
+  floating?: MaybeArray<NonNullable<CypressCheckSettings['floatingRegions']>[number] | ((ElementWithOptions | Selector | LegacyRegion) & {maxUpOffset?: number; maxDownOffset?: number; maxLeftOffset?: number; maxRightOffset?: number})>
+  accessibility?: MaybeArray<NonNullable<CypressCheckSettings['accessibilityRegions']>[number] | ((ElementWithOptions | Selector | LegacyRegion) & {accessibilityType?: api.AccessibilityRegionTypePlain})>
   scriptHooks?: CypressCheckSettings['hooks']
   ignoreCaret?: boolean
   ignoreDisplacements?: boolean

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applitools/eyes-cypress",
-  "version": "3.28.1",
+  "version": "3.28.2",
   "repository": {
     "type": "git",
     "url": "git://github.com/applitools/eyes.sdk.javascript1.git",
@@ -56,11 +56,11 @@
     }
   },
   "dependencies": {
-    "@applitools/core": "1.3.7",
-    "@applitools/eyes-api": "1.11.6",
+    "@applitools/core": "1.4.0",
+    "@applitools/eyes-api": "1.12.0",
     "@applitools/eyes-universal": "2.18.0",
     "@applitools/functional-commons": "1.6.0",
-    "@applitools/logger": "1.1.36",
+    "@applitools/logger": "1.1.40",
     "chalk": "3.0.0",
     "semver": "7.3.8",
     "uuid": "8.3.2",
@@ -68,13 +68,13 @@
     "ws": "8.5.0"
   },
   "devDependencies": {
-    "@applitools/bongo": "^2.2.0",
+    "@applitools/bongo": "^2.2.2",
     "@applitools/scripts": "1.2.0",
     "@applitools/sdk-coverage-tests": "^2.7.10",
     "@applitools/snaptdout": "1.0.1",
-    "@applitools/test-server": "1.1.16",
-    "@applitools/test-utils": "1.5.6",
-    "@applitools/utils": "1.3.22",
+    "@applitools/test-server": "1.1.20",
+    "@applitools/test-utils": "1.5.8",
+    "@applitools/utils": "1.3.26",
     "@types/node": "12",
     "@types/which": "^2.0.1",
     "@types/ws": "^8.2.2",

package/src/browser/eyesCheckMapping.js

@@ -131,6 +131,9 @@ function eyesCheckMapValues({args, refer}) {
 
   function convertAccessabilityRegions(accessibilityRegions) {
     if (!accessibilityRegions) return accessibilityRegions
+    if (!Array.isArray(accessibilityRegions)) {
+      accessibilityRegions = [accessibilityRegions]
+    }
     const accessibility = []
 
     accessibilityRegions.map(region => {
@@ -142,8 +145,9 @@ function eyesCheckMapValues({args, refer}) {
         accessibility.push(accessabilityRegion)
       } else if (region.hasOwnProperty('element')) {
         const elements = refElements(region.element)
+        delete region['element']
         for (const element of elements) {
-          accessibility.push(Object.assign({}, accessabilityRegion, {region: element}))
+          accessibility.push(Object.assign({}, region, accessabilityRegion, {region: element}))
         }
       } else if (region.hasOwnProperty('region')) {
         region.type = region.region.accessibilityType
@@ -165,6 +169,9 @@ function eyesCheckMapValues({args, refer}) {
 
   function convertFloatingRegion(floatingRegions) {
     if (!floatingRegions) return floatingRegions
+    if (!Array.isArray(floatingRegions)) {
+      floatingRegions = [floatingRegions]
+    }
     const floating = []
 
     for (const region of floatingRegions) {
@@ -179,8 +186,9 @@ function eyesCheckMapValues({args, refer}) {
         floating.push(floatingRegion)
       } else if (region.hasOwnProperty('element')) {
         const elements = refElements(region.element)
+        delete region['element']
         for (const element of elements) {
-          floating.push(Object.assign({}, floatingRegion, {region: element}))
+          floating.push(Object.assign({}, region, floatingRegion, {region: element}))
         }
       } else if (region.hasOwnProperty('region')) {
         floating.push(region)

package/src/browser/spec-driver.ts

@@ -1,24 +1,19 @@
 type EyesSelector = {selector: string; type?: string}
-export type Selector = (string | EyesSelector) & {__applitoolsBrand?: never};
-export type Context = Document & {__applitoolsBrand?: never};
-export type Element = HTMLElement & {__applitoolsBrand?: never};
-
-export function executeScript(context: Context, script: string, arg: any): any {     
-
-      let scriptToExecute;
-      if (
-        script.includes('dom-snapshot') ||
-        script.includes('dom-capture') ||
-        script.includes('dom-shared')
-        ) {
-            scriptToExecute = script
-        } else {
-            const prepScirpt = script.replace('function(arg)', 'function func(arg)')
-            scriptToExecute = prepScirpt.concat(' return func(arg)')
-        }
-
-        const executor = new context.defaultView.Function('arg', scriptToExecute);
-        return executor(arg)
+export type Selector = (string | EyesSelector) & {__applitoolsBrand?: never}
+export type Context = Document & {__applitoolsBrand?: never}
+export type Element = HTMLElement & {__applitoolsBrand?: never}
+
+export function executeScript(context: Context, script: string, arg: any): any {
+  let scriptToExecute
+  if (script.includes('dom-snapshot') || script.includes('dom-capture') || script.includes('dom-shared')) {
+    scriptToExecute = script
+  } else {
+    const prepScirpt = script.replace('function(arg)', 'function func(arg)')
+    scriptToExecute = prepScirpt.concat(' return func(arg)')
+  }
+
+  const executor = new context.defaultView.Function('arg', scriptToExecute)
+  return executor(arg)
 }
 
 export function mainContext(): Context {
@@ -30,14 +25,13 @@ export function parentContext(context: Context): Context {
   // because Cypress doesn't support cross origin iframe, then childContext might return null, and then the input to parentContext might be null
   if (!context) {
     throw new Error('Context is not accessible')
-  }; 
-  
+  }
+
   return context === mainContext() ? context : context.defaultView.frameElement.ownerDocument
 }
 
 export function childContext(_context: Context, element: HTMLIFrameElement): Context {
-  if(element.contentDocument)
-    return element.contentDocument
+  if (element.contentDocument) return element.contentDocument
   else {
     throw new Error('Context is not accessible')
   }
@@ -47,48 +41,47 @@ export function getViewportSize(): Object {
   //@ts-ignore
   const currWindow = cy.state('window')
   const viewportSize = {
-    width:  currWindow.innerWidth || currWindow.document.documentElement.clientWidth || currWindow.document.body.clientWidth,
-    height: currWindow.innerHeight || currWindow.document.documentElement.clientHeight || currWindow.document.body.clientHeight
-  };
-  return viewportSize;
+    width: currWindow.innerWidth || currWindow.document.documentElement.clientWidth || currWindow.document.body.clientWidth,
+    height: currWindow.innerHeight || currWindow.document.documentElement.clientHeight || currWindow.document.body.clientHeight,
+  }
+  return viewportSize
 }
 
 export function setViewportSize(vs: any): void {
   //@ts-ignore
-  Cypress.action('cy:viewport:changed', { viewportWidth: vs.size.width, viewportHeight: vs.size.height });
+  Cypress.action('cy:viewport:changed', {viewportWidth: vs.size.width, viewportHeight: vs.size.height})
 }
 
 export function transformSelector(selector: Selector): Selector {
   if (selector.hasOwnProperty('selector') && (!selector.hasOwnProperty('type') || (selector as EyesSelector).type === 'css')) {
     return (selector as EyesSelector).selector
-  } 
+  }
   return selector
 }
 
 export function findElement(context: Context, selector: Selector, parent?: Element) {
-  const eyesSelector = (selector as EyesSelector)
+  const eyesSelector = selector as EyesSelector
   const root = parent ?? context
   const sel = typeof selector === 'string' ? selector : eyesSelector.selector
   if (typeof selector !== 'string' && eyesSelector.type === 'xpath') {
-    return context.evaluate(sel, context, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
+    return context.evaluate(sel, context, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue
   } else {
     return root.querySelector(sel)
   }
 }
 
-export function findElements(context: Context, selector: Selector, parent: Element){
-  const eyesSelector = (selector as EyesSelector)
+export function findElements(context: Context, selector: Selector, parent: Element) {
+  const eyesSelector = selector as EyesSelector
   const root = parent ?? context
   const sel = typeof selector === 'string' ? selector : eyesSelector.selector
   if (typeof selector !== 'string' && eyesSelector.type === 'xpath') {
-    const results = [];
-    const queryResult = document.evaluate(sel, context,
-        null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
+    const results = []
+    const queryResult = document.evaluate(sel, context, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null)
 
     for (let i = 0; i < queryResult.snapshotLength; i++) {
-        results.push(queryResult.snapshotItem(i));
+      results.push(queryResult.snapshotItem(i))
     }
-    return results;
+    return results
   } else {
     return root.querySelectorAll(sel)
   }
@@ -107,9 +100,8 @@ export function getCookies(): Array<any> {
   return Cypress.automation('get:cookies', {})
 }
 
-
 // export function takeScreenshot(page: Driver): Promise<Buffer>;
 
 // export function visit(page: Driver, url: string): Promise<void>; (??)
 
-// export function isStaleElementError(err: any): boolean;
+// export function isStaleElementError(err: any): boolean;