test: add test for accessible radio buttons in /community (#1845)

This commit is contained in:
Nolan Lawson 2020-08-25 22:16:14 -07:00 committed by GitHub
parent 07deb122f3
commit 36cf9fd56d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 61 additions and 1 deletions

View file

@ -1,7 +1,12 @@
import { get, DEFAULT_TIMEOUT } from '../_utils/ajax' import { get, DEFAULT_TIMEOUT, post, WRITE_TIMEOUT } from '../_utils/ajax'
import { auth, basename } from './utils' import { auth, basename } from './utils'
export function getLists (instanceName, accessToken) { export function getLists (instanceName, accessToken) {
const url = `${basename(instanceName)}/api/v1/lists` const url = `${basename(instanceName)}/api/v1/lists`
return get(url, auth(accessToken), { timeout: DEFAULT_TIMEOUT }) return get(url, auth(accessToken), { timeout: DEFAULT_TIMEOUT })
} }
export function createList (instanceName, accessToken, title) {
const url = `${basename(instanceName)}/api/v1/lists`
return post(url, { title }, auth(accessToken), { timeout: WRITE_TIMEOUT })
}

View file

@ -11,6 +11,7 @@ import { reblogStatus } from '../src/routes/_api/reblog'
import { submitMedia } from './submitMedia' import { submitMedia } from './submitMedia'
import { voteOnPoll } from '../src/routes/_api/polls' import { voteOnPoll } from '../src/routes/_api/polls'
import { POLL_EXPIRY_DEFAULT } from '../src/routes/_static/polls' import { POLL_EXPIRY_DEFAULT } from '../src/routes/_static/polls'
import { createList, getLists } from '../src/routes/_api/lists'
global.fetch = fetch global.fetch = fetch
global.File = FileApi.File global.File = FileApi.File
@ -82,3 +83,11 @@ export async function createPollAs (username, content, options, multiple, spoile
export async function voteOnPollAs (username, pollId, choices) { export async function voteOnPollAs (username, pollId, choices) {
return voteOnPoll(instanceName, users[username].accessToken, pollId, choices.map(_ => _.toString())) return voteOnPoll(instanceName, users[username].accessToken, pollId, choices.map(_ => _.toString()))
} }
export async function createListAs (username, title) {
return createList(instanceName, users[username].accessToken, title)
}
export async function getListsAs (username) {
return getLists(instanceName, users[username].accessToken)
}

View file

@ -0,0 +1,37 @@
import { createListAs, getListsAs } from '../serverActions'
import { loginAsFoobar } from '../roles'
import {
communityNavButton, getCommunityPinRadioButtonIds, getUrl
} from '../utils'
import { Selector as $ } from 'testcafe'
fixture`134-community.js`
.page`http://localhost:4002`
test('pinnable community items have proper IDs for accessible radio buttons', async t => {
const lists = (await getListsAs('foobar')).map(_ => _.title)
if (!lists.includes('Test list 1')) {
await createListAs('foobar', 'Test list 1')
}
if (!lists.includes('Test list 2')) {
await createListAs('foobar', 'Test list 2')
}
await loginAsFoobar(t)
await t
.click(communityNavButton)
.expect(getUrl()).contains('community')
.expect($('[aria-label=Lists] li:nth-child(1)').innerText).contains('Test list 1')
.expect($('[aria-label=Lists] li:nth-child(2)').innerText).contains('Test list 2')
const ids = await getCommunityPinRadioButtonIds()
await t
.expect(ids.length).gt(0)
const uniqueIds = [...new Set(ids)]
await t
.expect(ids.length).eql(
uniqueIds.length,
`Expect ${JSON.stringify(ids)} to have same length as ${JSON.stringify(uniqueIds)}`
)
.expect($('[role=radiogroup]').getAttribute('aria-owns')).eql(ids.join(' '))
})

View file

@ -165,6 +165,15 @@ export const getActiveElementAriaLabel = exec(() => (
(document.activeElement && document.activeElement.getAttribute('aria-label')) || '' (document.activeElement && document.activeElement.getAttribute('aria-label')) || ''
)) ))
export const getCommunityPinRadioButtonIds = exec(() => {
const buttons = document.querySelectorAll('.page-list-item button')
const res = []
for (let i = 0; i < buttons.length; i++) {
res.push(buttons[i].id)
}
return res
})
export const getActiveElementInsideNthStatus = exec(() => { export const getActiveElementInsideNthStatus = exec(() => {
let element = document.activeElement let element = document.activeElement
while (element) { while (element) {