diff --git a/docs/.vuepress/config.js b/docs/.vuepress/config.js index cade44a00e..dc70466902 100644 --- a/docs/.vuepress/config.js +++ b/docs/.vuepress/config.js @@ -184,7 +184,8 @@ module.exports = { '/core-plugins/unit-jest.md', '/core-plugins/unit-mocha.md', '/core-plugins/e2e-cypress.md', - '/core-plugins/e2e-nightwatch.md' + '/core-plugins/e2e-nightwatch.md', + '/core-plugins/e2e-webdriverio.md' ] }], diff --git a/docs/config/README.md b/docs/config/README.md index f9bdd0f755..5a75a46984 100644 --- a/docs/config/README.md +++ b/docs/config/README.md @@ -446,3 +446,7 @@ See [@vue/cli-plugin-e2e-cypress](https://github.com/vuejs/vue-cli/tree/dev/pack ### Nightwatch See [@vue/cli-plugin-e2e-nightwatch](https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-e2e-nightwatch) for more details. + +### WebdriverIO + +See [@vue/cli-plugin-e2e-webdriverio](https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-e2e-webdriverio) for more details. diff --git a/docs/core-plugins/README.md b/docs/core-plugins/README.md index 1d62026f55..65398ddd13 100644 --- a/docs/core-plugins/README.md +++ b/docs/core-plugins/README.md @@ -12,3 +12,4 @@ This section contains documentation for core Vue CLI plugins: - [Mocha](unit-mocha.md) - [Cypress](e2e-cypress.md) - [Nightwatch](e2e-nightwatch.md) +- [WebdriverIO](e2e-webdriverio.md) diff --git a/docs/core-plugins/e2e-webdriverio.md b/docs/core-plugins/e2e-webdriverio.md new file mode 100644 index 0000000000..b24f9fa142 --- /dev/null +++ b/docs/core-plugins/e2e-webdriverio.md @@ -0,0 +1,64 @@ +# @vue/cli-plugin-e2e-nightwatch + +> e2e-webdriverio plugin for vue-cli + +## Injected Commands + +- **`vue-cli-service test:e2e`** + + Run end-to-end tests with [WebdriverIO](https://webdriver.io/). + + Options: + + ``` + --url run the tests against given url instead of auto-starting dev server + --headless use chrome or firefox in headless mode + --remote run e2e tests on a cloud provider + ``` + + Additionally, all [WebdriverIO CLI options](https://webdriver.io/docs/clioptions.html) are also supported. + E.g.: `--spec`, `--watch` etc. + + +## Project Structure + +The following structure will be generated when installing this plugin. It includes a spec file a page object definition for the Vue.js app as example. + +``` +tests/e2e/ + ├── pageobjects/ + | └── app.page.js + ├── specs/ + | ├── app.spec.js + └── .eslintrc.js +``` + +#### `pageobjects` +Working with page objects is a popular methodology in end-to-end UI testing. See [working with page objects](https://webdriver.io/docs/pageobjects.html) section for details. + +#### `specs` +The main location where tests are located. You can specify specific tests or define suites to run various subsets of these tests. [More info](https://webdriver.io/docs/organizingsuites.html). + +## Installing in an Already Created Project + +``` sh +vue add e2e-webdriverio +``` + +## Running Tests + +By default, all tests inside the `specs` folder will be run using Chrome. If you'd like to run end-to-end tests against Chrome (or Firefox) in headless mode, simply pass the `--headless` argument. + +```sh +$ vue-cli-service test:e2e +``` + +This will run the tests automatically in parallel on Firefox and Chrome. + +**Running a single test** + +To run a single test supply the filename path. E.g.: + +```sh +$ vue-cli-service test:e2e --spec tests/e2e/specs/test.js +```