CodeceptJS BDD

UI/API Test Automation Framework: WebdriverIO & Playwright with Cucumber & Mocha-stylig features/scenarios

• Webdriver and Playwright parity: Write one test, Run on both drivers
• BDD Cucumber and traditional Mocha-styled
• SauceLabs and Selenoid integrations
• Applitools, Appium integrations
• Ease of Automating Salesforce Apps
  • Exclusive Shadow DOM support for LWC/LWR applications, WebComponents
  • WebdriverIO parity with Playwright to work with Shadow Elements
• and many more features

Website: Codeceptjs-BDD Framework Documentations

Get Started

One line Setup,

npx create-codeceptjs-bdd-tests

Supported Node engine,

 "engines": {
        "yarn": ">=3.1.0",
        "node": ">=14.3.0 <15.0.0"
    },

This Interactive CLI walks you through the step-step setup. It will setup,

• Executions on both Webdriver & Playwright.
• Create the framework structure with page objects, helpers, plugins, test env files etc.
• Integrate Sauce Labs with framework
• Provides default BDD & Mocha-style example scenarios to start with
• Setup Parallel executions, and many more

Above command will also add Webdriver parity with Playwright to work with Shadow elements.

Example of out-of-the-box ShadowDOM support for WebComponents (LWC for Salesforce) & Applitools

Take a look at here

Execute

Webdriver

yarn acceptance --profile webdriver:chrome

Playwright

yarn acceptance --profile playwright:chrome
yarn acceptance --profile playwright:safari
yarn acceptance --profile playwright:firefox
yarn acceptance --profile playwright:google:chrome

Mobile or Tablets

yarn acceptance --profile device:'iPhone 11':safari

List of devices

Sauce Labs

yarn acceptance --profile sauce:chrome
yarn acceptance --profile sauce:"macOS 11.00":firefox:80

Parallel

yarn acceptance:parallel --profile playwright:chrome

Headless

HEADLESS=true yarn acceptance:parallel --profile playwright:chrome

For more info about the framework visit CodeceptJS BDD Docs & https://codecept.io/

Ease of working with Shadow Elements. Webdriver & Playwright Parity

Assuming you've enabled the Shadow DOM Support thru the CLI framework setup.

Let's say you want to fill-field on the Shadow element on this Lighting Web Components page: https://recipes.lwc.dev/. You aren't required to provide the DOM Hierarchy in this framework and still, it will find the elements thru Webdriver (Playwright has default support). Meaning, it provides the Playwright parity with Webdriver.

Means, same tests can run on both: Webdriver & Playwright.

So, all you need to provide unique CSS as shown below,

I.fillField('ui-input input','codeceptjs-bdd')

There may be cases that doesn't require you to deal with Shadow Element, e.g. plain login page, you can disable the Shadow Locators finder by providing CSS objects, e.g.

I.fillField({css: 'div.username'},'myusername');
I.fillField({css: 'div.password'},'******');

Have any questions? Join Slack community for more help

Slack Chat and join channel #codeceptjs-bdd for any specific questions about this framework

🚚 Changelog

Link to Changelog

🎥 How to Videos

Contributors

Thanks goes to these wonderful people who are and will have contributing to this awesome project!