WIP: Check code examples with axe #3168
Conversation
|
There was a problem hiding this comment.
Nice, seems like a great idea to implement 👏 As an alternative we could use https://storybook.js.org/docs/writing-tests/test-runner since we already have the storybook setup for it (if you were looking for alternatives). But since we have playwright setup already the current implementation sees like a much simpler solution 👍
| id="ds-example" | ||
| className={variant === "static" ? styles.exampleStatic : undefined} | ||
| <> | ||
| <SEO title="Kodeeksempel" /> |
There was a problem hiding this comment.
SEO manglet kanskje her? 🤔
There was a problem hiding this comment.
La til den fordi axe klaget på at <title> manglet.
| @@ -46,10 +46,11 @@ const config: PlaywrightTestConfig = { | |||
| ...devices["Desktop Chrome"], | |||
| }, | |||
| ...(process.env.FULL_TEST | |||
There was a problem hiding this comment.
If we're going to have the same test suite run for both cases, we could also just remove this FULL_TEST env var.
| }, | ||
| { | ||
| // TODO: Revert all changes to this file |
There was a problem hiding this comment.
Guessing this is WIP stuff? (there's a lot of comments that we could probably strip as well before this goes live / un-draft the PR) :D
There was a problem hiding this comment.
Yes, this branch is WIP and not ready for review. But ideas/suggestions are welcome!
|
I'm all for this! 🙌 We tend to use AXE in the browser, but it can easily get forgotten by individual devs 😎. |
HalvorHaugan
changed the title
I thought we should check our components for a11y issues and invalid HTML. I think the easiest way is to check the examples? It might be good to check the examples anyways. Should probably also check the templates.
It seems that axe doesn't properly check for invalid HTML, so maybe we need a separate check for that?