# Accessibility Insights for Web FastPass results

# FastPass results

## Scan details

- target page url: http://10.24.1.193:3000/create
- scan date:2022-03-28 12:00 PM UTC
- comment:First "Create tournament" page test - results

## Summary

2
0
25

## Automated checks

### Failed instances 2Failed instances
22 Failed

Resources for this rule
More information about color-contrast WCAG 1.4.3

- Path | .MuiButton-outlined
  Snippet | <span class="MuiButton-root MuiButton-outlined MuiButton-outlinedPrimary MuiButton-sizeMedium MuiButton-outlinedSizeMedium MuiButtonBase-root css-1rwt2y5-MuiButtonBase-root-MuiButton-root" tabindex="0" role="button">

  How to fix

  Fix the following:
  - Element has insufficient color contrast of 4.09 (foreground color: #1976d2, background color: #f0f2f2, font size: 10.5pt (14px), font weight: normal). Expected contrast ratio of 4.5:1Element has insufficient color contrast of 4.09 (foreground color: #1976d2, background color: #f0f2f2, font size: 10.5pt (14px), font weight: normal). Expected contrast ratio of 4.5:1
    - Use foreground color: #156abd and the original background color: #f0f2f2 to meet a contrast ratio of 4.88:1 Use foreground color: #156abd and the original background color: #f0f2f2 to meet a contrast ratio of 4.88:1
    - Or use background color: #fcfefe and the original foreground color: #1976d2 to meet a contrast ratio of 4.55:1.Or use background color: #fcfefe and the original foreground color: #1976d2 to meet a contrast ratio of 4.55:1.

Resources for this rule
More information about select-name WCAG 1.3.1 , WCAG 4.1.2

- Path | #max-teams-select
  Snippet | <select id="max-teams-select"><option value="2">2</option><option value="4">4</option><option value="8">8</option><option value="16">16</option><option value="32">32</option><option value="64">64</option><option value="128">128</option></select>

  How to fix

  Fix ONE of the following:
  - Form element does not have an implicit (wrapped) <label>
  - Form element does not have an explicit <label>
  - aria-label attribute does not exist or is empty
  - aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty
  - Element has no title attribute
  - Element's default semantics were not overridden with role="none" or role="presentation"

aria-allowed-attr: Ensures ARIA attributes are allowed for an element's role(WCAG 4.1.2)
aria-command-name: Ensures every ARIA button, link and menuitem has an accessible name(WCAG 4.1.2)
aria-hidden-body: Ensures aria-hidden='true' is not present on the document body.(WCAG 4.1.2)
aria-hidden-focus: Ensures aria-hidden elements do not contain focusable elements(WCAG 1.3.1 , WCAG 4.1.2)
aria-required-attr: Ensures elements with ARIA roles have all required ARIA attributes(WCAG 4.1.2)
aria-roles: Ensures all elements with a role attribute use a valid value(WCAG 4.1.2)
aria-valid-attr-value: Ensures all ARIA attributes have valid values(WCAG 4.1.2)
aria-valid-attr: Ensures attributes that begin with aria- are valid ARIA attributes(WCAG 4.1.2)
avoid-inline-spacing: Ensure that text spacing set through style attributes can be adjusted with custom stylesheets(WCAG 1.4.12)New for WCAG 2.1
button-name: Ensures buttons have discernible text(WCAG 4.1.2)
color-contrast: Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds(WCAG 1.4.3)
document-title: Ensures each HTML document contains a non-empty <title> element(WCAG 2.4.2)
duplicate-id-active: Ensures every id attribute value of active elements is unique(WCAG 4.1.1)
duplicate-id-aria: Ensures every id attribute value used in ARIA and in labels is unique(WCAG 4.1.1)
html-has-lang: Ensures every HTML document has a lang attribute(WCAG 3.1.1)
html-lang-valid: Ensures the lang attribute of the <html> element has a valid value(WCAG 3.1.1)
image-alt: Ensures <img> elements have alternate text or a role of none or presentation(WCAG 1.1.1)
label: Ensures every form element has a label(WCAG 1.3.1 , WCAG 4.1.2)
link-name: Ensures links have discernible text(WCAG 2.4.4 , WCAG 4.1.2)
nested-interactive: Nested interactive controls are not announced by screen readers(WCAG 4.1.2)

## Tab stops

### Failed instances 0Failed instances
00 Failed

Keyboard navigation: All interactive elements can be reached using the Tab and arrow keys.(WCAG 2.1.1)
Keyboard traps: There are no interactive elements that “trap” input focus and prevent navigating away.(WCAG 2.1.2)
Focus indicator: All interactive elements give a visible indication when they have input focus.(WCAG 2.4.7)
Tab order: The tab order is consistent with the logical order that's communicated visually.(WCAG 2.4.3)
Input focus: Input focus does not move unexpectedly without the user initiating it.(WCAG 2.3.1)