{"id":13583306,"url":"https://github.com/webdriverio/cucumber-boilerplate","last_synced_at":"2025-05-14T18:05:09.180Z","repository":{"id":23810493,"uuid":"27186848","full_name":"webdriverio/cucumber-boilerplate","owner":"webdriverio","description":"Boilerplate project to run WebdriverIO tests with Cucumber","archived":false,"fork":false,"pushed_at":"2024-12-16T11:20:29.000Z","size":6931,"stargazers_count":536,"open_issues_count":15,"forks_count":320,"subscribers_count":32,"default_branch":"main","last_synced_at":"2025-05-11T14:40:04.194Z","etag":null,"topics":["boilerplate","cucumber","webdriverio"],"latest_commit_sha":null,"homepage":"http://webdriver.io","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/webdriverio.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":".github/CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"tidelift":"npm/webdriverio","open_collective":"webdriverio"}},"created_at":"2014-11-26T16:57:45.000Z","updated_at":"2025-04-14T17:47:35.000Z","dependencies_parsed_at":"2024-02-01T03:04:28.666Z","dependency_job_id":"315a2a2b-8ceb-42a8-aa97-451e4e6bf026","html_url":"https://github.com/webdriverio/cucumber-boilerplate","commit_stats":{"total_commits":1133,"total_committers":45,"mean_commits":"25.177777777777777","dds":0.4783759929390997,"last_synced_commit":"805b91fa2fd124795376be28faef8971bd8e7434"},"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webdriverio%2Fcucumber-boilerplate","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webdriverio%2Fcucumber-boilerplate/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webdriverio%2Fcucumber-boilerplate/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webdriverio%2Fcucumber-boilerplate/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/webdriverio","download_url":"https://codeload.github.com/webdriverio/cucumber-boilerplate/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254198514,"owners_count":22030965,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["boilerplate","cucumber","webdriverio"],"created_at":"2024-08-01T15:03:23.431Z","updated_at":"2025-05-14T18:05:04.170Z","avatar_url":"https://github.com/webdriverio.png","language":"JavaScript","funding_links":["https://tidelift.com/funding/github/npm/webdriverio","https://opencollective.com/webdriverio"],"categories":["JavaScript"],"sub_categories":[],"readme":"Cucumber Boilerplate [![Test](https://github.com/webdriverio/cucumber-boilerplate/actions/workflows/test.yaml/badge.svg)](https://github.com/webdriverio/cucumber-boilerplate/actions/workflows/test.yaml)\n====================\n\nBoilerplate project to run WebdriverIO (alpha v8) tests with [Cucumber](https://cucumber.io/) and brings **true** [BDD](http://en.wikipedia.org/wiki/Behavior-driven_development) to JavaScript. Instead of writing complicated test code that only developers can understand, Cucumber maps an ordinary language to code and allows to start with the test process in the early stages of your product development.\n\n__Note:__ If you are still using an older WebdriverIO version, check out the [`v7`](https://github.com/webdriverio/cucumber-boilerplate/tree/v7) branch.\n\n## Requirements\n\n- Node version 14 or higher\n- A preconfigured Selenium Grid, preinstalled browser driver or cloud provider account\n\nAlthough this project works fine with NPM we recommend to use Yarn (\u003e= 1.0.0) instead,  due to its speed \u0026 solid dependency locking mechanism. To keep things simple we use yarn in this guide, but feel free to replace this with NPM if that is what you are using.\n\nAlso this project doesn't cover setting up a proper test environment. You need to download specific browser driver yourself and run the prior starting tests or use a cloud provider like [SauceLabs](https://saucelabs.com/).\n\n## Quick start\n\nChoose one of the following options:\n\n1. Download the latest stable release [here](https://github.com/webdriverio/cucumber-boilerplate/archive/main.zip) or clone the git repo — `git clone https://github.com/webdriverio/cucumber-boilerplate.git`\n\n2. Then:\n- Copy the files to your project into a directory like `/integrationtests` (note the hidden files!)\n\n3. Clean the project (Optional):\n- *On OSX/Linux:*\n-- Run `yarn run clean`\n\n- *On Windows:*\n-- Remove the directories `/.git`, `/.github`, `/demo-app` \u0026 `/test`\n-- Remove the files `.travis.yml`, `jest.json` \u0026 `wdio.BUILD.conf.js`\n-- Remove all the demo features from the `/src/features` directory\n\n4. Install the dependencies (`yarn install`)\n\nNow you are ready to write your own features.\n\n## Features\n\n- Super simple setup\n- Full integration with [WebdriverIO](http://webdriver.io/)\n- Over 150 predefined steps that cover almost everything you need, you can start writing tests right away\n- Easy integration with cloud services like [Sauce Labs](https://saucelabs.com/)\n- Integration of WebdriverIO's Multiremote functionality\n- Easy to run tests in parallel\n\n# How to write a test\n\nTests are written in [Gherkin syntax](https://cucumber.io/docs/gherkin/)\nthat means that you write down what's supposed to happen in a real language. All test files are located in\n`./src/features/*` and have the file ending `.feature`. You will already find some test files in that\ndirectory. They should demonstrate, how tests could look like. Just create a new file and write your first\ntest.\n\n__myFirstTest.feature__\n```gherkin\nFeature:\n    In order to keep my product stable\n    As a developer or product manager\n    I want to make sure that everything works as expected\n\nScenario: Check title of website after search\n    Given I open the url \"http://google.com\"\n    When I set \"WebdriverIO\" to the inputfield \"#lst-ib\"\n    And I press \"Enter\"\n    Then I expect that the title is \"WebdriverIO - Google Search\"\n\nScenario: Another test\n    Given ...\n\n```\n\nThis test opens the browser and navigates them to google.com to check if the title contains the search\nquery after doing a search. As you can see, it is pretty simple and understandable for everyone.\n\n# How to run the test\n\nStart the local web server:\n\n```sh\n$ yarn run test\n```\n\nTo run your tests just call the [WDIO runner](http://webdriver.io/guide/testrunner/gettingstarted.html):\n\n```sh\n$ yarn run wdio\n```\n\n_please note_ The WDIO runner uses the configuration file `wdio.conf.js` by default.\n\n# Configurations\n\nTo configure your tests, checkout the [`wdio.conf.js`](https://github.com/webdriverio/cucumber-boilerplate/blob/main/wdio.conf.js) file in your test directory. It comes with a bunch of documented options you can choose from.\n\n## Environment-specific configurations\n\nYou can setup multiple configs for specific environments. Let's say you want to have a different `baseUrl` for\nyour local and pre-deploy tests. Use the `wdio.conf.js` to set all general configs (like mochaOpts) that don't change.\nThey act as default values. For each different environment you can create a new config with the following name\nscheme:\n\n```txt\nwdio.\u003cENVIRONMENT\u003e.conf.js\n```\n\nNow you can create a specific config for your pre-deploy tests:\n\n__wdio.STAGING.conf.js__\n```js\nvar config = require('./wdio.conf.js').config;\n\nconfig.baseUrl = 'http://staging.example.com'\n\nexports.config = config;\n```\n\nYour environment-specific config file will get merged into the default config file and overwrites the values you set.\nTo run a test in a specific environment just add the desired configuration file as the first parameter:\n\n```sh\n$ yarn run wdio wdio.STAGING.conf.js\n```\n\n# Running single feature\nSometimes it's useful to only execute a single feature file, to do so use the following command:\n\n```sh\n$ npx wdio wdio.conf.js --spec ./test/features/select.feature\n```\n\n\n# Using tags\n\nIf you want to run only specific tests you can mark your features with tags. These tags will be placed before each feature like so:\n\n```gherkin\n@Tag\nFeature: ...\n```\n\nTo run only the tests with specific tag(s) use the `--cucumberOpts.tagExpression=` parameter like so:\n\n```sh\n$ npx wdio wdio.conf.js --cucumberOpts.tagExpression='@Tag or @AnotherTag'\n```\n\nFor more tag options please see the [Cucumber.js documentation](https://docs.cucumber.io/tag-expressions/)\n\n# Pending test\n\nIf you have failing or unimplemented tests you can mark them as \"Pending\" so they will get skipped.\n\n```gherkin\n// skip whole feature file\n@Pending\nFeature: ...\n\n// only skip a single scenario\n@Pending\nScenario: ...\n```\n\n# Adding new steps and snippets\n\nThe predefined snippets allow you to do a lot of common things but you might need extra snippets which\nare better aligned with your aims. To do so you will find all step definitions in `./src/steps`. They\nare separated in `given`, `when` and `then`.\n\nYou define your snippet using regular expressions. This is pretty powerful as it allows you to create complex\nsentences with multiple options. Everything that's within `\"([^\"]*)?\"` gets captured and appended to the\ncallback. The last argument is always a callback function that you need to call when your step is done.\nYou can access the browser and your WebdriverIO instance with `browser`.\n\nTo assert values this boilerplate project uses WebdriverIOs embedded assertion library called [expect-webdriverio](https://www.npmjs.com/package/expect-webdriverio).\n\n# Comments\n\nYou can add additional descriptive comments in your feature files.\n\n```gherkin\n###\n  This is a\n  block comment\n###\nFeature: As a bystander\n    I can watch bottles falling from a wall\n    So that I can be mildly amused\n\n# This is a single line comment\nScenario: check if username is present\n    Given I login as \"roboter\" with password \"test123\"\n    Then the username \"roboter\" should be present in the header\n```\n\n# List of predefined steps\n\nCheck out all predefined snippets. You can see how they get used in [`sampleSnippets.feature`](https://github.com/webdriverio/cucumber-boilerplate/blob/main/src/features/sampleSnippets.feature).\n\n## Given steps\n\n- `I open the (url|site) \"([^\"]*)?\"` \u003cbr\u003eOpen a site in the current browser window/tab\n- `the element \"([^\"]*)?\" is( not)* displayed` \u003cbr\u003eCheck the (in)visibility of an element\n- `the element \"([^\"]*)?\" is( not)* enabled` \u003cbr\u003eCheck if an element is (not) enabled\n- `the element \"([^\"]*)?\" is( not)* selected` \u003cbr\u003eCheck if an element is (not) selected\n- `the checkbox \"([^\"]*)?\" is( not)* checked` \u003cbr\u003eCheck if a checkbox is (not) checked\n- `there is (an|no) element \"([^\"]*)?\" on the page` \u003cbr\u003eCheck if an element (does not) exist\n- `the title is( not)* \"([^\"]*)?\"` \u003cbr\u003eCheck the title of the current browser window/tab\n- `the element \"([^\"]*)?\" contains( not)* the same text as element \"([^\"]*)?\"` \u003cbr\u003eCompare the text of two elements\n- `the (button|element) \"([^\"]*)?\"( not)* contains the text \"([^\"]*)?\"` \u003cbr\u003eCheck if an element contains the given text\n- `the (button|element) \"([^\"]*)?\"( not)* contains any text` \u003cbr\u003eCheck if an element does not contain any text\n- `the (button|element) \"([^\"]*)?\" is( not)* empty` \u003cbr\u003eCheck if an element is empty\n- `the page url is( not)* \"([^\"]*)?\"` \u003cbr\u003eCheck the url of the current browser window/tab\n- `the( css)* attribute \"([^\"]*)?\" from element \"([^\"]*)?\" is( not)* \"([^\"]*)?\"` \u003cbr\u003eCheck the value of an element's (css) attribute\n- `the cookie \"([^\"]*)?\" contains( not)* the value \"([^\"]*)?\"` \u003cbr\u003eCheck the value of a cookie\n- `the cookie \"([^\"]*)?\" does( not)* exist` \u003cbr\u003eCheck the existence of a cookie\n- `the element \"([^\"]*)?\" is( not)* ([\\d]+)px (broad|tall)` \u003cbr\u003eCheck the width/height of an element\n- `the element \"([^\"]*)?\" is( not)* positioned at ([\\d]+)px on the (x|y) axis` \u003cbr\u003eCheck the position of an element\n- `I have a screen that is ([\\d]+) by ([\\d]+) pixels` \u003cbr\u003eSet the browser size to a given size\n- `I have closed all but the first (window|tab)` \u003cbr\u003eClose all but the first browser window/tab\n- `a (alertbox|confirmbox|prompt) is( not)* opened` \u003cbr\u003eCheck if a modal is opened\n\n## Then steps\n\n- `I expect that the title is( not)* \"([^\"]*)?\"` \u003cbr\u003eCheck the title of the current browser window/tab\n- `I expect that element \"([^\"]*)?\" does( not)* appear exactly \"([^\"]*)?\" times` \u003cbr\u003eChecks that the element is on the page a specific number of times\n- `I expect that element \"([^\"]*)?\" is( not)* visible` \u003cbr\u003eCheck if a certain element is visible\n- `I expect that element \"([^\"]*)?\" becomes( not)* visible` \u003cbr\u003eCheck if a certain element becomes visible\n- `I expect that element \"([^\"]*)?\" is( not)* within the viewport` \u003cbr\u003eCheck if a certain element is within the current viewport\n- `I expect that element \"([^\"]*)?\" does( not)* exist` \u003cbr\u003eCheck if a certain element exists\n- `I expect that element \"([^\"]*)?\"( not)* contains the same text as element \"([^\"]*)?\"` \u003cbr\u003eCompare the text of two elements\n- `I expect that (button|element) \"([^\"]*)?\"( not)* contains the text \"([^\"]*)?\"` \u003cbr\u003eCheck if an element or input field contains the given text\n- `I expect that (button|element) \"([^\"]*)?\"( not)* contains any text` \u003cbr\u003eCheck if an element or input field contains any text\n- `I expect that (button|elementelement) \"([^\"]*)?\" is( not)* empty` \u003cbr\u003eCheck if an element or input field is empty\n- `I expect that the url is( not)* \"([^\"]*)?\"` \u003cbr\u003eCheck if the the URL of the current browser window/tab is a certain string\n- `I expect that the path is( not)* \"([^\"]*)?\"` \u003cbr\u003eCheck if the path of the URL of the current browser window/tab is a certain string\n- `I expect the url to( not)* contain \"([^\"]*)?\"` \u003cbr\u003eCheck if the URL of the current browser window/tab contains a certain string\n- `I expect that the( css)* attribute \"([^\"]*)?\" from element \"([^\"]*)?\" is( not)* \"([^\"]*)?\"` \u003cbr\u003eCheck the value of an element's (css) attribute\n- `I expect that checkbox \"([^\"]*)?\" is( not)* checked` \u003cbr\u003eCheck if a check-box is (not) checked\n- `I expect that element \"([^\"]*)?\" is( not)* selected` \u003cbr\u003eCheck if an element is (not) selected\n- `I expect that element \"([^\"]*)?\" is( not)* enabled` \u003cbr\u003eCheck if an element is (not) enabled\n- `I expect that cookie \"([^\"]*)?\"( not)* contains \"([^\"]*)?\"` \u003cbr\u003eCheck if a cookie with a certain name contains a certain value\n- `I expect that cookie \"([^\"]*)?\"( not)* exists` \u003cbr\u003eCheck if a cookie with a certain name exist\n- `I expect that element \"([^\"]*)?\" is( not)* ([\\d]+)px (broad|tall)` \u003cbr\u003eCheck the width/height of an element\n- `I expect that element \"([^\"]*)?\" is( not)* positioned at ([\\d]+)px on the (x|y) axis` \u003cbr\u003eCheck the position of an element\n- `I expect that element \"([^\"]*)?\" (has|does not have) the class \"([^\"]*)?\"` \u003cbr\u003eCheck if an element has a certain class\n- `I expect a new (window|tab) has( not)* been opened` \u003cbr\u003eCheck if a new window/tab has been opened\n- `I expect the url \"([^\"]*)?\" is opened in a new (tab|window)` \u003cbr\u003eCheck if a URL is opened in a new browser window/tab\n- `I expect that element \"([^\"]*)?\" is( not)* focused` \u003cbr\u003eCheck if an element has the focus\n- `I wait on element \"([^\"]*)?\"( for (\\d+)ms)*( to( not)* (be checked|be enabled|be selected|be visible|contain a text|contain a value|exist))*` \u003cbr\u003eWait for an element to be checked, enabled, selected, visible, contain a certain value or text or to exist\n- `I expect that a (alertbox|confirmbox|prompt) is( not)* opened` \u003cbr\u003eCheck if a modal is opened\n- `I expect that a (alertbox|confirmbox|prompt)( not)* contains the text \"$text\"` \u003cbr\u003eCheck the text of a modal\n\n## When steps\n\n- `I (click|doubleclick) on the (link|button|element) \"([^\"]*)?\"` \u003cbr\u003e(Double)click a link, button or element\n- `I (add|set) \"([^\"]*)?\" to the inputfield \"([^\"]*)?\"` \u003cbr\u003eAdd or set the content of an input field\n- `I clear the inputfield \"([^\"]*)?\"` \u003cbr\u003eClear an input field\n- `I drag element \"([^\"]*)?\" to element \"([^\"]*)?\"` \u003cbr\u003eDrag an element to another element\n- `I submit the form \"([^\"]*)?\"` \u003cbr\u003eSubmit a form\n- `I pause for (\\d+)ms` \u003cbr\u003ePause for a certain number of milliseconds\n- `I set a cookie \"([^\"]*)?\" with the content \"([^\"]*)?\"` \u003cbr\u003eSet the content of a cookie with the given name to  the given string\n- `I delete the cookie \"([^\"]*)?\"` \u003cbr\u003eDelete the cookie with the given name\n- `I press \"([^\"]*)?\"` \u003cbr\u003ePress a given key. You’ll find all supported characters [here](https://w3c.github.io/webdriver/webdriver-spec.html#keyboard-actions). To do that, the value has to correspond to a key from the table.\n- `I (accept|dismiss) the (alertbox|confirmbox|prompt)` \u003cbr\u003eAccept or dismiss a modal window\n- `I enter \"([^\"]*)?\" into the prompt` \u003cbr\u003eEnter a given text into a modal prompt\n- `I scroll to element \"([^\"]*)?\"` \u003cbr\u003eScroll to a given element\n- `I close the last opened (window|tab)` \u003cbr\u003eClose the last opened browser window/tab\n- `I focus the last opened (window|tab)` \u003cbr\u003eFocus the last opened browser window/tab\n- `I select the (\\d+)(st|nd|rd|th) option for element \"([^\"]*)?\"` \u003cbr\u003eSelect an option based on it's index\n- `I select the option with the (name|value|text) \"([^\"]*)?\" for element \"([^\"]*)?\"` \u003cbr\u003eSelect an option based on its name, value or visible text\n- `I move to element \"([^\"]*)?\"( with an offset of (\\d+),(\\d+))` \u003cbr\u003eMove the mouse by an (optional) offset of the specified element\n- `I switch to the iframe \"([^\"]*)?\"` \u003cbr\u003eSwitch to a particular iFrame on the webpage\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwebdriverio%2Fcucumber-boilerplate","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwebdriverio%2Fcucumber-boilerplate","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwebdriverio%2Fcucumber-boilerplate/lists"}