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

package/lib/helper/REST.js

@@ -1,9 +1,8 @@
-const axios = require('axios').default
-const Helper = require('@codeceptjs/helper')
-const { Agent } = require('https')
-const Secret = require('../secret')
-
-const { beautify } = require('../utils')
+import axios from 'axios'
+import Helper from '@codeceptjs/helper'
+import { Agent } from 'https'
+import Secret from '../secret.js'
+import { beautify } from '../utils.js'
 
 /**
  * ## Configuration
@@ -143,7 +142,9 @@ class REST extends Helper {
 
   static _checkRequirements() {
     try {
-      require('axios')
+      // In ESM, axios is already imported at the top, so no need to check
+      // The import will fail at module load time if axios is missing
+      return null
     } catch (e) {
       return ['axios']
     }
@@ -218,10 +219,18 @@ class REST extends Helper {
       await this.config.onRequest(request)
     }
 
-    this.options.prettyPrintJson ? this.debugSection('Request', beautify(JSON.stringify(_debugRequest))) : this.debugSection('Request', JSON.stringify(_debugRequest))
+    try {
+      this.options.prettyPrintJson ? this.debugSection('Request', beautify(JSON.stringify(_debugRequest))) : this.debugSection('Request', JSON.stringify(_debugRequest))
+    } catch (e) {
+      console.log('[REST] Request:', JSON.stringify(_debugRequest))
+    }
 
     if (this.options.printCurl) {
-      this.debugSection('CURL Request', curlize(request))
+      try {
+        this.debugSection('CURL Request', curlize(request))
+      } catch (e) {
+        console.log('[REST] CURL Request:', curlize(request))
+      }
     }
 
     let response
@@ -229,13 +238,21 @@ class REST extends Helper {
       response = await this.axios(request)
     } catch (err) {
       if (!err.response) throw err
-      this.debugSection('Response', `Response error. Status code: ${err.response.status}`)
+      try {
+        this.debugSection('Response', `Response error. Status code: ${err.response.status}`)
+      } catch (e) {
+        console.log('[REST] Response error. Status code:', err.response.status)
+      }
       response = err.response
     }
     if (this.config.onResponse) {
       await this.config.onResponse(response)
     }
-    this.options.prettyPrintJson ? this.debugSection('Response', beautify(JSON.stringify(response.data))) : this.debugSection('Response', JSON.stringify(response.data))
+    try {
+      this.options.prettyPrintJson ? this.debugSection('Response', beautify(JSON.stringify(response.data))) : this.debugSection('Response', JSON.stringify(response.data))
+    } catch (e) {
+      console.log('[REST] Response:', JSON.stringify(response.data))
+    }
     return response
   }
 
@@ -427,7 +444,7 @@ class REST extends Helper {
   }
 }
 
-module.exports = REST
+export { REST as default }
 
 function curlize(request) {
   if (request.data?.constructor.name.toLowerCase() === 'formdata') return 'cURL is not printed as the request body is not a JSON'

package/lib/helper/WebDriver.js

@@ -1,32 +1,45 @@
 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 store = require('../store')
-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')
-const WebElement = require('../element/WebElement')
+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
  *
@@ -428,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
@@ -534,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 [
       {
@@ -644,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()
@@ -842,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)) {
@@ -862,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)
@@ -933,24 +972,39 @@ class WebDriver extends Helper {
   }
 
   /**
-   * {{> grabWebElements }}
+   * Locate elements by ARIA role using WebdriverIO accessibility selectors
    *
+   * @param {object} locator - role locator object { role: string, text?: string, exact?: boolean }
    */
-  async grabWebElements(locator) {
-    const elements = await this._locate(locator)
-    return elements.map(element => new WebElement(element, this))
+  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
   }
 
   /**
-   * {{> grabWebElement }}
+   * {{> grabWebElements }}
    *
    */
-  async grabWebElement(locator) {
-    const elements = await this._locate(locator)
-    if (elements.length === 0) {
-      throw new ElementNotFound(locator, 'Element')
-    }
-    return new WebElement(elements[0], this)
+  async grabWebElements(locator) {
+    return this._locate(locator)
   }
 
   /**
@@ -1224,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)
   }
@@ -1244,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)
   }
@@ -1773,7 +1829,7 @@ class WebDriver extends Helper {
     try {
       await elem.moveTo({ xOffset, yOffset })
     } catch (e) {
-      debug(e.message)
+      output.debug(e.message)
     }
   }
 
@@ -2302,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)
+      })
   }
 
   /**
@@ -2327,6 +2387,7 @@ class WebDriver extends Helper {
         { timeout: aSec * 1000 },
       )
       .catch(e => {
+        e = wrapError(e)
         if (e.message.indexOf('timeout')) {
           throw new Error(`expected url to include ${urlPart}, but found ${currUrl}`)
         }
@@ -2352,6 +2413,7 @@ class WebDriver extends Helper {
         })
       }, aSec * 1000)
       .catch(e => {
+        e = wrapError(e)
         if (e.message.indexOf('timeout')) {
           throw new Error(`expected url to be ${urlPart}, but found ${currUrl}`)
         }
@@ -2438,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)
+      })
   }
 
   /**
@@ -2609,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')
     }
@@ -2806,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
@@ -2820,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) {
@@ -2831,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)
@@ -2842,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) {
@@ -2868,13 +2952,19 @@ async function proceedSeeField(assertType, field, value) {
     }
   }
 
-  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()
+
+    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)))
 
@@ -2936,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)
@@ -2949,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)
@@ -2957,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) {
@@ -3166,4 +3286,4 @@ function logEvents(event) {
   browserLogs.push(event.text) // add log message to the array
 }
 
-module.exports = WebDriver
+export { WebDriver as default }

package/lib/helper/errors/ConnectionRefused.js

@@ -1,10 +1,10 @@
 function ConnectionRefused(err) {
-  this.message = "Can't connect to WebDriver.\n";
-  this.message += `${err}\n\n`;
-  this.message += 'Please make sure Selenium Server is running and accessible';
-  this.stack = err.stack;
+  this.message = "Can't connect to WebDriver.\n"
+  this.message += `${err}\n\n`
+  this.message += 'Please make sure Selenium Server is running and accessible'
+  this.stack = err.stack
 }
 
-ConnectionRefused.prototype = Object.create(Error.prototype);
+ConnectionRefused.prototype = Object.create(Error.prototype)
 
-module.exports = ConnectionRefused;
+export default ConnectionRefused

package/lib/helper/errors/ElementAssertion.js

@@ -1,38 +1,33 @@
-const Locator = require('../../locator');
+import Locator from '../../locator.js'
 
-const prefixMessage = 'Element';
+const prefixMessage = 'Element'
 
 function seeElementError(locator) {
   if (typeof locator === 'object') {
-    locator = JSON.stringify(locator);
+    locator = JSON.stringify(locator)
   }
-  throw new Error(`${prefixMessage} "${(new Locator(locator))}" is still visible on page.`);
+  throw new Error(`${prefixMessage} "${new Locator(locator)}" is still visible on page.`)
 }
 
 function seeElementInDOMError(locator) {
   if (typeof locator === 'object') {
-    locator = JSON.stringify(locator);
+    locator = JSON.stringify(locator)
   }
-  throw new Error(`${prefixMessage} "${(new Locator(locator))}" is still seen in DOM.`);
+  throw new Error(`${prefixMessage} "${new Locator(locator)}" is still seen in DOM.`)
 }
 
 function dontSeeElementError(locator) {
   if (typeof locator === 'object') {
-    locator = JSON.stringify(locator);
+    locator = JSON.stringify(locator)
   }
-  throw new Error(`${prefixMessage} "${(new Locator(locator))}" is not visible on page.`);
+  throw new Error(`${prefixMessage} "${new Locator(locator)}" is not visible on page.`)
 }
 
 function dontSeeElementInDOMError(locator) {
   if (typeof locator === 'object') {
-    locator = JSON.stringify(locator);
+    locator = JSON.stringify(locator)
   }
-  throw new Error(`${prefixMessage} "${(new Locator(locator))}" is not seen in DOM.`);
+  throw new Error(`${prefixMessage} "${new Locator(locator)}" is not seen in DOM.`)
 }
 
-module.exports = {
-  seeElementError,
-  dontSeeElementError,
-  seeElementInDOMError,
-  dontSeeElementInDOMError,
-};
+export { seeElementError, dontSeeElementError, seeElementInDOMError, dontSeeElementInDOMError }

package/lib/helper/errors/ElementNotFound.js

@@ -1,19 +1,15 @@
-const Locator = require('../../locator');
+import Locator from '../../locator.js'
 /**
  * Uses to throw readable element not found error
  * Stringify object's locators
  */
 class ElementNotFound {
-  constructor(
-    locator,
-    prefixMessage = 'Element',
-    postfixMessage = 'was not found by text|CSS|XPath',
-  ) {
+  constructor(locator, prefixMessage = 'Element', postfixMessage = 'was not found by text|CSS|XPath') {
     if (typeof locator === 'object') {
-      locator = JSON.stringify(locator);
+      locator = JSON.stringify(locator)
     }
-    throw new Error(`${prefixMessage} "${(new Locator(locator))}" ${postfixMessage}`);
+    throw new Error(`${prefixMessage} "${new Locator(locator)}" ${postfixMessage}`)
   }
 }
 
-module.exports = ElementNotFound;
+export default ElementNotFound

package/lib/helper/errors/RemoteBrowserConnectionRefused.js

@@ -1,9 +1,9 @@
 function RemoteBrowserConnectionRefused(err) {
-  this.message = 'Cannot connect to websocket endpoint.\n\n';
-  this.message += 'Please make sure remote browser is running and accessible.';
-  this.stack = err.error || err;
+  this.message = 'Cannot connect to websocket endpoint.\n\n'
+  this.message += 'Please make sure remote browser is running and accessible.'
+  this.stack = err.error || err
 }
 
-RemoteBrowserConnectionRefused.prototype = Object.create(Error.prototype);
+RemoteBrowserConnectionRefused.prototype = Object.create(Error.prototype)
 
-module.exports = RemoteBrowserConnectionRefused;
+export default RemoteBrowserConnectionRefused

package/lib/helper/extras/Console.js

@@ -3,31 +3,31 @@
  */
 class Console {
   constructor() {
-    this._logEntries = [];
+    this._logEntries = []
   }
 
   get entries() {
-    return this._logEntries;
+    return this._logEntries
   }
 
   clear() {
-    this._logEntries = [];
+    this._logEntries = []
   }
 
   includes(msg) {
-    const prev = this._logEntries[this._logEntries.length - 1];
-    if (!prev) return false;
-    const text = msg.text && msg.text() || msg._text || '';
-    const prevText = prev.text && prev.text() || prev._text || '';
-    return text === prevText;
+    const prev = this._logEntries[this._logEntries.length - 1]
+    if (!prev) return false
+    const text = (msg.text && msg.text()) || msg._text || ''
+    const prevText = (prev.text && prev.text()) || prev._text || ''
+    return text === prevText
   }
 
   add(entry) {
     if (Array.isArray(entry)) {
-      this._logEntries = this._logEntries.concat(entry);
+      this._logEntries = this._logEntries.concat(entry)
     }
-    this._logEntries.push(entry);
+    this._logEntries.push(entry)
   }
 }
 
-module.exports = Console;
+export default Console