search

ngOfficeUIFabric / ng-officeuifabric

Office UI Fabric (https://github.com/OfficeDev/office-ui-fabric) implementation for Angular
http://ngOfficeUiFabric.com
MIT License
320 stars 67 forks source link

AngularJS DatePicker is not accessible (like the other Fabric UI implementations) #493

Closed iconix closed 7 years ago

iconix commented 7 years ago

The AngularJS implementation of the Office UI Fabric DatePicker has broken component accessibility somehow.

I have an Office Add-In built with Angular that needs to be accessible - so I might have to abandon this library in favor of the vanilla Fabric JS one...

Expected Behavior

When the DatePicker calendar is rendered, I should be able to navigate with my keyboard to select dates, like the Fabric JS or Fabric React implementations.

Actual Behavior

When the Angular JS DatePicker calendar is rendered, the popup component does not receive focus and thus cannot be navigated. See the official demo for this behavior repro.

Steps to Reproduce Behavior

  1. Tab into the DatePicker input field until it has focus. The calendar should render as a popup when you do so.
  2. Attempt to use the arrow keys, etc. to change the date selected. In Fabric JS and Fabric React, this kind of navigation works. In Angular JS, it does not. See links provided above.
andrewconnell commented 7 years ago

Unfortunately, the MDL1 version of Office UI Fabric took a dependency on pickadate.js which has numerous accessibility issues. Looking at that project, I see the author hasn't contributed to it in quite a while and is only merging PR's (which is still good)... in fact the owner is looking for someone else to maintain it looking at the repo's README. We are using the most current release of the project.

There's not much we can do other than having someone submit a PR to that repo and hope it gets merged with another release. We can't use a different date picker library because the CSS in the Office UI Fabric we depend on is based on pickadate.js.

So that leaves us in a state where I don't think we can do much with this ATM. Not saying your issue isn't relevant or accessibility is important... just stating where the project is in its support for AngualrJS (v1.x).

As for Office UI Fabric JS... I'd use caution adopting it. Even MSFT has said that it doesn't have much future... notice while Fabric React has had a lot of activity this year, you will find minimal commits to Fabric JS this calendar year.

andrewconnell commented 7 years ago

BTW, I'm closing this issue but feel free to continue the discussion. I am tagging with wontfix because it's not something ngOfficeUIFabric can address as it's out of scope for our other components.