Contrib.social

Accessibility Test Result: Content Not in Region

Open on Drupal.org →
Created on 14 December 2023, 7 months ago
Updated 12 January 2024, 6 months ago

Problem/Motivation

We've begun running automated accessibility tests on our site using axe-core. Its report included this which comes from the Fluid UI module:

    {
        "id": "region",
        "impact": "moderate",
        "tags": [
            "cat.keyboard",
            "best-practice"
        ],
        "description": "Ensures all page content is contained by landmarks",
        "help": "All page content should be contained by landmarks",
        "helpUrl": "https://dequeuniversity.com/rules/axe/4.8/region?application=playwright",
        "nodes": [
            {
                "any": [
                    {
                        "id": "region",
                        "data": {
                            "isIframe": false
                        },
                        "relatedNodes": [],
                        "impact": "moderate",
                        "message": "Some page content is not contained by landmarks"
                    }
                ],
                "all": [],
                "none": [],
                "impact": "moderate",
                "html": "<div class=\"flc-slidingPanel-panel flc-prefsEditor-iframe\" id=\"fluid-id-7fpxxib6-429\" aria-label=\"User Preferences\" role=\"group\" style=\"overflow: hidden; height: 0px;\" aria-expanded=\"false\">",
                "target": [
                    "#fluid-id-7fpxxib6-429"
                ],
                "failureSummary": "Fix any of the following:\n  Some page content is not contained by landmarks"
            }
        ]
    }

Proposed resolution

Add a landmark region around the preferences editor panel. I'm not sure any of the specific region tags make sense, so maybe a section with an aria-label. This would be a change in templates/fluid-ui-block.html.twig, I believe, and might be as simple as swapping out the top div with a section and adding the aria-label.

🐛 Bug report
Status

Fixed

Version

2.0

Component

Code

Created by

🇨🇦Canada ryanrobinson_wlu

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Merge Requests

Comments & Activities

contrib.social Blog FAQ Discussions
Production build 0.69.0 2024