[$10][MSFT-127] Sample challenge page: The labels for the links under the heading 'share' are incorrectly announced by screen readers when navigating with arrow keys.

[veshu]

Steps to Reproduce

1. Go to the sample challenge page: https://clicktime.symantec.com/34CaebazimgmFxdkBZnihRc7Vc?u=https%3A%2F%2Fwww.topcoder.com%2Fchallenges%2F?tab=details. 2. Ensure that the NVDA screen reader is switched on. 3. Navigate to the 'share' heading. 4. Press the down arrow from here to navigate to the links under this heading. 5. Note that the label of the links are not announced.

Expected Result
Each link should be appropriately labelled not only through the title attribute but a proper link text or aria-label.

Actual Result
Screen reader announces 'link graphic icon f' for facebook, 'link graphic icon twitter' for twitter and so on. It announces 'link graphic icon +' for the link which displays more social sharing links.

Device: Desktop/Labtop
Operating System: Windows
Browser: Chrome

WCAG Category: 1. Perceivable
WCAG Level: A
WCAG Success Criterion: 1.3.1 Info and Relationships
Screen Reader Used: JAWS
Accessibility Audit Tool used: N/A

Attachment
https://topcodermsft-my.sharepoint.com/personal/pd-topcoder_topcodermsft_onmicrosoft_com/Documents/Forms/All.aspx?cid=088f5f5d%2D9b1c%2D4b7e%2Dacbf%2D320c257c9a9a&FolderCTID=0x0120005C598A51049FC14CBA882E1AEE168F51&id=%2Fpersonal%2Fpd%2Dtopcoder%5Ftopcodermsft%5Fonmicrosoft%5Fcom%2FDocuments%2FMSFT%2DTeams%2DQA%2FJune%202019%2F29%20Jun%2FTest%20Results%2FBug%20Videos%20%26%20Log%20Files%2FKameshwarid%2Fbug%2025

[ThomasKranitsas]

Contest https://www.topcoder.com/challenges/30095996 has been created for this ticket.

This is an automated message for thomaskranitsas via Topcoder X

[ThomasKranitsas]

Contest https://www.topcoder.com/challenges/30095996 has been updated - the new changes has been updated for this ticket.

This is an automated message for thomaskranitsas via Topcoder X

[rakshitjadon]

Please assign me

[ThomasKranitsas]

Contest https://www.topcoder.com/challenges/30095996 has been updated - it has been assigned to rakshitjadon.rj.

This is an automated message for thomaskranitsas via Topcoder X

[cwdcwd]

Contest https://www.topcoder.com/challenges/30096863 has been created for this ticket.

This is an automated message for lazybaer via Topcoder X

[cwdcwd]

Contest https://www.topcoder.com/challenges/30096863 has been updated - it has been assigned to Timor.

This is an automated message for lazybaer via Topcoder X

[romitgit]

PR for this issue is ready #3057

[drasticdpk]

@lakshmiathreya @veshu @mishacucicea , i am unable to test it , since that social link are disabled.
Ref Link : https://test-community-app.topcoder-dev.com/challenges/30055274

[mishacucicea]

@drasticdpk I was able to click on the share label and then use tab to go through social links and the screen-reader worked, try again.

[drasticdpk]

Operating System: Windows
Browser: Chrome
URL : https://test-community-app.topcoder-dev.com/challenges/30055274

[drasticdpk]

Verified on
Operating System: Windows/JAWS
Browser: Chrome

[crazyk07]

Payment task has been updated: https://software.topcoder.com/review/actions/ViewProjectDetails?pid=30096863

This is an automated message for crazyk via Topcoder X