Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: add readme for testing suite #2085

Closed
wants to merge 27 commits into from
Closed
Changes from 24 commits
Commits
Show all changes
27 commits
Select commit Hold shift + click to select a range
1c462b6
add documentation
reachaadrika Aug 21, 2023
f81d256
Merge branch 'master' of https://github.com/reachaadrika/website into…
reachaadrika Aug 21, 2023
6c9557e
Add README for cypress test folder
reachaadrika Aug 21, 2023
f98c630
Merge branch 'master' into docs-tests-gsoc
reachaadrika Aug 22, 2023
f978325
Merge branch 'master' into docs-tests-gsoc
reachaadrika Aug 23, 2023
f0dff39
Merge branch 'master' into docs-tests-gsoc
akshatnema Aug 25, 2023
9e3f7e4
Merge branch 'master' into docs-tests-gsoc
reachaadrika Aug 25, 2023
63ec832
Merge branch 'master' into docs-tests-gsoc
quetzalliwrites Aug 30, 2023
ef1da74
Update cypress/README.md
reachaadrika Aug 31, 2023
fd5a902
Update cypress/README.md
reachaadrika Aug 31, 2023
f26fd37
Merge branch 'master' into docs-tests-gsoc
reachaadrika Aug 31, 2023
1e62162
Update cypress/README.md
reachaadrika Aug 31, 2023
bff5053
Update cypress/README.md
reachaadrika Aug 31, 2023
a017bf4
Update cypress/README.md
reachaadrika Aug 31, 2023
40d20d0
changes in readme
reachaadrika Aug 31, 2023
0ed18b2
Merge branch 'docs-tests-gsoc' of https://github.com/reachaadrika/web…
reachaadrika Aug 31, 2023
b72046f
Merge branch 'master' into docs-tests-gsoc
reachaadrika Sep 3, 2023
e4dc135
Merge branch 'master' into docs-tests-gsoc
reachaadrika Sep 6, 2023
33be619
Merge branch 'master' of https://github.com/reachaadrika/website into…
reachaadrika Sep 6, 2023
e698a13
Merge branch 'master' into docs-tests-gsoc
reachaadrika Sep 6, 2023
26309e5
changes in Readme -1
reachaadrika Sep 6, 2023
67b612f
Merge branch 'docs-tests-gsoc' of https://github.com/reachaadrika/web…
reachaadrika Sep 6, 2023
ed74613
Merge branch 'master' into docs-tests-gsoc
akshatnema Sep 30, 2023
bde099b
Merge branch 'master' into docs-tests-gsoc
quetzalliwrites Feb 28, 2024
73aff46
Apply suggestions from code review
akshatnema Mar 2, 2024
9aae1ce
updated tests readme
akshatnema Mar 2, 2024
38f70c2
Merge branch 'master' into docs-tests-gsoc
asyncapi-bot Jul 17, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
59 changes: 59 additions & 0 deletions cypress/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
[![AsyncAPI Banner and Logo](./public/img/logos/github-repobanner-website.png)](https://www.asyncapi.com)

---
## Overview

This folder contains the test code of AsyncAPI website :

- It's powered by [Cypress](https://docs.cypress.io/guides/overview/why-cypress).

- It utilises [Cypress/react] to provide some additional functionalites to Cypress .

- Unlike traditional testing tools, Cypress operates directly within the browser, providing real-time feedback as tests execute. This allows developers to see the application's behavior as tests run and pinpoint issues more effectively.

- Component testing in Cypress refers to the practice of testing individual components of a web application in isolation.
These tests can help ensure that components function as expected and interact correctly with other parts of the application.

- End-to-end (E2E) testing in Cypress involves testing an entire web application from start to finish to ensure that all its components, interactions, and workflows function correctly as a cohesive whole. E2E tests simulate user behavior and interactions, providing a comprehensive validation of the application's functionality.

## Requirements
Use the following tools to set up the project:
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Add the command to do npm install with correct npm version and run cypress with appropriate Node version.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@reachaadrika This comment is not addressed.

- [Cypress] (This is installed as a dev-dependency).

## Run tests locally

Assuming you have all the necessary website dependencies installed:

1. Run it and check on the Cypress Graphical User Interface
```bash
npm run cy:open
```
(You can check out the tests and their outputs on the Cypress Window)

2. Run it on your local CLI
```bash
npm run test
```

## Cypress Folder structure
```text
├── downloads # Any necessary downloads for the tests
├── fixtures # Stores all the mock data files used in various tests
├── plugins # Used to create additional functionalities in Cypress(if required)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
├── plugins # Used to create additional functionalities in Cypress(if required)
├── plugins # Used to create additional functionalities in Cypress(if required)

├── support # Main skeleton for the Cypress tests , Custom commands can be added here
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
├── support # Main skeleton for the Cypress tests , Custom commands can be added here
├── support # Main skeleton for the Cypress tests. Custom commands can be added here

├── test # Source for the entire testing suite
├── utils # Necessary Reusable Code and components for writing tests.
file
```

## Add your own tests

To add your own tests follow the following steps :

1. Navigate to the "test" folder .

2. Add tests in the respective testing folder :
akshatnema marked this conversation as resolved.
Show resolved Hide resolved
For eg : Include tests for "scripts" in the scripts folder .
For creating a new component , create a new folder with the same name as component is named in the code .
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's not necessary to create a new folder to add a test for a component. It can be a separate file. Important point here is to follow same directory inside test folder, as the same file inside the root of the project.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

will change this

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

From what I am reading in this thread, it looks like @reachaadrika has yet to address this feedback from @akshatnema. This section still seems to have incorrect information suggesting one must open a new folder to add a test for a component.


3. Create testing files using extension "cy.js"
Loading