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

Modified the cypress file structure docs #9925

Merged
merged 16 commits into from
Jan 13, 2025
Merged
Show file tree
Hide file tree
Changes from 14 commits
Commits
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
22 changes: 21 additions & 1 deletion cypress/docs/best-practices.md
Original file line number Diff line number Diff line change
@@ -1,32 +1,52 @@
# Best Practices

## Test Independence

- Each test should be independent and isolated
- Clean up test data after tests
- Don't rely on the state from other tests

## API Testing

- Use cy.intercept() for API verification
- Use waitUntil() for API completion
- Avoid cy.wait() except for API responses

## Element Interaction

- Always verify element state before interaction
- Use data-cy attributes for selectors
- Verify button text before clicking
- Always verify loading states before and after interactions

## Code Organization

- Keep tests focused and concise
- Follow AAA pattern (Arrange, Act, Assert)
- Use meaningful test descriptions

## Common Pitfalls to Avoid

- Redundant visibility checks with verifyAndClickElement
- Hardcoded values in page objects
- Unnecessary waits
- Test interdependencies
- Skipping API verifications
- Using arbitrary timeouts instead of proper waits

## Performance Considerations

- Minimize unnecessary API calls
- Use efficient selectors
- Batch similar operations
- Batch similar operations

## Testing Checklist

Before submitting your test, verify:

- [ ] All API calls are intercepted and verified
- [ ] Loading states are handled properly
- [ ] Success/error states are verified
- [ ] No arbitrary timeouts used
- [ ] Search operations include debounce handling
- [ ] Form submissions verify both request and response
26 changes: 19 additions & 7 deletions cypress/docs/file-structure.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
# File Structure and Organization

## Directory Structure

```
cypress/
├── docs/
Expand All @@ -9,31 +10,42 @@ cypress/
│ ├── patterns.md
│ └── best-practices.md
├── e2e/ # Test files grouped by modules
│ ├── patient/
│ ├── facility/
│ └── user/
├── fixtures/
├── pageObject/
└── support/
│ ├── patient/
│ ├── facility/
│ └── user/
├── fixtures/
├── pageObject/ # Page Objects grouped by modules
│ ├── patient/
│ ├── facility/
│ └── user/
├── utils/ # Utility functions and helpers
│ ├── facilityData.ts # Facility-related utility functions
│ └── commonUtils.ts # Shared utility functions
└── support/
```

## Module Organization

Each module (patient, facility, user, etc.) should have:

- Test files in `e2e/<module-name>/`
- Page Object in `pageObject/<module-name>/`
- Fixtures in `fixtures/<module-name>/`

## File Naming Conventions

- Test files: `feature-name.cy.ts`
- Page Object: `FeatureNamePage.ts`
- Custom Commands: `feature-name.ts`
- Fixtures: `feature-name-data.json`

## Support Files

- `commands.ts`: Custom Cypress commands
- `e2e.ts`: e2e configurations
- `index.ts`: Main support file

## Storage Management

- Use cy.saveLocalStorage() and cy.restoreLocalStorage()
- Manage test data cleanup
- Manage test data cleanup
27 changes: 25 additions & 2 deletions cypress/pageObject/facility/FacilityCreation.ts
Original file line number Diff line number Diff line change
Expand Up @@ -95,7 +95,31 @@ export class FacilityCreation {
}

searchFacility(facilityName: string) {
cy.typeIntoField('[data-cy="search-facility"]', facilityName);
cy.intercept("GET", `**/api/v1/facility/?**`).as("searchFacility");

// Clear first
cy.get('[data-cy="search-facility"]').clear().should("have.value", "");

// Function to attempt typing with verification
function attemptType(retries = 0, maxRetries = 3) {
cy.get('[data-cy="search-facility"]')
.type(facilityName)
.then(($input) => {
const currentValue = $input.val();
if (currentValue !== facilityName && retries < maxRetries) {
cy.get('[data-cy="search-facility"]').clear();
attemptType(retries + 1);
}
});
}

// Start the typing attempt
attemptType();

nihal467 marked this conversation as resolved.
Show resolved Hide resolved
// Final verification
cy.get('[data-cy="search-facility"]').should("have.value", facilityName);

cy.wait("@searchFacility").its("response.statusCode").should("eq", 200);
}

verifyFacilityNameInCard(facilityName: string) {
Expand All @@ -106,6 +130,5 @@ export class FacilityCreation {
cy.get('[data-cy="facility-cards"]', { timeout })
.should("be.visible")
.should("not.be.empty");
return this;
}
}
2 changes: 1 addition & 1 deletion cypress/support/commands.ts
Original file line number Diff line number Diff line change
Expand Up @@ -244,7 +244,7 @@ Cypress.Commands.add(
const {
clearBeforeTyping = false,
skipVerification = false,
delay = 50,
delay = 0,
} = options;
const inputField = cy.get(selector);

Expand Down
Loading