Introduce Cypress #84
Conversation
The next application should be able to build without having the go config available, we remove it so Cypress won't need the config to perform basic tests
Because we dont have the go config while building the next application, we can force next to not build the route handler.
…s somehow unsuccesful
JacobArrow
force-pushed
the
DDFBRA-233-introduce-cypress
branch
2 times, most recently
from
cbfcf53 to
fe17f28
Compare
JacobArrow
force-pushed
the
DDFBRA-233-introduce-cypress
branch
from
fe17f28 to
d6e7718
Compare
As data-cy attributes are the preferred way to select element within Cypress, I've enhanced the custom `cy.dataCy()` command to use constants instead of a string. This ensures that custom data selectors cannot have typos or accidential changes. To make this work, I had to consolidate cypress.d.ts and commands.ts as a d.ts file cannot import other files dynamically.
| <div className="flex h-navigation-top-height items-center justify-center bg-background-overlay"> | ||
| <p className="text-typo-caption">Biblioterernes ebøger og lydbøger</p> | ||
| </div> | ||
| <div className="content-container grid h-navigation-height grid-cols-3 items-center"> | ||
| <div className="flex-0 flex items-center"> | ||
| <div className="flex-0 flex items-center" data-cy={cyKeys["go-logo"]}> |
There was a problem hiding this comment.
I can't figure out what I think about adding code to elements that only have relevance for Cypress. I know its a common practice but still worth mentioning?
I would like our components to be as clean as possible, preferably without extra data attributes.
If we keep it, I think either data-cy={cyKeys["go-logo"]} should be placed on Button or Icon"
There was a problem hiding this comment.
It is the best practice for selecting elements with Cypress and I think we should stick with that :)
https://docs.cypress.io/app/core-concepts/best-practices#Selecting-Elements
It also allows to typecheck our element selectors, which is always nice.
Regarding where it is placed; it doesnt matter in this PR, as it is only for demonstrating the usage.
frontpage.cy.ts will be updated once we actually have some content to test.
I don't get the benefit? We already have git to manage history.
Link to issue
https://reload.atlassian.net/browse/DDFBRA-233
Description
This PR adds the e2e framework Cypress to the project and includes a basic test that verify that the application builds successfully and that the frontpage renders a header and a footer.
Additional comments or questions
Future work will include mocking FBI data and testing core user journeys