script/test-accessibility.js
/**
* A generator function which loops over each page, runs pa11y then yield the
* results.
*/
A generator function which loops over each page, runs pa11y then yield the
results.
A generator function which loops over each page runs pa11y then yield the results .
async function* checkNextPage() {
    const sampleCategories = [categories[0]];
    const publicDir = path.join(__dirname, "../public");
    const pages = renderStatic.getPagesFromRoutes(routes, sampleCategories);
    const chromeLaunchConfig = {
        "args": [
            "--headless",
            "--no-sandbox",
            "--acceptInsecureCerts=true",
            "--ignore-certificate-errors",
        ]
    }
    process.stdout.write("Testing page accessibility")
    for (const [i, page] of pages.entries()) {
        const uri = `file://${publicDir}${page.filePath}`;
        if (!process.env.CI) {
            process.stdout.write(
                ansiEscapes.eraseStartLine +
                ansiEscapes.cursorLeft +
                `Testing page accessibility (${i + 1} of ${pages.length})`
            );
        }
        yield {...page, results: await pa11y(uri, {
            includeWarnings: true,
            standard: "WCAG2AA",
            runners: [
                "htmlcs",
            ],
            chromeLaunchConfig,
            hideElements: '.ScreenReader', 
            ignore: [
                'WCAG2AA.Principle1.Guideline1_4.1_4_3.G18.BgImage',
                'WCAG2AA.Principle1.Guideline1_4.1_4_3.G145.BgImage',
            ],
        })};
    }
    process.stdout.write("\n")
}
async function * checkNextPage ( ) { const sampleCategories = [ categories [ 0 ] ] ; const publicDir = path . join ( __dirname , "../public" ) ; const pages = renderStatic . getPagesFromRoutes ( routes , sampleCategories ) ; const chromeLaunchConfig = { "args" : [ "--headless" , "--no-sandbox" , "--acceptInsecureCerts=true" , "--ignore-certificate-errors" , ] } process . stdout . write ( "Testing page accessibility" ) for ( const [ i , page ] of pages . entries ( ) ) { const uri = ` ${ publicDir } ${ page . filePath } ` ; if ( ! process . env . CI ) { process . stdout . write ( ansiEscapes . eraseStartLine + ansiEscapes . cursorLeft + ` ${ i + 1 } ${ pages . length } ` ) ; } yield { ... page , results : await pa11y ( uri , { includeWarnings : true , standard : "WCAG2AA" , runners : [ "htmlcs" , ] , chromeLaunchConfig , hideElements : '.ScreenReader' , ignore : [ 'WCAG2AA.Principle1.Guideline1_4.1_4_3.G18.BgImage' , 'WCAG2AA.Principle1.Guideline1_4.1_4_3.G145.BgImage' , ] , } ) } ; } process . stdout . write ( "\n" ) }
A generator function which loops over each page, runs pa11y then yield the
results.
A generator function which loops over each page runs pa11y then yield the results .
// Our ScreenReader component uses // absolute positioning in order to make text visible to a // screen reader but not a sighted user. Pa11y doesn't like // absolute positioning so we need to disable this. // Unfortunately pa11y doesn't allow you to disable a // specific rule for a specific element // (https://github.com/pa11y/pa11y-ci/issues/158) so we just // wholesale ignore the component for now. // Ask Izzy's design currently features text over an image // prominently in the Heading. This is something we've talked // about changing for legibility reasons but for now that's // what we've got.