codeceptjs 4.0.0-beta.4 → 4.0.0-beta.6.esm-aria

package/lib/helper/WebDriver.js

@@ -1,48 +1,44 @@
 let webdriverio
 
-const assert = require('assert')
-const path = require('path')
-
-const Helper = require('@codeceptjs/helper')
-const promiseRetry = require('promise-retry')
-const stringIncludes = require('../assert/include').includes
-const { urlEquals, equals } = require('../assert/equal')
-const { debug } = require('../output')
-const { empty } = require('../assert/empty')
-const { truth } = require('../assert/truth')
-const {
-  xpathLocator,
-  fileExists,
-  decodeUrl,
-  chunkArray,
-  convertCssPropertiesToCamelCase,
-  screenshotOutputFolder,
-  getNormalizedKeyAttributeValue,
-  modifierKeys,
-} = require('../utils')
-const { isColorProperty, convertColorToRGBA } = require('../colorUtils')
-const ElementNotFound = require('./errors/ElementNotFound')
-const ConnectionRefused = require('./errors/ConnectionRefused')
-const Locator = require('../locator')
-const { highlightElement } = require('./scripts/highlightElement')
-const { focusElement } = require('./scripts/focusElement')
-const { blurElement } = require('./scripts/blurElement')
-const {
-  dontSeeElementError,
-  seeElementError,
-  seeElementInDOMError,
-  dontSeeElementInDOMError,
-} = require('./errors/ElementAssertion')
-const {
-  dontSeeTraffic,
-  seeTraffic,
-  grabRecordedNetworkTraffics,
-  stopRecordingTraffic,
-  flushNetworkTraffics,
-} = require('./network/actions')
+import assert from 'assert'
+import path from 'path'
+import crypto from 'crypto'
+import Helper from '@codeceptjs/helper'
+import promiseRetry from 'promise-retry'
+import { includes as stringIncludes } from '../assert/include.js'
+import { urlEquals, equals } from '../assert/equal.js'
+import store from '../store.js'
+import output from '../output.js'
+const { debug } = output
+import { empty } from '../assert/empty.js'
+import { truth } from '../assert/truth.js'
+import { xpathLocator, fileExists, decodeUrl, chunkArray, convertCssPropertiesToCamelCase, screenshotOutputFolder, getNormalizedKeyAttributeValue, modifierKeys } from '../utils.js'
+import { isColorProperty, convertColorToRGBA } from '../colorUtils.js'
+import ElementNotFound from './errors/ElementNotFound.js'
+import ConnectionRefused from './errors/ConnectionRefused.js'
+import Locator from '../locator.js'
+import { highlightElement } from './scripts/highlightElement.js'
+import { focusElement } from './scripts/focusElement.js'
+import { blurElement } from './scripts/blurElement.js'
+import { dontSeeElementError, seeElementError, seeElementInDOMError, dontSeeElementInDOMError } from './errors/ElementAssertion.js'
+import { dontSeeTraffic, seeTraffic, grabRecordedNetworkTraffics, stopRecordingTraffic, flushNetworkTraffics } from './network/actions.js'
 
 const SHADOW = 'shadow'
 const webRoot = 'body'
+let browserLogs = []
+
+/**
+ * Wraps error objects that don't have a proper message property
+ * This is needed for ESM compatibility with WebdriverIO error handling
+ */
+function wrapError(e) {
+  if (e && typeof e === 'object' && !e.message) {
+    const err = new Error(e.error || e.timeoutMsg || String(e))
+    err.stack = e.stack
+    return err
+  }
+  return e
+}
 
 /**
  * ## Configuration
@@ -53,6 +49,7 @@ const webRoot = 'body'
  * @type {object}
  * @prop {string} url - base url of website to be tested.
  * @prop {string} browser - Browser in which to perform testing.
+ * @prop {boolean} [bidiProtocol=false] - WebDriver Bidi Protocol. Default: false. More info: https://webdriver.io/docs/api/webdriverBidi/
  * @prop {string} [basicAuth] - (optional) the basic authentication to pass to base url. Example: {username: 'username', password: 'password'}
  * @prop {string} [host=localhost] - WebDriver host to connect.
  * @prop {number} [port=4444] - WebDriver port to connect.
@@ -444,7 +441,7 @@ const config = {}
 class WebDriver extends Helper {
   constructor(config) {
     super(config)
-    webdriverio = require('webdriverio')
+    // webdriverio will be loaded dynamically in _init method
 
     // set defaults
     this.root = webRoot
@@ -506,6 +503,10 @@ class WebDriver extends Helper {
       config.capabilities = config.desiredCapabilities
     }
     config.capabilities.browserName = config.browser || config.capabilities.browserName
+
+    // WebDriver Bidi Protocol. Default: false
+    config.capabilities.webSocketUrl = config.bidiProtocol ?? config.capabilities.webSocketUrl ?? true
+
     config.capabilities.browserVersion = config.browserVersion || config.capabilities.browserVersion
     if (config.capabilities.chromeOptions) {
       config.capabilities['goog:chromeOptions'] = config.capabilities.chromeOptions
@@ -546,12 +547,26 @@ class WebDriver extends Helper {
 
   static _checkRequirements() {
     try {
-      require('webdriverio')
+      // In ESM, webdriverio will be checked via dynamic import in _init
+      // The import will fail at module load time if webdriverio is missing
+      return null
     } catch (e) {
       return ['webdriverio@^6.12.1']
     }
   }
 
+  async _init() {
+    // Load webdriverio dynamically
+    if (!webdriverio) {
+      try {
+        webdriverio = await import('webdriverio')
+        webdriverio = webdriverio.default || webdriverio
+      } catch (e) {
+        throw new Error('webdriverio could not be loaded. Please install webdriverio.')
+      }
+    }
+  }
+
   static _config() {
     return [
       {
@@ -595,10 +610,7 @@ class WebDriver extends Helper {
   }
 
   async _res(locator) {
-    const res =
-      this._isShadowLocator(locator) || this._isCustomLocator(locator)
-        ? await this._locate(locator)
-        : await this.$$(withStrictLocator(locator))
+    const res = this._isShadowLocator(locator) || this._isCustomLocator(locator) ? await this._locate(locator) : await this.$$(withStrictLocator(locator))
     return res
   }
 
@@ -631,7 +643,7 @@ class WebDriver extends Helper {
     this.$$ = this.browser.$$.bind(this.browser)
 
     if (this._isCustomLocatorStrategyDefined()) {
-      Object.keys(this.customLocatorStrategies).forEach(async (customLocator) => {
+      Object.keys(this.customLocatorStrategies).forEach(async customLocator => {
         this.debugSection('Weddriver', `adding custom locator strategy: ${customLocator}`)
         const locatorFunction = this._lookupCustomLocator(customLocator)
         this.browser.addLocatorStrategy(customLocator, locatorFunction)
@@ -642,6 +654,11 @@ class WebDriver extends Helper {
       this.browser.capabilities.platformName = this.browser.capabilities.platformName.toLowerCase()
     }
 
+    this.browser.on('dialog', () => {})
+
+    await this.browser.sessionSubscribe({ events: ['log.entryAdded'] })
+    this.browser.on('log.entryAdded', logEvents)
+
     return this.browser
   }
 
@@ -654,6 +671,7 @@ class WebDriver extends Helper {
   }
 
   async _before() {
+    if (!webdriverio) await this._init()
     this.context = this.root
     if (this.options.restart && !this.options.manualStart) return this._startBrowser()
     if (!this.isRunning && !this.options.manualStart) return this._startBrowser()
@@ -667,7 +685,7 @@ class WebDriver extends Helper {
       this.isRunning = false
       return this.browser.deleteSession()
     }
-    if (this.browser.isInsideFrame) await this.browser.switchToFrame(null)
+    if (this.browser.isInsideFrame) await this.browser.switchFrame(null)
 
     if (this.options.keepBrowserState) return
 
@@ -675,10 +693,11 @@ class WebDriver extends Helper {
       this.debugSection('Session', 'cleaning cookies and localStorage')
       await this.browser.deleteCookies()
     }
-    await this.browser.execute('localStorage.clear();').catch((err) => {
+    await this.browser.execute('localStorage.clear();').catch(err => {
       if (!(err.message.indexOf("Storage is disabled inside 'data:' URLs.") > -1)) throw err
     })
     await this.closeOtherTabs()
+    browserLogs = []
     return this.browser
   }
 
@@ -705,17 +724,17 @@ class WebDriver extends Helper {
 
         return browser
       },
-      stop: async (browser) => {
+      stop: async browser => {
         if (!browser) return
         return browser.deleteSession()
       },
-      loadVars: async (browser) => {
+      loadVars: async browser => {
         if (this.context !== this.root) throw new Error("Can't start session inside within block")
         this.browser = browser
         this.$$ = this.browser.$$.bind(this.browser)
         this.sessionWindows[this.activeSessionName] = browser
       },
-      restoreVars: async (session) => {
+      restoreVars: async session => {
         if (!session) {
           this.activeSessionName = ''
         }
@@ -757,7 +776,7 @@ class WebDriver extends Helper {
       this.browser.isInsideFrame = true
       if (Array.isArray(frame)) {
         // this.switchTo(null);
-        await forEachAsync(frame, async (f) => this.switchTo(f))
+        await forEachAsync(frame, async f => this.switchTo(f))
         return
       }
       await this.switchTo(frame)
@@ -835,10 +854,7 @@ class WebDriver extends Helper {
    * @param {object} locator
    */
   async _smartWait(locator) {
-    this.debugSection(
-      `SmartWait (${this.options.smartWait}ms)`,
-      `Locating ${JSON.stringify(locator)} in ${this.options.smartWait}`,
-    )
+    this.debugSection(`SmartWait (${this.options.smartWait}ms)`, `Locating ${JSON.stringify(locator)} in ${this.options.smartWait}`)
     await this.defineTimeout({ implicit: this.options.smartWait })
   }
 
@@ -854,7 +870,7 @@ class WebDriver extends Helper {
    * @param {CodeceptJS.LocatorOrString} locator element located by CSS|XPath|strict locator.
    */
   async _locate(locator, smartWait = false) {
-    if (require('../store').debugMode) smartWait = false
+    if (store.debugMode) smartWait = false
 
     // special locator type for Shadow DOM
     if (this._isShadowLocator(locator)) {
@@ -874,6 +890,17 @@ class WebDriver extends Helper {
       return els
     }
 
+    // special locator type for ARIA roles
+    if (locator.role) {
+      return this._locateByRole(locator)
+    }
+
+    // Handle role locators passed as Locator instances
+    const matchedLocator = new Locator(locator)
+    if (matchedLocator.isRole()) {
+      return this._locateByRole(matchedLocator.locator)
+    }
+
     if (!this.options.smartWait || !smartWait) {
       if (this._isCustomLocator(locator)) {
         const locatorObj = new Locator(locator)
@@ -913,7 +940,7 @@ class WebDriver extends Helper {
    * @param {CodeceptJS.LocatorOrString} locator element located by CSS|XPath|strict locator.
    */
   async _locateCheckable(locator) {
-    return findCheckable.call(this, locator, this.$$.bind(this)).then((res) => res)
+    return findCheckable.call(this, locator, this.$$.bind(this)).then(res => res)
   }
 
   /**
@@ -941,7 +968,35 @@ class WebDriver extends Helper {
    * @param {CodeceptJS.LocatorOrString} locator element located by CSS|XPath|strict locator.
    */
   async _locateFields(locator) {
-    return findFields.call(this, locator).then((res) => res)
+    return findFields.call(this, locator).then(res => res)
+  }
+
+  /**
+   * Locate elements by ARIA role using WebdriverIO accessibility selectors
+   *
+   * @param {object} locator - role locator object { role: string, text?: string, exact?: boolean }
+   */
+  async _locateByRole(locator) {
+    const role = locator.role
+
+    if (!locator.text) {
+      return this.browser.$$(`[role="${role}"]`)
+    }
+
+    const elements = await this.browser.$$(`[role="${role}"]`)
+    const filteredElements = []
+    const matchFn = locator.exact === true
+      ? t => t === locator.text
+      : t => t && t.includes(locator.text)
+
+    for (const element of elements) {
+      const texts = await getElementTextAttributes.call(this, element)
+      if (texts.some(matchFn)) {
+        filteredElements.push(element)
+      }
+    }
+
+    return filteredElements
   }
 
   /**
@@ -1025,7 +1080,7 @@ class WebDriver extends Helper {
     const elem = usingFirstElement(res)
     highlightActiveElement.call(this, elem)
 
-    return this.executeScript((el) => {
+    return this.executeScript(el => {
       if (document.activeElement instanceof HTMLElement) {
         document.activeElement.blur()
       }
@@ -1097,7 +1152,7 @@ class WebDriver extends Helper {
     }
     const elem = usingFirstElement(res)
 
-    return this.executeScript((el) => {
+    return this.executeScript(el => {
       if (document.activeElement instanceof HTMLElement) {
         document.activeElement.blur()
       }
@@ -1160,15 +1215,9 @@ class WebDriver extends Helper {
     }
 
     // select options by visible text
-    let els = await forEachAsync(option, async (opt) =>
-      this.browser.findElementsFromElement(
-        getElementId(elem),
-        'xpath',
-        Locator.select.byVisibleText(xpathLocator.literal(opt)),
-      ),
-    )
+    let els = await forEachAsync(option, async opt => this.browser.findElementsFromElement(getElementId(elem), 'xpath', Locator.select.byVisibleText(xpathLocator.literal(opt))))
 
-    const clickOptionFn = async (el) => {
+    const clickOptionFn = async el => {
       if (el[0]) el = el[0]
       const elementId = getElementId(el)
       if (elementId) return this.browser.elementClick(elementId)
@@ -1178,19 +1227,9 @@ class WebDriver extends Helper {
       return forEachAsync(els, clickOptionFn)
     }
     // select options by value
-    els = await forEachAsync(option, async (opt) =>
-      this.browser.findElementsFromElement(
-        getElementId(elem),
-        'xpath',
-        Locator.select.byValue(xpathLocator.literal(opt)),
-      ),
-    )
+    els = await forEachAsync(option, async opt => this.browser.findElementsFromElement(getElementId(elem), 'xpath', Locator.select.byValue(xpathLocator.literal(opt))))
     if (els.length === 0) {
-      throw new ElementNotFound(
-        select,
-        `Option "${option}" in`,
-        'was not found neither by a visible text nor by a value',
-      )
+      throw new ElementNotFound(select, `Option "${option}" in`, 'was not found neither by a visible text nor by a value')
     }
     return forEachAsync(els, clickOptionFn)
   }
@@ -1217,9 +1256,7 @@ class WebDriver extends Helper {
         this.debugSection('File', 'Uploading file to remote server')
         file = await this.browser.uploadFile(file)
       } catch (err) {
-        throw new Error(
-          `File can't be transferred to remote server. Set \`remoteFileUpload: false\` in config to upload file locally.\n${err.message}`,
-        )
+        throw new Error(`File can't be transferred to remote server. Set \`remoteFileUpload: false\` in config to upload file locally.\n${err.message}`)
       }
     }
 
@@ -1241,7 +1278,8 @@ class WebDriver extends Helper {
     const elementId = getElementId(elem)
     highlightActiveElement.call(this, elem)
 
-    const isSelected = await this.browser.isElementSelected(elementId)
+    const isSelected = await isElementChecked(this.browser, elementId)
+
     if (isSelected) return Promise.resolve(true)
     return this.browser[clickMethod](elementId)
   }
@@ -1261,7 +1299,8 @@ class WebDriver extends Helper {
     const elementId = getElementId(elem)
     highlightActiveElement.call(this, elem)
 
-    const isSelected = await this.browser.isElementSelected(elementId)
+    const isSelected = await isElementChecked(this.browser, elementId)
+
     if (!isSelected) return Promise.resolve(true)
     return this.browser[clickMethod](elementId)
   }
@@ -1272,7 +1311,11 @@ class WebDriver extends Helper {
    */
   async grabTextFromAll(locator) {
     const res = await this._locate(locator, true)
-    const val = await forEachAsync(res, (el) => this.browser.getElementText(getElementId(el)))
+    let val = []
+    await forEachAsync(res, async el => {
+      const text = await this.browser.getElementText(getElementId(el))
+      val.push(text)
+    })
     this.debugSection('GrabText', String(val))
     return val
   }
@@ -1297,7 +1340,7 @@ class WebDriver extends Helper {
    */
   async grabHTMLFromAll(locator) {
     const elems = await this._locate(locator, true)
-    const html = await forEachAsync(elems, (elem) => elem.getHTML(false))
+    const html = await forEachAsync(elems, elem => elem.getHTML(false))
     this.debugSection('GrabHTML', String(html))
     return html
   }
@@ -1322,7 +1365,7 @@ class WebDriver extends Helper {
    */
   async grabValueFromAll(locator) {
     const res = await this._locate(locator, true)
-    const val = await forEachAsync(res, (el) => el.getValue())
+    const val = await forEachAsync(res, el => el.getValue())
     this.debugSection('GrabValue', String(val))
 
     return val
@@ -1347,7 +1390,7 @@ class WebDriver extends Helper {
    */
   async grabCssPropertyFromAll(locator, cssProperty) {
     const res = await this._locate(locator, true)
-    const val = await forEachAsync(res, async (el) => this.browser.getElementCSSValue(getElementId(el), cssProperty))
+    const val = await forEachAsync(res, async el => this.browser.getElementCSSValue(getElementId(el), cssProperty))
     this.debugSection('Grab', String(val))
     return val
   }
@@ -1371,7 +1414,7 @@ class WebDriver extends Helper {
    */
   async grabAttributeFromAll(locator, attr) {
     const res = await this._locate(locator, true)
-    const val = await forEachAsync(res, async (el) => el.getAttribute(attr))
+    const val = await forEachAsync(res, async el => el.getAttribute(attr))
     this.debugSection('GrabAttribute', String(val))
     return val
   }
@@ -1488,7 +1531,7 @@ class WebDriver extends Helper {
   async seeElement(locator) {
     const res = await this._locate(locator, true)
     assertElementExists(res, locator)
-    const selected = await forEachAsync(res, async (el) => el.isDisplayed())
+    const selected = await forEachAsync(res, async el => el.isDisplayed())
     try {
       return truth(`elements of ${new Locator(locator)}`, 'to be seen').assert(selected)
     } catch (e) {
@@ -1505,7 +1548,7 @@ class WebDriver extends Helper {
     if (!res || res.length === 0) {
       return truth(`elements of ${new Locator(locator)}`, 'to be seen').negate(false)
     }
-    const selected = await forEachAsync(res, async (el) => el.isDisplayed())
+    const selected = await forEachAsync(res, async el => el.isDisplayed())
     try {
       return truth(`elements of ${new Locator(locator)}`, 'to be seen').negate(selected)
     } catch (e) {
@@ -1560,11 +1603,7 @@ class WebDriver extends Helper {
    * {{> grabBrowserLogs }}
    */
   async grabBrowserLogs() {
-    if (this.browser.isW3C) {
-      this.debug('Logs not available in W3C specification')
-      return
-    }
-    return this.browser.getLogs('browser')
+    return browserLogs
   }
 
   /**
@@ -1590,11 +1629,7 @@ class WebDriver extends Helper {
    */
   async seeNumberOfElements(locator, num) {
     const res = await this._locate(locator)
-    return assert.equal(
-      res.length,
-      num,
-      `expected number of elements (${new Locator(locator)}) is ${num}, but found ${res.length}`,
-    )
+    return assert.equal(res.length, num, `expected number of elements (${new Locator(locator)}) is ${num}, but found ${res.length}`)
   }
 
   /**
@@ -1603,11 +1638,7 @@ class WebDriver extends Helper {
    */
   async seeNumberOfVisibleElements(locator, num) {
     const res = await this.grabNumberOfVisibleElements(locator)
-    return assert.equal(
-      res,
-      num,
-      `expected number of visible elements (${new Locator(locator)}) is ${num}, but found ${res}`,
-    )
+    return assert.equal(res, num, `expected number of visible elements (${new Locator(locator)}) is ${num}, but found ${res}`)
   }
 
   /**
@@ -1632,19 +1663,16 @@ class WebDriver extends Helper {
       }
     }
 
-    const values = Object.keys(cssPropertiesCamelCase).map((key) => cssPropertiesCamelCase[key])
+    const values = Object.keys(cssPropertiesCamelCase).map(key => cssPropertiesCamelCase[key])
     if (!Array.isArray(props)) props = [props]
     let chunked = chunkArray(props, values.length)
-    chunked = chunked.filter((val) => {
+    chunked = chunked.filter(val => {
       for (let i = 0; i < val.length; ++i) {
-        // eslint-disable-next-line eqeqeq
         if (val[i] != values[i]) return false
       }
       return true
     })
-    return equals(
-      `all elements (${new Locator(locator)}) to have CSS property ${JSON.stringify(cssProperties)}`,
-    ).assert(chunked.length, elemAmount)
+    return equals(`all elements (${new Locator(locator)}) to have CSS property ${JSON.stringify(cssProperties)}`).assert(chunked.length, elemAmount)
   }
 
   /**
@@ -1655,28 +1683,24 @@ class WebDriver extends Helper {
     assertElementExists(res, locator)
     const elemAmount = res.length
 
-    let attrs = await forEachAsync(res, async (el) => {
-      return forEachAsync(Object.keys(attributes), async (attr) => el.getAttribute(attr))
+    let attrs = await forEachAsync(res, async el => {
+      return forEachAsync(Object.keys(attributes), async attr => el.getAttribute(attr))
     })
 
-    const values = Object.keys(attributes).map((key) => attributes[key])
+    const values = Object.keys(attributes).map(key => attributes[key])
     if (!Array.isArray(attrs)) attrs = [attrs]
     let chunked = chunkArray(attrs, values.length)
-    chunked = chunked.filter((val) => {
+    chunked = chunked.filter(val => {
       for (let i = 0; i < val.length; ++i) {
         const _actual = Number.isNaN(val[i]) || typeof values[i] === 'string' ? val[i] : Number.parseInt(val[i], 10)
-        const _expected =
-          Number.isNaN(values[i]) || typeof values[i] === 'string' ? values[i] : Number.parseInt(values[i], 10)
+        const _expected = Number.isNaN(values[i]) || typeof values[i] === 'string' ? values[i] : Number.parseInt(values[i], 10)
         // the attribute could be a boolean
         if (typeof _actual === 'boolean') return _actual === _expected
         if (_actual !== _expected) return false
       }
       return true
     })
-    return assert.ok(
-      chunked.length === elemAmount,
-      `expected all elements (${new Locator(locator)}) to have attributes ${JSON.stringify(attributes)}`,
-    )
+    return assert.ok(chunked.length === elemAmount, `expected all elements (${new Locator(locator)}) to have attributes ${JSON.stringify(attributes)}`)
   }
 
   /**
@@ -1685,9 +1709,9 @@ class WebDriver extends Helper {
   async grabNumberOfVisibleElements(locator) {
     const res = await this._locate(locator)
 
-    let selected = await forEachAsync(res, async (el) => el.isDisplayed())
+    let selected = await forEachAsync(res, async el => el.isDisplayed())
     if (!Array.isArray(selected)) selected = [selected]
-    selected = selected.filter((val) => val === true)
+    selected = selected.filter(val => val === true)
     return selected.length
   }
 
@@ -1805,7 +1829,7 @@ class WebDriver extends Helper {
     try {
       await elem.moveTo({ xOffset, yOffset })
     } catch (e) {
-      debug(e.message)
+      output.debug(e.message)
     }
   }
 
@@ -1841,18 +1865,25 @@ class WebDriver extends Helper {
 
         if (browser) {
           this.debug(`Screenshot of ${sessionName} session has been saved to ${outputFile}`)
-          return browser.saveScreenshot(outputFile)
+          await browser.saveScreenshot(outputFile)
         }
       }
     }
 
     if (!fullPage) {
       this.debug(`Screenshot has been saved to ${outputFile}`)
-      return this.browser.saveScreenshot(outputFile)
+      await this.browser.saveScreenshot(outputFile)
     }
 
     const originalWindowSize = await this.browser.getWindowSize()
 
+    // this case running on device, so we could not set the windowSize
+    if (this.browser.isMobile) {
+      this.debug(`Screenshot has been saved to ${outputFile}, size: ${originalWindowSize.width}x${originalWindowSize.height}`)
+      const buffer = await this.browser.saveScreenshot(outputFile)
+      return buffer
+    }
+
     let { width, height } = await this.browser
       .execute(function () {
         return {
@@ -1860,7 +1891,7 @@ class WebDriver extends Helper {
           width: document.body.scrollWidth,
         }
       })
-      .then((res) => res)
+      .then(res => res)
 
     if (height < 100) height = 500 // errors for very small height
 
@@ -1928,7 +1959,7 @@ class WebDriver extends Helper {
 
     return promiseRetry(
       async (retry, number) => {
-        const _grabCookie = async (name) => {
+        const _grabCookie = async name => {
           const cookie = await this.browser.getCookies([name])
           if (cookie.length === 0) throw Error(`Cookie ${name} is not found after ${retries}s`)
         }
@@ -1952,11 +1983,10 @@ class WebDriver extends Helper {
    * libraries](http://jster.net/category/windows-modals-popups).
    */
   async acceptPopup() {
-    return this.browser.getAlertText().then((res) => {
-      if (res !== null) {
-        return this.browser.acceptAlert()
-      }
-    })
+    const text = await this.browser.getAlertText()
+    if (text) {
+      return await this.browser.acceptAlert()
+    }
   }
 
   /**
@@ -1964,11 +1994,10 @@ class WebDriver extends Helper {
    *
    */
   async cancelPopup() {
-    return this.browser.getAlertText().then((res) => {
-      if (res !== null) {
-        return this.browser.dismissAlert()
-      }
-    })
+    const text = await this.browser.getAlertText()
+    if (text) {
+      return await this.browser.dismissAlert()
+    }
   }
 
   /**
@@ -1978,7 +2007,7 @@ class WebDriver extends Helper {
    * @param {string} text value to check.
    */
   async seeInPopup(text) {
-    return this.browser.getAlertText().then((res) => {
+    return await this.browser.getAlertText().then(res => {
       if (res === null) {
         throw new Error('Popup is not opened')
       }
@@ -2259,9 +2288,9 @@ class WebDriver extends Helper {
   async closeOtherTabs() {
     const handles = await this.browser.getWindowHandles()
     const currentHandle = await this.browser.getWindowHandle()
-    const otherHandles = handles.filter((handle) => handle !== currentHandle)
+    const otherHandles = handles.filter(handle => handle !== currentHandle)
 
-    await forEachAsync(otherHandles, async (handle) => {
+    await forEachAsync(otherHandles, async handle => {
       await this.browser.switchToWindow(handle)
       await this.browser.closeWindow()
     })
@@ -2272,7 +2301,7 @@ class WebDriver extends Helper {
    * {{> wait }}
    */
   async wait(sec) {
-    return new Promise((resolve) => {
+    return new Promise(resolve => {
       setTimeout(resolve, sec * 1000)
     })
   }
@@ -2289,9 +2318,9 @@ class WebDriver extends Helper {
         if (!res || res.length === 0) {
           return false
         }
-        const selected = await forEachAsync(res, async (el) => this.browser.isElementEnabled(getElementId(el)))
+        const selected = await forEachAsync(res, async el => this.browser.isElementEnabled(getElementId(el)))
         if (Array.isArray(selected)) {
-          return selected.filter((val) => val === true).length > 0
+          return selected.filter(val => val === true).length > 0
         }
         return selected
       },
@@ -2329,10 +2358,14 @@ class WebDriver extends Helper {
     res = usingFirstElement(res)
     assertElementExists(res, locator)
 
-    return res.waitForClickable({
-      timeout: waitTimeout * 1000,
-      timeoutMsg: `element ${res.selector} still not clickable after ${waitTimeout} sec`,
-    })
+    return res
+      .waitForClickable({
+        timeout: waitTimeout * 1000,
+        timeoutMsg: `element ${res.selector} still not clickable after ${waitTimeout} sec`,
+      })
+      .catch(e => {
+        throw wrapError(e)
+      })
   }
 
   /**
@@ -2346,14 +2379,15 @@ class WebDriver extends Helper {
     return client
       .waitUntil(
         function () {
-          return this.getUrl().then((res) => {
+          return this.getUrl().then(res => {
             currUrl = decodeUrl(res)
             return currUrl.indexOf(urlPart) > -1
           })
         },
         { timeout: aSec * 1000 },
       )
-      .catch((e) => {
+      .catch(e => {
+        e = wrapError(e)
         if (e.message.indexOf('timeout')) {
           throw new Error(`expected url to include ${urlPart}, but found ${currUrl}`)
         }
@@ -2373,12 +2407,13 @@ class WebDriver extends Helper {
     let currUrl = ''
     return this.browser
       .waitUntil(function () {
-        return this.getUrl().then((res) => {
+        return this.getUrl().then(res => {
           currUrl = decodeUrl(res)
           return currUrl === urlPart
         })
       }, aSec * 1000)
-      .catch((e) => {
+      .catch(e => {
+        e = wrapError(e)
         if (e.message.indexOf('timeout')) {
           throw new Error(`expected url to be ${urlPart}, but found ${currUrl}`)
         }
@@ -2398,9 +2433,9 @@ class WebDriver extends Helper {
       async () => {
         const res = await this.$$(withStrictLocator.call(this, _context))
         if (!res || res.length === 0) return false
-        const selected = await forEachAsync(res, async (el) => this.browser.getElementText(getElementId(el)))
+        const selected = await forEachAsync(res, async el => this.browser.getElementText(getElementId(el)))
         if (Array.isArray(selected)) {
-          return selected.filter((part) => part.indexOf(text) >= 0).length > 0
+          return selected.filter(part => part.indexOf(text) >= 0).length > 0
         }
         return selected.indexOf(text) >= 0
       },
@@ -2422,9 +2457,9 @@ class WebDriver extends Helper {
       async () => {
         const res = await findFields.call(this, field)
         if (!res || res.length === 0) return false
-        const selected = await forEachAsync(res, async (el) => el.getValue())
+        const selected = await forEachAsync(res, async el => el.getValue())
         if (Array.isArray(selected)) {
-          return selected.filter((part) => part.indexOf(value) >= 0).length > 0
+          return selected.filter(part => part.indexOf(value) >= 0).length > 0
         }
         return selected.indexOf(value) >= 0
       },
@@ -2446,9 +2481,9 @@ class WebDriver extends Helper {
       async () => {
         const res = await this._res(locator)
         if (!res || res.length === 0) return false
-        const selected = await forEachAsync(res, async (el) => el.isDisplayed())
+        const selected = await forEachAsync(res, async el => el.isDisplayed())
         if (Array.isArray(selected)) {
-          return selected.filter((val) => val === true).length > 0
+          return selected.filter(val => val === true).length > 0
         }
         return selected
       },
@@ -2465,21 +2500,25 @@ class WebDriver extends Helper {
   async waitNumberOfVisibleElements(locator, num, sec = null) {
     const aSec = sec || this.options.waitForTimeoutInSeconds
 
-    return this.browser.waitUntil(
-      async () => {
-        const res = await this._res(locator)
-        if (!res || res.length === 0) return false
-        let selected = await forEachAsync(res, async (el) => el.isDisplayed())
-
-        if (!Array.isArray(selected)) selected = [selected]
-        selected = selected.filter((val) => val === true)
-        return selected.length === num
-      },
-      {
-        timeout: aSec * 1000,
-        timeoutMsg: `The number of elements (${new Locator(locator)}) is not ${num} after ${aSec} sec`,
-      },
-    )
+    return this.browser
+      .waitUntil(
+        async () => {
+          const res = await this._res(locator)
+          if (!res || res.length === 0) return false
+          let selected = await forEachAsync(res, async el => el.isDisplayed())
+
+          if (!Array.isArray(selected)) selected = [selected]
+          selected = selected.filter(val => val === true)
+          return selected.length === num
+        },
+        {
+          timeout: aSec * 1000,
+          timeoutMsg: `The number of elements (${new Locator(locator)}) is not ${num} after ${aSec} sec`,
+        },
+      )
+      .catch(e => {
+        throw wrapError(e)
+      })
   }
 
   /**
@@ -2492,7 +2531,7 @@ class WebDriver extends Helper {
       async () => {
         const res = await this._res(locator)
         if (!res || res.length === 0) return true
-        const selected = await forEachAsync(res, async (el) => el.isDisplayed())
+        const selected = await forEachAsync(res, async el => el.isDisplayed())
         return !selected.length
       },
       { timeout: aSec * 1000, timeoutMsg: `element (${new Locator(locator)}) still visible after ${aSec} sec` },
@@ -2568,17 +2607,14 @@ class WebDriver extends Helper {
    */
   async switchTo(locator) {
     this.browser.isInsideFrame = true
-    if (Number.isInteger(locator)) {
-      return this.browser.switchToFrame(locator)
-    }
     if (!locator) {
-      return this.browser.switchToFrame(null)
+      return this.browser.switchFrame(null)
     }
 
     let res = await this._locate(locator, true)
     assertElementExists(res, locator)
     res = usingFirstElement(res)
-    return this.browser.switchToFrame(res)
+    return this.browser.switchFrame(res)
   }
 
   /**
@@ -2591,7 +2627,7 @@ class WebDriver extends Helper {
 
     await this.browser.waitUntil(
       async () => {
-        await this.browser.getWindowHandles().then((handles) => {
+        await this.browser.getWindowHandles().then(handles => {
           if (handles.indexOf(current) + num + 1 <= handles.length) {
             target = handles[handles.indexOf(current) + num]
           }
@@ -2613,7 +2649,7 @@ class WebDriver extends Helper {
 
     await this.browser.waitUntil(
       async () => {
-        await this.browser.getWindowHandles().then((handles) => {
+        await this.browser.getWindowHandles().then(handles => {
           if (handles.indexOf(current) - num > -1) {
             target = handles[handles.indexOf(current) - num]
           }
@@ -2639,7 +2675,6 @@ class WebDriver extends Helper {
    */
   async openNewTab(url = 'about:blank', windowName = null) {
     const client = this.browser
-    const crypto = require('crypto')
     if (windowName == null) {
       windowName = crypto.randomBytes(32).toString('hex')
     }
@@ -2683,10 +2718,7 @@ class WebDriver extends Helper {
     return client.execute(function () {
       const body = document.body
       const html = document.documentElement
-      window.scrollTo(
-        0,
-        Math.max(body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight),
-      )
+      window.scrollTo(0, Math.max(body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight))
     })
   }
 
@@ -2760,10 +2792,17 @@ async function proceedSee(assertType, text, context, strict = false) {
   const smartWaitEnabled = assertType === 'assert'
   const res = await this._locate(withStrictLocator(context), smartWaitEnabled)
   assertElementExists(res, context)
-  const selected = await forEachAsync(res, async (el) => this.browser.getElementText(getElementId(el)))
+  let selected = await forEachAsync(res, async el => this.browser.getElementText(getElementId(el)))
+
+  // apply ignoreCase option
+  if (store?.currentStep?.opts?.ignoreCase === true) {
+    text = text.toLowerCase()
+    selected = selected.map(elText => elText.toLowerCase())
+  }
+
   if (strict) {
     if (Array.isArray(selected) && selected.length !== 0) {
-      return selected.map((elText) => equals(description)[assertType](text, elText))
+      return selected.map(elText => equals(description)[assertType](text, elText))
     }
     return equals(description)[assertType](text, selected)
   }
@@ -2791,7 +2830,7 @@ async function forEachAsync(array, callback, options = { expandArrayResults: tru
     const res = await callback(inputArray[index], index, inputArray)
 
     if (Array.isArray(res) && expandArrayResults) {
-      res.forEach((val) => values.push(val))
+      res.forEach(val => values.push(val))
     } else if (res) {
       values.push(res)
     }
@@ -2832,6 +2871,7 @@ async function findClickable(locator, locateFn) {
   }
 
   if (locator.isAccessibilityId() && !this.isWeb) return locateFn(locator, true)
+  if (locator.isRole()) return locateFn(locator, true)
   if (!locator.isFuzzy()) return locateFn(locator, true)
 
   let els
@@ -2846,7 +2886,15 @@ async function findClickable(locator, locateFn) {
   els = await locateFn(Locator.clickable.self(literal))
   if (els.length) return els
 
-  return locateFn(locator.value) // by css or xpath
+  // Try ARIA selector for accessible name
+  try {
+    els = await this.browser.$$(`aria/${locator.value}`)
+    if (els.length) return els
+  } catch (e) {
+    // ARIA selector not supported or failed
+  }
+
+  return await locateFn(locator.value) // by css or xpath
 }
 
 async function findFields(locator) {
@@ -2857,6 +2905,7 @@ async function findFields(locator) {
   }
 
   if (locator.isAccessibilityId() && !this.isWeb) return this._locate(locator, true)
+  if (locator.isRole()) return this._locate(locator, true)
   if (!locator.isFuzzy()) return this._locate(locator, true)
 
   const literal = xpathLocator.literal(locator.value)
@@ -2868,7 +2917,16 @@ async function findFields(locator) {
 
   els = await this._locate(Locator.field.byName(literal))
   if (els.length) return els
-  return this._locate(locator.value) // by css or xpath
+
+  // Try ARIA selector for accessible name
+  try {
+    els = await this.browser.$$(`aria/${locator.value}`)
+    if (els.length) return els
+  } catch (e) {
+    // ARIA selector not supported or failed
+  }
+
+  return await this._locate(locator.value) // by css or xpath
 }
 
 async function proceedSeeField(assertType, field, value) {
@@ -2877,11 +2935,11 @@ async function proceedSeeField(assertType, field, value) {
   const elem = usingFirstElement(res)
   const elemId = getElementId(elem)
 
-  const proceedMultiple = async (fields) => {
+  const proceedMultiple = async fields => {
     const fieldResults = toArray(
-      await forEachAsync(fields, async (el) => {
+      await forEachAsync(fields, async el => {
         const elementId = getElementId(el)
-        return this.browser.isW3C ? el.getValue() : this.browser.getElementAttribute(elementId, 'value')
+        return this.browser.getElementAttribute(elementId, 'value')
       }),
     )
 
@@ -2890,27 +2948,30 @@ async function proceedSeeField(assertType, field, value) {
     } else {
       // Assert that results were found so the forEach assert does not silently pass
       equals(`no. of items matching > 0:  ${field}`)[assertType](true, !!fieldResults.length)
-      fieldResults.forEach((val) => stringIncludes(`fields by ${field}`)[assertType](value, val))
+      fieldResults.forEach(val => stringIncludes(`fields by ${field}`)[assertType](value, val))
     }
   }
 
-  const proceedSingle = (el) =>
-    el.getValue().then((res) => {
-      if (res === null) {
-        throw new Error(`Element ${el.selector} has no value attribute`)
-      }
-      stringIncludes(`fields by ${field}`)[assertType](value, res)
-    })
+  const proceedSingle = async el => {
+    let res = await el.getValue()
 
-  const filterBySelected = async (elements) =>
-    filterAsync(elements, async (el) => this.browser.isElementSelected(getElementId(el)))
+    if (res === null) {
+      res = await el.getText()
+    }
+
+    if (res === null || res === undefined) {
+      throw new Error(`Element ${el.selector} has no value attribute`)
+    }
+
+    stringIncludes(`fields by ${field}`)[assertType](value, res)
+  }
+
+  const filterBySelected = async elements => filterAsync(elements, async el => this.browser.isElementSelected(getElementId(el)))
 
   const filterSelectedByValue = async (elements, value) => {
-    return filterAsync(elements, async (el) => {
+    return filterAsync(elements, async el => {
       const elementId = getElementId(el)
-      const currentValue = this.browser.isW3C
-        ? await el.getValue()
-        : await this.browser.getElementAttribute(elementId, 'value')
+      const currentValue = await this.browser.getElementAttribute(elementId, 'value')
       const isSelected = await this.browser.isElementSelected(elementId)
       return currentValue === value && isSelected
     })
@@ -2918,7 +2979,13 @@ async function proceedSeeField(assertType, field, value) {
 
   const tag = await elem.getTagName()
   if (tag === 'select') {
-    const subOptions = await this.browser.findElementsFromElement(elemId, 'css', 'option')
+    let subOptions
+
+    try {
+      subOptions = await this.browser.findElementsFromElement(elemId, 'css', 'option')
+    } catch (e) {
+      subOptions = await this.browser.findElementsFromElement(elemId, 'xpath', 'option')
+    }
 
     if (value === '') {
       // Don't filter by value
@@ -2959,10 +3026,31 @@ async function proceedSeeCheckbox(assertType, field) {
   const res = await findFields.call(this, field)
   assertElementExists(res, field, 'Field')
 
-  const selected = await forEachAsync(res, async (el) => this.browser.isElementSelected(getElementId(el)))
+  const selected = await forEachAsync(res, async el => {
+    const elementId = getElementId(el)
+    return isElementChecked(this.browser, elementId)
+  })
+
   return truth(`checkable field "${field}"`, 'to be checked')[assertType](selected)
 }
 
+async function getElementTextAttributes(element) {
+  const elementId = getElementId(element)
+  const ariaLabel = await this.browser.getElementAttribute(elementId, 'aria-label').catch(() => '')
+  const placeholder = await this.browser.getElementAttribute(elementId, 'placeholder').catch(() => '')
+  const innerText = await this.browser.getElementText(elementId).catch(() => '')
+  return [ariaLabel, placeholder, innerText]
+}
+
+async function isElementChecked(browser, elementId) {
+  let isChecked = await browser.isElementSelected(elementId)
+  if (!isChecked) {
+    const ariaChecked = await browser.getElementAttribute(elementId, 'aria-checked')
+    isChecked = ariaChecked === 'true'
+  }
+  return isChecked
+}
+
 async function findCheckable(locator, locateFn) {
   let els
   locator = new Locator(locator)
@@ -2972,6 +3060,7 @@ async function findCheckable(locator, locateFn) {
   }
 
   if (locator.isAccessibilityId() && !this.isWeb) return locateFn(locator, true)
+  if (locator.isRole()) return locateFn(locator, true)
   if (!locator.isFuzzy()) return locateFn(locator, true)
 
   const literal = xpathLocator.literal(locator.value)
@@ -2980,7 +3069,15 @@ async function findCheckable(locator, locateFn) {
   els = await locateFn(Locator.checkable.byName(literal))
   if (els.length) return els
 
-  return locateFn(locator.value) // by css or xpath
+  // Try ARIA selector for accessible name
+  try {
+    els = await this.browser.$$(`aria/${locator.value}`)
+    if (els.length) return els
+  } catch (e) {
+    // ARIA selector not supported or failed
+  }
+
+  return await locateFn(locator.value) // by css or xpath
 }
 
 function withStrictLocator(locator) {
@@ -3160,7 +3257,7 @@ function getNormalizedKey(key) {
   return convertKeyToRawKey(normalizedKey)
 }
 
-const unicodeModifierKeys = modifierKeys.map((k) => convertKeyToRawKey(k))
+const unicodeModifierKeys = modifierKeys.map(k => convertKeyToRawKey(k))
 function isModifierKey(key) {
   return unicodeModifierKeys.includes(key)
 }
@@ -3173,9 +3270,9 @@ function highlightActiveElement(element) {
 
 function prepareLocateFn(context) {
   if (!context) return this._locate.bind(this)
-  return (l) => {
+  return l => {
     l = new Locator(l, 'css')
-    return this._locate(context, true).then(async (res) => {
+    return this._locate(context, true).then(async res => {
       assertElementExists(res, context, 'Context element')
       if (l.react) {
         return res[0].react$$(l.react, l.props || undefined)
@@ -3185,4 +3282,8 @@ function prepareLocateFn(context) {
   }
 }
 
-module.exports = WebDriver
+function logEvents(event) {
+  browserLogs.push(event.text) // add log message to the array
+}
+
+export { WebDriver as default }