{"id":24106171,"url":"https://github.com/mikesparr/jest-puppeteer-example","last_synced_at":"2025-05-12T13:23:46.586Z","repository":{"id":38445718,"uuid":"164545458","full_name":"mikesparr/jest-puppeteer-example","owner":"mikesparr","description":"Automated browser test example using Jest and Puppeteer","archived":false,"fork":false,"pushed_at":"2019-01-08T18:29:50.000Z","size":53,"stargazers_count":5,"open_issues_count":0,"forks_count":3,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-31T22:33:06.868Z","etag":null,"topics":["automated-testing","browser","integration-testing","jest","puppeteer"],"latest_commit_sha":null,"homepage":null,"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/mikesparr.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}},"created_at":"2019-01-08T02:57:55.000Z","updated_at":"2024-03-03T06:03:07.000Z","dependencies_parsed_at":"2022-08-18T23:10:15.246Z","dependency_job_id":null,"html_url":"https://github.com/mikesparr/jest-puppeteer-example","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mikesparr%2Fjest-puppeteer-example","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mikesparr%2Fjest-puppeteer-example/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mikesparr%2Fjest-puppeteer-example/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mikesparr%2Fjest-puppeteer-example/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mikesparr","download_url":"https://codeload.github.com/mikesparr/jest-puppeteer-example/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253745547,"owners_count":21957396,"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":["automated-testing","browser","integration-testing","jest","puppeteer"],"created_at":"2025-01-10T21:18:08.041Z","updated_at":"2025-05-12T13:23:46.562Z","avatar_url":"https://github.com/mikesparr.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Jest Puppeteer Example\nThis repo demonstrates how to connect to and test a website using `jest-puppeteer` by \nconnecting to and attempting to apply for a job at AngelList\n\n# Usage\n```\nnpm install\nnpm test\n```\n\n## Optional configuration\nI added another script to run without headless Chrome and you can watch the test run. \nYou can also set debug in your test file (read the docs) and allow you to step through \nexecution in devtools as needed.\n```\nnpm run test:voyeur\n```\n\n# DIY - setup your own\nNormally I'd leverage TypeScript but for simplicity I'll just share a bootstrapped \napproach to setting up automated browser testing\n\n## Install\n```\nnpm install --save-dev jest-puppeteer puppeteer jest\n```\n\n## Configure\n 1. Edit `package.json` and add Jest configuration `preset`\n```json\n  // ...\n  \"scripts\": {\n    \"test\": \"jest --runInBand\"\n  },\n  \"jest\": {\n    \"preset\": \"jest-puppeteer\"\n  },\n  \"devDependencies\": {},\n  // ...\n```\n\n 2. Add `jest-puppeteer.config.js` configuration file to root dir (same as package.json)\n```javascript\nmodule.exports = {\n    launch: {\n        dumpio: false,\n        headless: process.env.HEADLESS !== 'false',   // export HEADLESS=false to launch Chromium\n        devtools: true,                               // optionally display devtools in non-headless mode\n        slowMo: 100,                                  // optionally slow down typing\n        defaultViewport: {                            // override default 800x600 pixel browser setting\n            width: 1024,\n            height: 768\n        }\n    }\n};\n```\n\n## Write Your Tests\nAfter this setup, you should be able to write your tests. The `preset` configuration instantiates puppeteer and sets \nglobal `browser` and `page` variables that you can reference from your tests.\n\nFor simplicity and to avoid any additional configs, I'll just add a `src/` directory and within a `__tests__` directory \nand name my test file with `spec` or `test` in the name. This way Jest will detect and run it automatically.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmikesparr%2Fjest-puppeteer-example","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmikesparr%2Fjest-puppeteer-example","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmikesparr%2Fjest-puppeteer-example/lists"}