Skip to content

Addressing Issue #999 - [Accessibility] PeoplePicker doesn't have focus border when focused by keyboard#3774

Merged
oengusmacinog-zz merged 2 commits into
microsoft:masterfrom
oengusmacinog-zz:picker-focus-999
Jan 24, 2018
Merged

Addressing Issue #999 - [Accessibility] PeoplePicker doesn't have focus border when focused by keyboard#3774
oengusmacinog-zz merged 2 commits into
microsoft:masterfrom
oengusmacinog-zz:picker-focus-999

Conversation

@oengusmacinog-zz

@oengusmacinog-zz oengusmacinog-zz commented Jan 23, 2018

Copy link
Copy Markdown
Collaborator

Pull request checklist

Description of changes

Added onFocus state Boolean to BasePicker so a class can control the focus css on the input container div.

peoplepicker-focus

Focus areas to test

Checked on Tagpicker, DocumentPicker, and PeoplePicker. I am unsure if there are any other instances but they should all inherit from BasePicker

@joschect joschect left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks great, thanks for the fix!

@joschect

Copy link
Copy Markdown
Contributor

You'll just probably need to update the snaps and include a change file.

You can add a change file by running rush change in the cmd line at the root of this repo and following the prompts.

To update the snaps you'll change directories to packages.office-ui-fabric-react then do npn run update-snapshots

@oengusmacinog-zz

Copy link
Copy Markdown
Collaborator Author

added and emulated 'on focus' blue border to picker fields. This involved adding an onFocus variable to BasePicker state and added a control class to input container div

@oengusmacinog-zz oengusmacinog-zz merged commit bd19b42 into microsoft:master Jan 24, 2018
@oengusmacinog-zz oengusmacinog-zz deleted the picker-focus-999 branch January 24, 2018 19:07
@microsoft microsoft locked as resolved and limited conversation to collaborators Aug 31, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Accessibility] PeoplePicker doesn't have focus border when focused by keyboard

2 participants