7a1317432b
* create a MainContent and SidePanelContent containers for layout this creates these two new components for handling layout more cleanly. It also allows us to put in common components into main layout, like sandbox expiration notification * use MainContent and SidePanelContent in current pages this brings in the two new components and wraps the page contents in these. This also allowed us to clean up and remove unused/no needed styling code * add MainContent component to user settings page and clean up user settings component this cleans up the user settings page to follow the panel convention we have as well as adds the MainContent component to this page * add MainContent component to team pages * update Sandbox gate to render optional component when in sandbox mode and add to MainContent * add call to sandbox api to get expiry time this adds a conditional call when the user is in sandbox mode to get the expiry time of the instance * fix sticky elements on settings pages to work with sandbox expiry message * fix e2e test after MainContent refactor |
||
|---|---|---|
| .. | ||
| fixtures | ||
| integration | ||
| plugins | ||
| support | ||
| cypress-free.json | ||
| cypress-premium.json | ||
| README.md | ||
| tsconfig.json | ||
Cypress Testing
Cypress tests are designed solely for end-to-end testing. If this is your first time developing or running end-to-end tests, Fleet testing documentation includes git instructions for test preparation and running tests.
Fleet Cypress directories
Integration directory
Cypress tests the integration of entire features of the app.
With the roll out of teams, Cypress tests the user interface of each role of a user on the Premium Tier (Fleet Premium Documentation) and Free Tier (Fleet Free Documentation).
Support directory
Commands that are shared across tests are located in the support directory.
Opening Cypress locally
To open simply run:
yarn cypress:open
This will open up cypress locally and allow you to view the current test suite, as well as start writing new tests.
Building best practices
As much as possible, build from a user's perspective. Use .within cypress command as needed to scope a command within a specific element (e.g. table, nav).
As much as possible, assert that the code is only selecting 1 item or that the final assertion is the appropriate count.
Prioritization of selecting elements
- By element tag using elements (e.g. buttons), we can target text within. Confirm what the user is seeing with target text. If this is not specific enough, add on Role.
- By role using default or explicitly assigned roles of elements. If this is not specific enough, add on element class.
- By element class is least preferred as it does not follow a user's perspective. Occasionally this may be the only option. If that is the case, prioritize using the class name that specifies what the element is doing.