{"id":15553120,"url":"https://github.com/bahmutov/cypress-await","last_synced_at":"2025-09-28T23:31:29.146Z","repository":{"id":187463896,"uuid":"674682185","full_name":"bahmutov/cypress-await","owner":"bahmutov","description":"Cypress async await magic 🪄","archived":false,"fork":false,"pushed_at":"2024-05-11T10:11:03.000Z","size":510,"stargazers_count":15,"open_issues_count":8,"forks_count":1,"subscribers_count":3,"default_branch":"main","last_synced_at":"2024-05-12T06:32:54.500Z","etag":null,"topics":["cypress-plugin"],"latest_commit_sha":null,"homepage":"https://glebbahmutov.com/blog/use-async-await-in-cypress-specs/","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/bahmutov.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,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-08-04T14:14:13.000Z","updated_at":"2024-07-13T09:20:11.503Z","dependencies_parsed_at":"2023-08-10T16:54:51.622Z","dependency_job_id":"123f7b7e-3a54-45fe-86f1-855ca5a95d44","html_url":"https://github.com/bahmutov/cypress-await","commit_stats":null,"previous_names":["bahmutov/cy-await"],"tags_count":26,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bahmutov%2Fcypress-await","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bahmutov%2Fcypress-await/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bahmutov%2Fcypress-await/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bahmutov%2Fcypress-await/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bahmutov","download_url":"https://codeload.github.com/bahmutov/cypress-await/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":234570384,"owners_count":18854156,"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":["cypress-plugin"],"created_at":"2024-10-02T14:24:45.316Z","updated_at":"2025-09-28T23:31:28.657Z","avatar_url":"https://github.com/bahmutov.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# cypress-await ![cypress version](https://img.shields.io/badge/cypress-13.6.4-brightgreen)\n\n\u003e Cypress spec preprocessor that adds the \"async / await\" syntax\n\n## Examples\n\n- 📝 Read blog post [Use Async Await In Cypress Specs](https://glebbahmutov.com/blog/use-async-await-in-cypress-specs/)\n- 📝 Read blog post [Use Cypress For API Testing](https://glebbahmutov.com/blog/use-cypress-for-api-testing/)\n- 📝 Read blog post [Click Button If Enabled](https://glebbahmutov.com/blog/click-button-if-enabled/)\n- 📺 Watch video [Await Cypress Command Results](https://www.youtube.com/watch?v=5faeSbvCJQY)\n- 📺 Watch video [cypress-await Sync Mode Example](https://youtu.be/opOopVq5AmA)\n- 📺 Watch video [Type Placeholders Into The Form: manp and cypress-await example](https://youtu.be/Z4nDKbWMkJc)\n- 📺 Watch video [Click Button If Enabled Using cypress-if And cypress-await Plugins](https://youtu.be/H04FSnH-6U0)\n- 🖥️ Repo [bahmutov/cypress-todomvc-await-example](https://github.com/bahmutov/cypress-todomvc-await-example)\n\n🎓 Covered in my [Cypress Plugins course](https://cypress.tips/courses/cypress-plugins)\n\n- [Lesson n6: Paginate using the await keyword](https://cypress.tips/courses/cypress-plugins/lessons/n6)\n- [Lesson n7: Paginate using synchronous code](https://cypress.tips/courses/cypress-plugins/lessons/n7)\n\n## Todos\n\n- switch from `@cypress/browserify-preprocessor` to `@cypress/webpack-batteries-included-preprocessor` for bundling transpiled spec\n\n## Install\n\nAdd this package as a dev dependency\n\n```\n$ npm i -D cypress-await\n# or using Yarn\n$ yarn add -D cypress-await\n```\n\n## Use as a preprocessor\n\nAdd the following to your `cypress.config.js` file:\n\n```js\n// cypress.config.js\nconst { defineConfig } = require('cypress')\n// https://github.com/bahmutov/cypress-await\nconst cyAwaitPreprocessor = require('cypress-await/src/preprocessor')\n\nmodule.exports = defineConfig({\n  e2e: {\n    setupNodeEvents(on, config) {\n      on('file:preprocessor', cyAwaitPreprocessor())\n    },\n  },\n})\n```\n\nIn your spec files you can use `value = await cy...` instead of `cy....then(value =\u003e )`\n\n```js\nit('shows the number of projects', async () =\u003e {\n  await cy.visit('/')\n  const n = await cy.get('#projects-count').invoke('text').then(parseInt)\n  cy.log(n)\n  expect(n, 'number of projects').to.be.within(350, 400)\n})\n```\n\nThe above code is equivalent to the \"plain\" Cypress test\n\n```js\nit('shows the number of projects', () =\u003e {\n  cy.visit('/')\n  cy.get('#projects-count')\n    .invoke('text')\n    .then(parseInt)\n    .then((n) =\u003e {\n      cy.log(n)\n      expect(n, 'number of projects').to.be.within(350, 400)\n    })\n})\n```\n\n## Preprocessor sync mode\n\nIt might seem redundant to always write `n = await cy...`, thus there is a \"sync\" mode preprocessor where you can write the spec code without using `await` before each Cypress chain.\n\n```js\n// cypress.config.js\nconst { defineConfig } = require('cypress')\n// https://github.com/bahmutov/cypress-await\nconst cyAwaitPreprocessor = require('cypress-await/src/preprocessor-sync-mode')\n\nmodule.exports = defineConfig({\n  e2e: {\n    setupNodeEvents(on, config) {\n      on('file:preprocessor', cyAwaitPreprocessor())\n    },\n  },\n})\n```\n\nWe can get the parsed number of projects from the page\n\n```js\nit('shows the number of projects', () =\u003e {\n  cy.visit('/')\n  const n = cy.get('#projects-count').invoke('text').then(parseInt)\n  cy.log(n)\n  expect(n, 'number of projects').to.be.within(350, 400)\n})\n```\n\n## Transform some spec files\n\nYou can apply this preprocessor only to some specs using [minimatch](https://github.com/isaacs/minimatch) over the full spec source filepath\n\n```js\nsetupNodeEvents(on, config) {\n  on('file:preprocessor', cyAwaitPreprocessor({\n    specPattern: '**/*.sync.cy.js'\n  }))\n}\n```\n\nFor simplicity, you can also use the end of the files that need to be transpiled. For example, to transpile all files that end with `.sync.cy.js`, you can use `specPattern: '.sync.cy.js'`\n\n## Show transpiled output\n\nSet the preprocessor with the `debugOutput: true` option\n\n```js\nsetupNodeEvents(on, config) {\n  on('file:preprocessor', cyAwaitPreprocessor({\n    debugOutput: true\n  }))\n}\n```\n\nThe transpiled output will appear in the terminal.\n\n## Debugging\n\nStart Cypress with OS environment variable `DEBUG=cypress-await`\n\n```\n# on Mac or Linux\n$ DEBUG=cypress-await npx cypress open\n```\n\nTo see even more output enable the verbose debug logs with `DEBUG=cypress-await:verbose`\n\n```\n# on Mac or Linux\n$ DEBUG=cypress-await:verbose npx cypress open\n```\n\n## Small print\n\nAuthor: Gleb Bahmutov \u0026lt;gleb.bahmutov@gmail.com\u0026gt; \u0026copy; 2023\n\n- [@bahmutov](https://twitter.com/bahmutov)\n- [glebbahmutov.com](https://glebbahmutov.com)\n- [blog](https://glebbahmutov.com/blog)\n- [videos](https://www.youtube.com/glebbahmutov)\n- [presentations](https://slides.com/bahmutov)\n- [cypress.tips](https://cypress.tips)\n- [Cypress Tips \u0026 Tricks Newsletter](https://cypresstips.substack.com/)\n- [my Cypress courses](https://cypress.tips/courses)\n\nLicense: MIT - do anything with the code, but don't blame me if it does not work.\n\nSupport: if you find any problems with this module, email / tweet /\n[open issue](https://github.com/bahmutov/cy-await/issues) on Github\n\n## MIT License\n\nCopyright (c) 2023 Gleb Bahmutov \u0026lt;gleb.bahmutov@gmail.com\u0026gt;\n\nPermission is hereby granted, free of charge, to any person\nobtaining a copy of this software and associated documentation\nfiles (the \"Software\"), to deal in the Software without\nrestriction, including without limitation the rights to use,\ncopy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the\nSoftware is furnished to do so, subject to the following\nconditions:\n\nThe above copyright notice and this permission notice shall be\nincluded in all copies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND,\nEXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES\nOF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND\nNONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT\nHOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,\nWHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING\nFROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR\nOTHER DEALINGS IN THE SOFTWARE.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbahmutov%2Fcypress-await","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbahmutov%2Fcypress-await","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbahmutov%2Fcypress-await/lists"}