bbc/bbc-a11y

Fix iframe errors for h1 and role main

greenc05 opened this issue · 7 comments

Summary

When I run bbc-a11y on https://www.test.bbc.com/afaanoromoo/bbc_afaanoromoo_radio/liveradio I get the following errors:

  • Structure: Headings: Exactly one main heading
    • In frame //div[@id='root']/main/div/div/div/iframe : Found 0 h1 elements.
  • Structure: Containers and landmarks: Exactly one main landmark
    • In frame //div[@id='root']/main/div/div/div/iframe : Found 0 elements with role="main".

iframes do not have to contain one main heading nor do they have to have exactly one main landmark, however the page they are embedded on must have both these - these elements do not have to come from the iframe, it could be elsewhere on the page.

Expected Behaviour

When I run bbc-a11y on https://www.test.bbc.com/afaanoromoo/bbc_afaanoromoo_radio/liveradio I should not get the following errors as the page itself has exactly one main heading and exactly one main landmark:

  • Structure: Headings: Exactly one main heading
    • In frame //div[@id='root']/main/div/div/div/iframe : Found 0 h1 elements.
  • Structure: Containers and landmarks: Exactly one main landmark
    • In frame //div[@id='root']/main/div/div/div/iframe : Found 0 elements with role="main".

Thanks for opening the issue.

It's an interesting one. Are the MAG structure requirements intended to apply to iFrames or not....
I don't have an opinion on this one yet

"iframes do not have to contain one main heading nor do they have to have exactly one main landmark"

Is this your opinion or is it based on something in MAG? I wonder what WCAG and others do.

Feels like whichever way we go, we should update the MAG to be clearer around these requirements.

bbc-a11y is currently aimed at checking a complete page, rather than isolated iframe content or components. I thought I had created an issue to look into how bbc-a11y might be used with components, something we've discussed in PDG, but apparently I haven't yet.

As Jamie points out, perhaps this is something we need to consider in regard the existing guidelines.

Meanwhile, you may wish to use some of the features, such as skip, when testing a page fragment: https://github.com/bbc/bbc-a11y/blob/master/guides/using/using-bbc-a11y-in-your-project.md

"bbc-a11y is currently aimed at checking a complete page" exactly @EmmaJP. So if the complete page has 'Exactly one main heading' and 'Exactly one main landmark' then these errors should not be present as they are on https://www.test.bbc.com/afaanoromoo/bbc_afaanoromoo_radio/liveradio due to the iframe not having these as well.

This is blocking us going live

For visibility, can someone with write access to this repo please add the Simorgh project to this issue (and a ws-media-stream label if possible)

Jonathan said he's not working on this, so we can pick it up

The tool is not working against our pages because the embed doesn't have an H1: https://www.bbc.com/ws/av-embeds/media/bbc_korean_radio/liveradio
Can we can run the tests against the entire page and make exceptions where there is an iframe?

@aeroplanejane - If you want to, in the meantime, you could get bbc-a11y to ignore this error. See https://github.com/bbc/bbc-a11y/blob/master/guides/using/using-bbc-a11y-in-your-project.md#hiding-errors