{"id":19267809,"url":"https://github.com/jhta/cypress-web","last_synced_at":"2026-06-10T20:31:15.772Z","repository":{"id":74812348,"uuid":"306735069","full_name":"jhta/cypress-web","owner":"jhta","description":".","archived":false,"fork":false,"pushed_at":"2020-10-25T17:34:23.000Z","size":1393,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-12T16:45:04.675Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"http://jhta.github.io/miro","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/jhta.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":"2020-10-23T19:59:36.000Z","updated_at":"2020-11-04T09:40:10.000Z","dependencies_parsed_at":null,"dependency_job_id":"db6741e0-3951-4b77-9bd2-aa0ed13b1033","html_url":"https://github.com/jhta/cypress-web","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/jhta/cypress-web","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jhta%2Fcypress-web","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jhta%2Fcypress-web/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jhta%2Fcypress-web/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jhta%2Fcypress-web/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jhta","download_url":"https://codeload.github.com/jhta/cypress-web/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jhta%2Fcypress-web/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34170162,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-10T02:00:07.152Z","response_time":89,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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-11-09T20:14:06.880Z","updated_at":"2026-06-10T20:31:15.753Z","avatar_url":"https://github.com/jhta.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![test/deploy](https://github.com/jhta/miro/workflows/deploy/badge.svg)](https://github.com/jhta/miro/actions)\n[![e2e](https://github.com/jhta/miro/workflows/e2e/badge.svg)](https://github.com/jhta/miro/actions)\n![coverage](https://github.com/jhta/miro/blob/main/coverage/badge-statements.svg)\n![coverage](https://github.com/jhta/miro/blob/main/coverage/badge-lines.svg)\n\n# Miro Test Assignment\n\n## [DEMO](https://jhta.github.io)\n\n![](https://p9.f1.n0.cdn.getcloudapp.com/items/NQu1j7Z1/Screen%20Recording%202020-10-25%20at%2002.07.57%20PM.gif?source=viewer\u0026v=4029d5c849d5deb8a24332dace065090)\n\n## Stack:\n\n- Webpack as dev server\n- Babel to support ES6 features in IE11\n- Jest as framework to run Unit testing\n- Husky to execute git hooks\n- Eslint + Prettier\n- LESS to add extra functionalities to CSS\n- Github actions as CI/CD to deploy (build, lint, test, deploy) to Github Pages\n\n## Features:\n\nAll the bussiness requirements described in the test assignment are validated with [Automation test](https://github.com/jhta/miro/blob/main/cypress/integration/bussiness-requirements.spec.js), it is integrate in the CI workflow [E2E](https://github.com/jhta/miro/actions?query=workflow%3Ae2e)\n\n![](https://p9.f1.n0.cdn.getcloudapp.com/items/WnurDkJ5/Image%202020-10-25%20at%202.20.25%20PM.png?source=viewer\u0026v=62cb40a4a46439ad24f3a9204ce32779)\n\n- Can be use as module in any form or app independently ✅\n- Add email typing `COMMA`, `ENTER` or lossing the input focus ✅\n- Pasted emails are converted to formatted blocks inmediatly ✅\n- Input dimensions depends on parent dimensions ✅\n- Scrollable ✅\n- It is possible to create multiple elements in the same page without conflicts ✅\n- Detect repeated email, preventing to add the same email twice ✅\n- Block elements can be deleted ✅\n\n## How to use?\n\n```js\nimport EmailInput from '.src/lib'\n\nconst $container = document.querySelector('#my-email-input-container')\n\nconst emailInput = EmailInput($container)\n```\n\nor\n\n```html\n\u003chead\u003e\n  \u003cscript src=\"./app.bundle.js\"\u003e\u003c/script\u003e\n\u003c/head\u003e\n\n\u003cscript\u003e\n  const $container = document.querySelector('#my-email-input-container')\n  var emailsInput = new EmailsInput($container)\n\u003c/script\u003e\n```\n\nOptions:\n\n```js\nimport EmailInput from '.src/lib'\nconst $container = document.querySelector('#my-email-input-container')\n\nconst options = {\n  placeholder: 'my new placeholder', //default: add more people\n}\n\nconst emailInput = EmailInput($container)\n```\n\n## API\n\n```js\nconst emailInput = EmailInput($container)\n\n// Add email method\nemailInput.addEmail('myemail@email.com')\n\n// Count valid emails\nconst number = emailInput.countValidEmails()\n\n// Get full Object element\nconst $el = emailInput.getElement()\n```\n\n## Scripts\n\n### Run Dev Server\n\n```bash\nyarn dev #or npm run dev\n```\n\n### Build to production\n\n```bash\nyarn build\n```\n\n### Run Unit testing\n\n```bash\nyarn test\n```\n\n## run test coverage\n\n```bash\nyarn test:coverage\n```\n\n## run test automation\n\n```bash\nyarn test:e2e\n```\n\n### Run test watch\n\n```bash\nyarn test:watch\n```\n\n### Run linter\n\n```bash\nyarn lint\n```\n\n## Folder Structure\n\n- `/build` static web build\n- `/coverage` Test coverage report\n- `/cypress` Cypress automation tests\n- `/src` code\n  - `/app/` App to DEMO, it includes the main `index.html`, `index.js`, `app.test.js`, and `style.less`\n  - `/src/lib/` Email input as exportable library\n    - `index.js` Initial app, factory to encapsulate data and expose just the needed methods from `EmailInput`\n    - `/utils/` application utils\n    - `/constants/` application constants\n    - `/components/` \"components\", those are factories for DOM Element who respect the same pattern (exept main `email-input`)\n      - `/block-email`, `/close-icon`, `/input`, `/wrapper`. Element factories that follow the same pattern. All of them receive the params `props` and `events` in order to create the respective HTML element and attach the events.\n      - `/email-input` Constructor function for `EmailInput`, it includes all the data state logic, operations and event delegation to the other Elements.\n\n## Git Hooks\n\n### pre-commit\n\nIt check the linter until commit\n\n### pre-push\n\nIt run the unit testing until push\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjhta%2Fcypress-web","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjhta%2Fcypress-web","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjhta%2Fcypress-web/lists"}