Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Calendar keyboard navigation accessibility #6275

Closed
damyanpetev opened this issue Dec 3, 2019 · 6 comments · Fixed by #8314
Closed

Calendar keyboard navigation accessibility #6275

damyanpetev opened this issue Dec 3, 2019 · 6 comments · Fixed by #8314
Assignees
@zdrawku @ddincheva @radomirchev
Labels
📆 calendar 📈 enhancement keyboard-navigation ♿ a11y When the issue or PR is related to accessibility ✅ status: resolved Applies to issues that have pending PRs resolving them, or PRs that have already merged.

Comments

@damyanpetev
Copy link
Member

Is your feature request related to a problem? Please describe.

Related to #6272, after looking at the descriptions for calendar in the datepicker example:
"calendar that uses the grid pattern"
"as specified in the grid design pattern, only one button in the calendar grid is in the Tab sequence."

In other words, tab navigation through the calendar is supposed to allow you to jump through the prev/next buttons, the year/month pickers and the calendar grid itself. Right now the calendar handles the tab as it would cursor keys, which is super tedious.

Describe the solution you'd like

The tab navigation of the calendar should allow you to jump through the separate groups and have a single tab stop for the actual calendar grid.

Additional context

I realize this is a behavior change from the current implementation, but the way the spec describes the behavior seems very reasonable, so I'm logging this as an enhancement.
@damyanpetev damyanpetev added 📈 enhancement 📆 calendar ♿ a11y When the issue or PR is related to accessibility labels Dec 3, 2019
@damyanpetev
Copy link
Member Author

Actually, I don't see that in the spec.. Is this Tab behavior simply a side-effect of the date elements being focusable?

@hanastasov
Copy link
Contributor

hanastasov commented Dec 3, 2019 •
edited
Loading

Actually, I don't see that in the spec.. Is this Tab behavior simply a side-effect of the date elements being focusable?

Currently, we just let the browser handle the tabs as it would. I don'` know if this was intentional, I guess yes. There are some tweaks though that skip a disabled/non-visible date when tabbing.

@jackofdiamond5 jackofdiamond5 mentioned this issue Dec 4, 2019
Closed
14 tasks
@github-actions
Copy link

There has been no recent activity and this issue has been marked inactive.

@github-actions github-actions bot added the status: inactive Used to stale issues and pull requests label May 11, 2020
@zdrawku
Copy link
Contributor

zdrawku commented May 11, 2020

@radomirchev does "Next Milestone Draft" means that this issue is planned for the next milestone?

@zdrawku zdrawku removed the status: inactive Used to stale issues and pull requests label May 11, 2020
@radomirchev
Copy link
Contributor

@zdrawku it is a draft, not a final version. It is under consideration to be included in the next milestone.

@github-actions
Copy link

There has been no recent activity and this issue has been marked inactive.

@github-actions github-actions bot added the status: inactive Used to stale issues and pull requests label Jul 15, 2020
@zdrawku zdrawku removed the status: inactive Used to stale issues and pull requests label Jul 20, 2020
@zdrawku zdrawku assigned ddincheva and unassigned hanastasov Sep 24, 2020
@zdrawku zdrawku added the 🛠️ status: in-development Issues and PRs with active development on them label Sep 25, 2020
ddincheva added a commit that referenced this issue Oct 4, 2020
@ddincheva
feat(IgxMonthView): add one tab stop in the month view #6275
9c93344
ddincheva added a commit that referenced this issue Oct 4, 2020
@ddincheva
feat(IgxYearsView): add tabIndex to years view elements #6275
aadcf0a
ddincheva added a commit that referenced this issue Oct 4, 2020
@ddincheva
feat(*): reset tab Index when navigationg out of the calendar #6275
5a5ddfe
ddincheva added a commit that referenced this issue Oct 7, 2020
@ddincheva
feat(DateItem): update activeDate on focus #6275
345fb9d
ddincheva added a commit that referenced this issue Oct 7, 2020
@ddincheva
feat(Calendar): recalc activeDate when views are changed #6275
93a2aff
ddincheva added a commit that referenced this issue Oct 7, 2020
@ddincheva
feat(Calendar): remove tabIndex from the component itself #6275
9bf6560
ddincheva added a commit that referenced this issue Oct 8, 2020
@ddincheva
test(IgxCalendar): verify that tabIndex is applied correctly #6275
35f3787
@ddincheva ddincheva mentioned this issue Oct 8, 2020
Merged
14 tasks
ddincheva added a commit that referenced this issue Oct 9, 2020
@ddincheva
fix(YearsView): navigate correctly in the years view #6275
a618947
@zdrawku zdrawku added ✅ status: resolved Applies to issues that have pending PRs resolving them, or PRs that have already merged. and removed 🛠️ status: in-development Issues and PRs with active development on them labels Oct 9, 2020
ddincheva added a commit that referenced this issue Oct 9, 2020
@ddincheva
fix(Calendar): reset the date only when the days view looses focus #6275
e55e390
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@zdrawku zdrawku

@ddincheva ddincheva

@radomirchev radomirchev

Labels
📆 calendar 📈 enhancement keyboard-navigation ♿ a11y When the issue or PR is related to accessibility ✅ status: resolved Applies to issues that have pending PRs resolving them, or PRs that have already merged.
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Calendar keyboard navigation improvements IgniteUI/igniteui-angular
5 participants
@damyanpetev @zdrawku @hanastasov @ddincheva @radomirchev