{"id":22485938,"url":"https://github.com/codeceptjs/vue-cli-plugin-codeceptjs-puppeteer","last_synced_at":"2025-06-30T00:32:49.191Z","repository":{"id":40291083,"uuid":"225976513","full_name":"codeceptjs/vue-cli-plugin-codeceptjs-puppeteer","owner":"codeceptjs","description":"CodeceptJS plugin for Vue CLI","archived":false,"fork":false,"pushed_at":"2023-03-02T07:45:40.000Z","size":998,"stargazers_count":15,"open_issues_count":14,"forks_count":4,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-06-15T15:48:25.109Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://codecept.io","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/codeceptjs.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2019-12-04T23:35:09.000Z","updated_at":"2025-01-18T13:02:24.000Z","dependencies_parsed_at":"2023-02-03T05:45:14.971Z","dependency_job_id":"67e33411-a513-440e-81c7-30d597443f0f","html_url":"https://github.com/codeceptjs/vue-cli-plugin-codeceptjs-puppeteer","commit_stats":{"total_commits":34,"total_committers":6,"mean_commits":5.666666666666667,"dds":0.6470588235294117,"last_synced_commit":"66c5d79a699bb2fe48a82cbffe32e8208b82cd60"},"previous_names":["codecept-js/vue-cli-plugin-codeceptjs-puppeteer"],"tags_count":5,"template":false,"template_full_name":null,"purl":"pkg:github/codeceptjs/vue-cli-plugin-codeceptjs-puppeteer","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codeceptjs%2Fvue-cli-plugin-codeceptjs-puppeteer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codeceptjs%2Fvue-cli-plugin-codeceptjs-puppeteer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codeceptjs%2Fvue-cli-plugin-codeceptjs-puppeteer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codeceptjs%2Fvue-cli-plugin-codeceptjs-puppeteer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/codeceptjs","download_url":"https://codeload.github.com/codeceptjs/vue-cli-plugin-codeceptjs-puppeteer/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codeceptjs%2Fvue-cli-plugin-codeceptjs-puppeteer/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":261120572,"owners_count":23112356,"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":[],"created_at":"2024-12-06T17:13:31.580Z","updated_at":"2025-06-30T00:32:49.171Z","avatar_url":"https://github.com/codeceptjs.png","language":"JavaScript","readme":"# vue-cli-plugin-e2e-codeceptjs\n\n*Hey, how about some end 2 end testing for your Vue apps?* 🤔\n\n*Let's do it together! Vue, me, [CodeceptJS](https://codecept.io) \u0026 [Puppeteer](https://pptr.dev).* 🤗\n\n*Browser testing was never that simple. Just see it!* 😍\n\n```js\nI.amOnPage('/');\nI.click('My Component Button');\nI.see('My Component');\nI.say('I am happy!');\n// that's right, this is a valid test! \n```\n\n## How to try it?\n\n**Requirements:** \n\n* NodeJS \u003e= 8.9\n* NPM / Yarn\n* Vue CLI installed globally\n\n```\nnpm i vue-cli-plugin-codeceptjs-puppeteer --save-dev\n```\n\nThis will install CodeceptJS, CodeceptUI \u0026 Puppeteer with Chrome browser.\n\nTo add CodeceptJS to your project invoke installer:\n\n```\nvue invoke vue-cli-plugin-codeceptjs-puppeteer\n```\n\n\u003e You will be asked about installing a demo component. If you start a fresh project **it is recommended to agree and install a demo component**, so you could see tests passing.\n\n\n## Running Tests\n\nWe added npm scripts:\n\n* `test:e2e` - will execute tests with browser opened. If you installed test component, and started a test server, running this command will show you a brower window passed test.\n  * Use `--headless` option to run browser headlessly\n  * Use `--serve` option to start a dev server before tests \n\n\nExamples:\n\n```\nnpm run test:e2e \nnpm run test:e2e -- --headless\nnpm run test:e2e -- --serve \n```\n\n\u003e This command is a wrapper for `codecept run --steps`. You can use the [Run arguments and options](https://codecept.io/commands#run) here.\n\n* `test:e2e:parallel` - will execute tests headlessly in parallel processes (workers). By default runs tests in 2 workers.\n  * Use an argument to set number of workers\n  * Use `--serve` option to start dev server before running\n\nExamples:\n\n```\nnpm run test:e2e:parallel\nnpm run test:e2e:parallel -- 3\nnpm run test:e2e:parallel -- 3 --serve\n```\n\n\u003e This command is a wrapper for `codecept run-workers 2`. You can use the [Run arguments and options](https://codecept.io/commands#run-workers) here.\n\n* `test:e2e:open` - this opens interactive web test runner. So you could see, review \u0026 run your tests from a browser.\n\n![](https://user-images.githubusercontent.com/220264/70399222-b7a1bc00-1a2a-11ea-8f0b-2878b0328161.gif)\n\n```\nnpm run test:e2e:open\n```\n\n## Directory Structure\n\nGenerator has created these files:\n\n```js\ncodecept.conf.js          👈 codeceptjs config\njsconfig.json             👈 enabling type definitons\ntests\n├── e2e\n│   ├── app_test.js       👈 demo test, edit it!\n│   ├── output            👈 temp directory for screenshots, reports, etc\n│   └── support\n│       └── steps_file.js 👈 common steps\n└── steps.d.ts            👈 type definitions\n```\n\nIf you agreed to create a demo component, you will also see `TestMe` component in `src/components` folder.\n\n## How to write tests?\n\n* Open `tests/e2e/app_js` and see the demo test\n* Execute a test \u0026 use interactive pause to see how CodeceptJS works\n* [Learn CodeceptJS basics](https://codecept.io/basics)\n* [Learn how to write CodeceptJS tests with Puppeteer](https://codecept.io/puppeteer)\n* [See full reference for CodeceptJS Puppeteer Helper](https://codecept.io/helpers/Puppeteer)\n* Ask your questions in [Slack](http://bit.ly/chat-codeceptjs) \u0026 [Forum](https://codecept.discourse.group/)\n\n## Enjoy testing!\n\nTesting is simple \u0026 fun, enjoy it! \n\nWith ❤ [CodeceptJS Team](https://codecept.io)\n","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodeceptjs%2Fvue-cli-plugin-codeceptjs-puppeteer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcodeceptjs%2Fvue-cli-plugin-codeceptjs-puppeteer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodeceptjs%2Fvue-cli-plugin-codeceptjs-puppeteer/lists"}