diff --git a/tests/spec/020-themes.js b/tests/spec/020-themes.js index 93bd3ae8..97a4c40f 100644 --- a/tests/spec/020-themes.js +++ b/tests/spec/020-themes.js @@ -1,13 +1,20 @@ -import { - getCurrentTheme, - settingsNavButton -} from '../utils' +import { settingsNavButton, getCurrentTheme, getNthStatus } from '../utils' import { loginAsFoobar } from '../roles' import { Selector as $ } from 'testcafe' +import { checkForViolations } from '@testcafe-community/axe'; fixture`020-themes.js` .page`http://localhost:4002` +function checkColorsAreReadable(t) { + return checkForViolations(t, null, { + runOnly: 'color-contrast', + rules: { + 'color-contrast': { enabled: true } + } + }) +} + test('can set a theme', async t => { await loginAsFoobar(t) await t @@ -20,3 +27,27 @@ test('can set a theme', async t => { .click($('input[value="default"]')) .expect(getCurrentTheme()).eql('default') }) + +test(`Default light theme should pass automated color contrast checks`, async t => { + await loginAsFoobar(t) + await t + .navigateTo('/settings/general') + .expect(getCurrentTheme()).eql('default') + await t.navigateTo('/') + .expect(getNthStatus(1).exists) + .ok({ timeout: 30000 }) + await checkColorsAreReadable(t) +}); + +test(`Default dark theme should pass automated color contrast checks`, async t => { + await loginAsFoobar(t) + await t + .navigateTo('/settings/general') + .click($(`input[value="ozark"]`)) + .expect(getCurrentTheme()).eql('ozark') + await t.navigateTo('/') + .expect(getNthStatus(1).exists) + .ok({ timeout: 30000 }) + await checkColorsAreReadable(t) +}); +