{"id":26268026,"url":"https://github.com/oslabs-beta/cydekick","last_synced_at":"2025-04-30T19:24:40.554Z","repository":{"id":195088800,"uuid":"692224383","full_name":"oslabs-beta/Cydekick","owner":"oslabs-beta","description":"Unlock the complete capabilities of your React applications using Cydekick, the intuitive Cypress test code generator. Seamlessly visualize component hierarchies, interact with your UI effortlessly, and generate precise test scripts. Immerse yourself in a hassle-free testing experience crafted for the modern developer.","archived":false,"fork":false,"pushed_at":"2024-01-14T07:11:53.000Z","size":697,"stargazers_count":31,"open_issues_count":0,"forks_count":1,"subscribers_count":4,"default_branch":"main","last_synced_at":"2025-04-08T10:53:16.688Z","etag":null,"topics":["component-testing","cypress","electron-app","react"],"latest_commit_sha":null,"homepage":"https://cydekick.dev/#home","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/oslabs-beta.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2023-09-15T21:11:54.000Z","updated_at":"2024-01-13T21:18:30.000Z","dependencies_parsed_at":"2023-10-12T04:31:42.197Z","dependency_job_id":"e58e849e-8e0c-41aa-bd11-abed461eafa7","html_url":"https://github.com/oslabs-beta/Cydekick","commit_stats":null,"previous_names":["oslabs-beta/cydekick"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oslabs-beta%2FCydekick","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oslabs-beta%2FCydekick/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oslabs-beta%2FCydekick/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oslabs-beta%2FCydekick/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/oslabs-beta","download_url":"https://codeload.github.com/oslabs-beta/Cydekick/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":251767859,"owners_count":21640620,"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":["component-testing","cypress","electron-app","react"],"created_at":"2025-03-14T04:19:09.732Z","updated_at":"2025-04-30T19:24:40.499Z","avatar_url":"https://github.com/oslabs-beta.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003cimg src=\"https://github.com/oslabs-beta/Cydekick/assets/122579382/c9b55008-81dd-4f78-af10-78a5466e6963\" alt=\"image\"\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cimg src=\"https://img.shields.io/badge/Electron-2e2e2e?style=for-the-badge\u0026logo=electron\u0026logoColor=white\"\u003e \n  \u003cimg src=\"https://img.shields.io/badge/React-61dafb?style=for-the-badge\u0026logo=react\u0026logoColor=white\"\u003e \n  \u003cimg src=\"https://img.shields.io/badge/Typescript-3178c6?style=for-the-badge\u0026logo=typescript\u0026logoColor=white\"\u003e\n  \u003cimg src=\"https://img.shields.io/badge/Node.js-43853d?style=for-the-badge\u0026logo=node.js\u0026logoColor=white\"\u003e \n  \u003cimg src=\"https://img.shields.io/badge/Express-000000?style=for-the-badge\u0026logo=express\u0026logoColor=white\"\u003e \n  \u003cimg src=\"https://img.shields.io/badge/Webpack-8dd6f9?style=for-the-badge\u0026logo=webpack\u0026logoColor=white\"\u003e\n  \u003cimg src=\"https://img.shields.io/badge/Cypress-17202c?style=for-the-badge\u0026logo=cypress\u0026logoColor=white\"\u003e \n  \u003cimg src=\"https://img.shields.io/badge/Selenium-43b02a?style=for-the-badge\u0026logo=selenium\u0026logoColor=white\"\u003e \n  \u003cimg src=\"https://img.shields.io/badge/Mocha-8d6748?style=for-the-badge\u0026logo=mocha\u0026logoColor=white\"\u003e\n  \u003cimg src=\"https://img.shields.io/badge/Chai-a52a2a?style=for-the-badge\u0026logo=chai\u0026logoColor=white\"\u003e \n  \u003cimg src=\"https://img.shields.io/badge/React_Flow-2f2f2f?style=for-the-badge\u0026logo=react\u0026logoColor=white\"\u003e \n  \u003cimg src=\"https://img.shields.io/badge/Tailwind_CSS-38b2ac?style=for-the-badge\u0026logo=tailwind-css\u0026logoColor=white\"\u003e\n  \u003cimg src=\"https://img.shields.io/badge/HTML-e34c26?style=for-the-badge\"\u003e\n\u003c/p\u003e\n\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://cydekick.dev/#home\"\u003eCydekick.com\u003c/a\u003e\n\u003c/p\u003e\n\nCydekick is a Cypress test code generator designed for React applications. It enables you to visualize the component hierarchy of your React application, interact with your application in real-time, and seamlessly generate test code.\n\n## Table of Contents\n- [Interface \u0026 Features](#interface--features)\n- [Prerequisites](#prerequisites)\n- [Installation](#installation)\n- [Usage](#usage)\n- [Contributing](#contributing)\n- [Support](#support)\n- [For Future Iterations](#future-iterations)\n- [License](#license-information)\n- [The Cydekick Team](#the-cydekick-team)\n\n## Interface \u0026 Features\n\nOverview:\nUpon launching Cydekick, users are presented with an intuitive interface designed to simplify Cypress testing for React applications. The main features include:\n\n1. Visual Component Hierarchy:\n   - Navigate through the component hierarchy using React Flow, providing a visual representation of your React application's structure.\n\n2. Highlight Components:\n   - Click on a component to reveal its HTML structure, allowing users to inspect and interact with individual components.\n\n3. Generate Test Code:\n   - Seamlessly generate Cypress test code by providing text for \"describe\" and \"it\" blocks, along with selecting Cypress commands for testing.\n\n4. Preview and Save:\n   - Preview and save the generated test code in a separate file, giving users the flexibility to edit and download the code at their convenience.\n\n## Prerequisites\n\nTo use Cydekick, you will need to:\n\n- Install Cypress in your application.\n- Add your own \"data-cy\" IDs to elements you wish to test on your app.\n- Run your application concurrently.\n\n## Installation\n\nFollow these steps to install Cydekick:\n\n1. Download the latest version of Cydekick from [HERE](https://cydekick.dev/#home).\n2. Choose the version that matches your operating system: Mac, Windows, or Linux.\n3. Unzip the file onto your Computer and proceed to the next steps below.\n\n## Usage\n\nTo use Cydekick effectively, follow these steps:\n\n1. Launch Cydekick.\n\n2. Input the files of your React application and the URL where it's hosted.\n\n   \u003cp align=\"center\"\u003e\n     \u003cimg src=\"https://cydekick.dev/assets/DemoGif1.gif\" alt=\"DemoGif1\"\u003e\n   \u003c/p\u003e\n\n3. Explore the component hierarchy using React Flow and select the component of your application that you want to test.\n\n   \u003cp align=\"center\"\u003e\n     \u003cimg src=\"https://cydekick.dev/assets/DemoGif2.gif\" alt=\"DemoGif2\"\u003e\n   \u003c/p\u003e\n\n4. Generate test code by providing text for \"describe\" and \"it\" blocks, and selecting Cypress commands.\n\n   \u003cp align=\"center\"\u003e\n     \u003cimg src=\"https://cydekick.dev/assets/DemoGif3.gif\" alt=\"DemoGif3\"\u003e\n   \u003c/p\u003e\n\n5. Ensure you add the statement to the editor by clicking the \"end statement\" button.\n\n6. Complete the \"describe\" block and click \"preview\" at the top right to view your test file.\n\n7. Congratulations on your first test code; You're free to edit, preview, or save the generated code.\n\n   \u003cp align=\"center\"\u003e\n     \u003cimg src=\"https://cydekick.dev/assets/DemoGif4.gif\" alt=\"DemoGif4\"\u003e\n   \u003c/p\u003e\n\n## Contributing\n\u003ca id=\"contributing\"\u003e\u003c/a\u003e\n\nWe've launched Cydekick as a valuable tool to streamline Cypress testing for users. We plan to introduce more features, extensions, and enhancements to make Cypress testing even more efficient. We appreciate any contributions from the community and encourage you to give Cydekick a try. Feel free to suggest improvements or report any issues you encounter using the application. Your interest and involvement are highly valued!\n\n## For Future Iterations\n\u003ca id=\"future-iterations\"\u003e\u003c/a\u003e\n- Currently, the Cypress commands are not compatible with anonymous functions.\n- The commands do not support an \"options\" object parameter.\n- The commands only support strings and numbers.\n- There is a limited number of command options.\n\n## Support\n\nEncounter issues or have suggestions? Please feel free to message the creators down below.\n\n## License Information\n\nCydekick is licensed under the MIT License. See the [LICENSE](https://github.com/oslabs-beta/Cydekick/blob/main/LICENSE) file for details.\n\n## The Cydekick Team\n\nDeveloped by:\n\n- **Preston Mounivong**\n  - LinkedIn: [Preston Mounivong](https://www.linkedin.com/in/prestonmounivong/)\n  - GitHub: [prrrrreston](https://github.com/prrrrreston)\n\n- **Sid Saxena**\n  - LinkedIn: [Sid Saxena](https://www.linkedin.com/in/siddhantsaxena27/)\n  - GitHub: [sidsaxena27](https://github.com/sidsaxena27)\n\n- **Jacob Sasser**\n  - LinkedIn: [Jacob Sasser](https://www.linkedin.com/in/jacob-sasser-11a424112/)\n  - GitHub: [jacobsasser](https://github.com/jacobsasser)\n\n- **Quinn Craddock**\n  - LinkedIn: [Quinn Craddock](https://www.linkedin.com/in/quinn-craddock4/)\n  - GitHub: [quinnCraddock4](https://github.com/quinnCraddock4)\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foslabs-beta%2Fcydekick","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Foslabs-beta%2Fcydekick","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foslabs-beta%2Fcydekick/lists"}