Documentation request: How to test dark mode?

[ptmkenny]

I've been testing my website with pa11y-ci for a couple years now and made several improvements; thank you!

I recently added dark mode to my site. So now I want to use pa11y to test the contrast values for both "light" mode and "dark" mode. I assumed I would have to run pa11y twice, once to test "light" mode and then again to test "dark" mode.

However, I'm confused about how to get pa11y to request dark mode. I read through the configuration examples and there are a lot of options.

Puppeteer has Page.emulateMediaFeatures():

await page.emulateMediaFeatures([
  {name: 'prefers-color-scheme', value: 'dark'},
]);

Should I supply a page instance to puppeteer to test dark mode? Or is there a better way?

[danyalaytekin]

Hey @ptmkenny, thanks for using pa11y-ci and it's great to hear it's helping your testing. There's a related question over on pa11y's issues and it sounds like you and @aarongoldenthal have independently converged:

• Dark or light mode handling pa11y#690

I'm currently unaware of another approach but I agree that "adding a dedicated option to simplify this would be beneficial" so I'll add an enhancement label on this side of the fence too.