Accessibility issues

[nicozerr]

Hello,

Some accessibility problems have been detected, according to international WCAG, french RGAA... Here are the accessibility issues to be fixed:

• On <iframe> tag, replace frameborder, scrolling, width and height HTML attributes by their equivalents in CSS (border, overflow, width and height ).
  It will allow some users to customize the appareance by overriding CSS.
• On <iframe> tag, replace aria-roledescription=presentation (that provides no interesting information) by role=group title="mCaptcha: Mandatory checkbox for security check" (or something like that).
• Replace the <main> tag by a <div> tag.
  No need to define a main content area while this module is always implemented via an iframe in a specific area of a website)
• Remove the text "mCaptcha logo" from the logo.
  The wrapping link will have the accessible name "mcaptcha" instead of "logo mcaptcha mCaptcha".
• Provide translations for every texts ("I'm not a robot", "Processing", "Verified", "mCaptcha: Mandatory checkbox for security check"...), maybe using a GET parameter in the API URL. Ex.: https://demo.mcaptcha.org/widget?sitekey=XXXX&lang=fr (for french language for example).

[edouardroger]

Hi, regarding the checkbox, are the aria-checked and aria-valuenow attributes really necessary? :)

[nicozerr]

Well done, I hadn't seen it.

• aria-checked is not necessary because the checkbox is a real checkbox with an implicit "checked/unchecked" states. But it's not an accessibility error, just an HTML warning.
• aria-valuenow and aria-valuetext are for input[type="range"] only, not for checkbox (HTML error). In addition, they are useless because the label is also changing after the checkbox is checked. Theses attributes must be removed. A new test will have to be done to check if the screen reader reads the label again after it changes.

[realaravinth]

Thanks for the pointers, @nicozerr and @edouardroger <3

Would anyone mind sending a PR for the same?

[nicozerr]

I'll try to create a PR ASAP

[nicozerr]

I'm sorry but using Docker, WSL 2 and all these stuffs is too complicated for me. I'm always stuck somewhere, I don't understand this mess. I'll try again when I'll have many hours/days to figure it out.