fix(datepicker): double role definition on calendar cell

[crisbeto]

Fixes the calendar cells having two role attributes.

Fixes #17280.

[jelbourn]

I'm not sure this is right; I think that we should have a button inside the gridcell.

[crisbeto]

I don't know how much of an effect that would have since focus lands on the td anyway. I think that if we make it land on the button the grid won't be read out anymore.

[jelbourn]

At the very least having a role="row" without a child gridcell is technically invalid and could make axe or Chrome a11y audit complain. I'll try to find some time this week to test both on VoiceOver and ChromeVox (and maybe NVDA and JAWS if I have even more time)

[Splaktar]

Based on the WAI-ARIA datepicker dialog example, it looks like we should indeed have buttons inside of the tds.

 <td class="dateCell">
    <button class="dateButton" tabindex="-1">2</button>
 </td>

Additionally, we put the role="presentation" on the table which doesn't align with the suggestion of using role="grid":

Since the grid role is applied to a table element, the row, colheader, and gridcell roles do not need to be specified because they are implied by tr, th, and td tags.

[Splaktar]

I tested this change on NVDA 2019.2.1 and it's problematic (though not any worse than before this change). The behavior with NVDA was significantly better in Angular Material 7.x. I compare how things have regressed on NVDA here. NVDA has the same behavior with the change in this PR or without.

While #17280 mentions the duplicate roles, #17689 tracks the regression in screen reader support from 7.x to 8.2+.

[crisbeto]

@jelbourn what should we do about this PR? We still have the duplicate roles in master.

[jelbourn]

I just tested this in ChromeVox, NVDA, and VoiceOver. NVDA does not work well with a button here, but all three work well with gridcell, so I believe we should just remove the button role.

[crisbeto]

Done.

[jelbourn]

LGTM

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}