Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update a11y.js for 2025 #141

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Conversation

mgifford
Copy link

Resolves #1

This will expand it to include Drupal 7 and a little CMS called WordPress that might have a bit of traction.


Test websites:

This will expand it to include Drupal 7 and a little CMS called WordPress that might have a bit of traction.
Copy link

Custom metrics for https://almanac.httparchive.org/en/2022/

WPT test run results: http://webpagetest.httparchive.org/results.php?test=240825_KY_1
Changed custom metrics values:

{
  "_a11y": {
    "tables": {
      "total": 0,
      "total_with_caption": 0,
      "total_with_presentational": 0,
      "total_with_figcaption": 0
    },
    "file_extension_alts": {
      "total_elements_with_alt": 5,
      "total_elements_with_non_empty_alt": 0,
      "total_with_file_extension": 0,
      "file_extensions": {}
    },
    "title_and_alt": {
      "total_alt": 5,
      "total_title": 5,
      "total_both": 0,
      "total_alt_same_as_title": 0
    },
    "th_with_scope_attribute": {
      "total_th": 0,
      "total_with_scope": 0,
      "scopes": {}
    },
    "td_with_headers_attribute": {
      "total_tds": 0,
      "total_with_headers": 0
    },
    "total_anchors_with_role_button": 0,
    "total_role_tab_with_selected_and_controls": 0,
    "placeholder_but_no_label": {
      "total_placeholder": 4,
      "total_no_label": 0
    },
    "divs_or_spans_as_button_or_link": {
      "total_role_button": 0,
      "total_role_link": 0,
      "total_either": 0
    },
    "screen_reader_classes": true,
    "form_control_a11y_tree": {
      "__error": {
        "stack": "TypeError: Cannot read properties of undefined (reading 'value')\n    at addControlToStats (<anonymous>:202:28)\n    at <anonymous>:246:1\n    at captureAndLogError (<anonymous>:30:8)\n    at wptCustomMetric (<anonymous>:195:25)\n    at <anonymous>:318:7",
        "message": "Cannot read properties of undefined (reading 'value')"
      }
    },
    "fieldset_radio_checkbox": {
      "total_radio": 0,
      "total_checkbox": 0,
      "total_radio_in_fieldset": 0,
      "total_checkbox_in_fieldset": 0,
      "fieldsets": []
    },
    "required_form_controls": []
  }
}
Custom metrics for https://wordpress.org

WPT test run results: http://webpagetest.httparchive.org/results.php?test=240825_J1_2
Changed custom metrics values:

{
  "_a11y": {
    "tables": {
      "total": 0,
      "total_with_caption": 0,
      "total_with_presentational": 0,
      "total_with_figcaption": 0
    },
    "file_extension_alts": {
      "total_elements_with_alt": 17,
      "total_elements_with_non_empty_alt": 11,
      "total_with_file_extension": 0,
      "file_extensions": {}
    },
    "title_and_alt": {
      "total_alt": 17,
      "total_title": 1,
      "total_both": 0,
      "total_alt_same_as_title": 0
    },
    "th_with_scope_attribute": {
      "total_th": 0,
      "total_with_scope": 0,
      "scopes": {}
    },
    "td_with_headers_attribute": {
      "total_tds": 0,
      "total_with_headers": 0
    },
    "total_anchors_with_role_button": 0,
    "total_role_tab_with_selected_and_controls": 0,
    "placeholder_but_no_label": {
      "total_placeholder": 1,
      "total_no_label": 0
    },
    "divs_or_spans_as_button_or_link": {
      "total_role_button": 0,
      "total_role_link": 0,
      "total_either": 0
    },
    "screen_reader_classes": false,
    "form_control_a11y_tree": [
      {
        "type": "button",
        "attributes": {
          "aria-haspopup": "dialog",
          "aria-label": "Open Search"
        },
        "properties": {
          "invalid": "false",
          "focusable": true,
          "hasPopup": "dialog"
        },
        "accessible_name": "Open Search",
        "accessible_name_sources": [
          {
            "type": "attribute",
            "value": "Open Search",
            "attribute": "aria-label"
          }
        ],
        "role": "button"
      },
      {
        "type": "button",
        "attributes": {
          "aria-label": "Extend submenu",
          "aria-expanded": "false"
        },
        "properties": {
          "invalid": "false",
          "focusable": true,
          "expanded": false
        },
        "accessible_name": "Extend submenu",
        "accessible_name_sources": [
          {
            "type": "attribute",
            "value": "Extend submenu",
            "attribute": "aria-label"
          },
          {
            "type": "contents",
            "value": "Extend"
          }
        ],
        "role": "button"
      },
      {
        "type": "button",
        "attributes": {
          "aria-label": "Learn submenu",
          "aria-expanded": "false"
        },
        "properties": {
          "invalid": "false",
          "focusable": true,
          "expanded": false
        },
        "accessible_name": "Learn submenu",
        "accessible_name_sources": [
          {
            "type": "attribute",
            "value": "Learn submenu",
            "attribute": "aria-label"
          },
          {
            "type": "contents",
            "value": "Learn"
          }
        ],
        "role": "button"
      },
      {
        "type": "button",
        "attributes": {
          "aria-label": "Community submenu",
          "aria-expanded": "false"
        },
        "properties": {
          "invalid": "false",
          "focusable": true,
          "expanded": false
        },
        "accessible_name": "Community submenu",
        "accessible_name_sources": [
          {
            "type": "attribute",
            "value": "Community submenu",
            "attribute": "aria-label"
          },
          {
            "type": "contents",
            "value": "Community"
          }
        ],
        "role": "button"
      },
      {
        "type": "button",
        "attributes": {
          "aria-label": "About submenu",
          "aria-expanded": "false"
        },
        "properties": {
          "invalid": "false",
          "focusable": true,
          "expanded": false
        },
        "accessible_name": "About submenu",
        "accessible_name_sources": [
          {
            "type": "attribute",
            "value": "About submenu",
            "attribute": "aria-label"
          },
          {
            "type": "contents",
            "value": "About"
          }
        ],
        "role": "button"
      }
    ],
    "fieldset_radio_checkbox": {
      "total_radio": 0,
      "total_checkbox": 0,
      "total_radio_in_fieldset": 0,
      "total_checkbox_in_fieldset": 0,
      "fieldsets": []
    },
    "required_form_controls": [
      {
        "has_visible_required_asterisk": false,
        "has_required": true,
        "has_aria_required": false
      }
    ]
  }
}
Custom metrics for https://backdropcms.org

WPT test run results: http://webpagetest.httparchive.org/results.php?test=240825_AE_3
Changed custom metrics values:

{
  "_a11y": {
    "tables": {
      "total": 0,
      "total_with_caption": 0,
      "total_with_presentational": 0,
      "total_with_figcaption": 0
    },
    "file_extension_alts": {
      "total_elements_with_alt": 19,
      "total_elements_with_non_empty_alt": 6,
      "total_with_file_extension": 0,
      "file_extensions": {}
    },
    "title_and_alt": {
      "total_alt": 19,
      "total_title": 47,
      "total_both": 0,
      "total_alt_same_as_title": 0
    },
    "th_with_scope_attribute": {
      "total_th": 0,
      "total_with_scope": 0,
      "scopes": {}
    },
    "td_with_headers_attribute": {
      "total_tds": 0,
      "total_with_headers": 0
    },
    "total_anchors_with_role_button": 0,
    "total_role_tab_with_selected_and_controls": 0,
    "placeholder_but_no_label": {
      "total_placeholder": 0,
      "total_no_label": 0
    },
    "divs_or_spans_as_button_or_link": {
      "total_role_button": 0,
      "total_role_link": 0,
      "total_either": 0
    },
    "screen_reader_classes": false,
    "form_control_a11y_tree": [
      {
        "type": "input",
        "attributes": {
          "id": "menu-toggle-state",
          "type": "checkbox",
          "aria-controls": "menu-toggle-state"
        },
        "properties": {
          "invalid": "false",
          "focusable": true,
          "checked": "false",
          "controls": "menu-toggle-state"
        },
        "accessible_name": "Menu Toggle menu visibility",
        "accessible_name_sources": [
          {
            "type": "relatedElement",
            "value": "Menu Toggle menu visibility"
          }
        ],
        "role": "checkbox"
      },
      {
        "type": "input",
        "attributes": {
          "type": "email",
          "id": "edit-email",
          "name": "email",
          "maxlength": "254"
        },
        "properties": {
          "invalid": "false",
          "focusable": true,
          "editable": "plaintext",
          "settable": true,
          "multiline": false,
          "readonly": false,
          "required": false
        },
        "accessible_name": "Email address",
        "accessible_name_sources": [
          {
            "type": "relatedElement",
            "value": "Email address"
          }
        ],
        "role": "textbox"
      },
      {
        "type": "input",
        "attributes": {
          "type": "checkbox",
          "id": "edit-confirm",
          "name": "confirm"
        },
        "properties": {
          "invalid": "false",
          "focusable": true,
          "checked": "true"
        },
        "accessible_name": "I agree to receive this newsletter, and understand that I can easily unsubscribe at any time by using the link in any email. *",
        "accessible_name_sources": [
          {
            "type": "relatedElement",
            "value": "I agree to receive this newsletter, and understand that I can easily unsubscribe at any time by using the link in any email. *"
          }
        ],
        "role": "checkbox"
      },
      {
        "type": "input",
        "attributes": {
          "type": "submit",
          "id": "edit-signup",
          "name": "op"
        },
        "properties": {
          "invalid": "false",
          "focusable": true
        },
        "accessible_name": "Sign up",
        "accessible_name_sources": [
          {
            "type": "attribute",
            "value": "Sign up",
            "attribute": "value"
          },
          {
            "type": "contents",
            "value": "Sign up"
          }
        ],
        "role": "button"
      }
    ],
    "fieldset_radio_checkbox": {
      "total_radio": 0,
      "total_checkbox": 2,
      "total_radio_in_fieldset": 0,
      "total_checkbox_in_fieldset": 0,
      "fieldsets": []
    },
    "required_form_controls": [
      {
        "has_visible_required_asterisk": true,
        "has_required": false,
        "has_aria_required": false
      }
    ]
  }
}

@@ -215,7 +215,7 @@ return JSON.stringify({
};
}),
screen_reader_classes: captureAndLogError(() => {
return document.querySelectorAll('.sr-only, .visually-hidden').length > 0;
return document.querySelectorAll('.sr-only, .visually-hidden', '.screen-reader-text', 'element-invisible').length > 0;

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I believe this should be .element-invisible, per https://www.drupal.org/node/2022859

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oops.. Thanks @joedoleson..

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oops.. Thanks @joedoleson..

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants