CYDEKICK
Meet Your New Testing Sidekick
Unleash the full potential of your React applications with Cydekick, your intuitive Cypress test code generator. Visualize component hierarchies, interact with your UI, and generate precise test scripts with a breeze. Dive into a hassle-free testing experience tailored for the modern developer.
Features
Hierarchy Visualization
Explore the hierarchy of your application's components and HTML structure.
Highlight Components
Highlight specific components and HTML elements on the page for easy identification.
Generate Tests
Create Cypress-compatible test files that suit your testing needs effortlessly.
Preview & Save
Preview, edit and save the generated code directly to your project directory.
Demo
Entering your react project and port
Visualizing Components
Generating tests
Previewing and editing tests
Get Started
- Download Cydekick for your appropriate OS
- Launch Cydekick. Enter your root component (ie. App.jsx) and where you are currently hosting your application
- Select which React Component you want to run tests with. It should be highlighted to the right of the hierarchy
- Click the HTML button on the hierarchy and select which HTML element you wish to write a test for.
- Enter the Test writer and name your describe block. Click create describe block when ready.
- Enter your it block name and click end it block when ready.
- Choose whichever queries or assertions you want to test for this particular html/component
- When satisfied, click end statement to transfer code into your generated test file.
- You can use end it block or end describe block buttons to create new code
- At anytime you can preview your current test file by clicking the Preview button at the top
- When you are finished, click save button at top right and follow prompts to save your cypress test file within your application's directory
