Plugin Info Modal Close Button Does Not Announce for Screen Readers

[davidakennedy]

I was testing RC 1 and this slipped by in earlier testing of the plugin area.

The plugin info modal close button does not announce for screen readers.

This is the link with an id of TB_closeWindowButton.

• The link uses only icon fonts inside the , but icon fonts are not announced by screen readers.
• The title attribute may be intended for screen readers, but it's not announced by default by screen readers either, and it's really only useful for users with a mouse. See this post for more info on the title attribute: ​http://www.paciellogroup.com/blog/2013/01/using-the-html-title-attribute-updated/
• When a screen reader announces these links, it says: "Link", which isn't descriptive and doesn't tell the user what the link does or where it goes.

Suggested fix:

The text "Close" can be added with a class of screen-reader-text.

• Links should always have link text.
• The screen-reader-text would be hidden off-screen, maintaining the design of the close link.

This would have it announce in screen readers. And be an easy fix. :)

[SergeyBiryukov]

29455.patch​ removes the title attribute in favor of .screen-reader-text.

29455.2.patch​ also makes the markup more readable, if we want to do that.

[SergeyBiryukov]

Thickbox can also be used on front-end, where .screen-reader-text may not be available. We should make sure not to break anything.

[arush]

Tested 29455.2 with Jaws 14, Jaws 15 and IE 10 and 11 and the non-displaying close button shows and activates as it should.

[helen]

Is this problem new to 4.0?

[arush]

Yes this is new to 4.0.

[johnbillion]

In 30376:

Improve Thickbox's close button so it can be announced by screen readers.

Fixes #29455
Props SergeyBiryukov