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.

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

Foldable widgets: added keyboard navigation, removed (broken) animation. #7336

Merged
merged 2 commits into from
Jan 2, 2024

Conversation

isoos
Copy link
Collaborator

@isoos isoos commented Dec 29, 2023

  • Fixes Cannot unfold scoring details with keyboard #7286
  • I think the animation was not working for a while now, not sure when it stopped working. Removing it, as it did trigger an unnecessary reflow, and it slightly messes with keyboard navigation. (I've tried visibility: hidden and transform: scaleY alternatives, but they were not working as expected or were breaking accessibility again).
  • Added keyboard focus to the folding icon. It is somewhat larger on the score page, but really small on the search sidebar. It should be a follow-up to review the sizes and the outline area for them.

e.preventDefault();
await toggle();
});
h.onKeyDown.where((e) => e.key == 'Enter').listen((e) async {
Copy link
Contributor

Choose a reason for hiding this comment

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

Perhaps also spacebar?

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

I was wondering about this, whether we should add Space or not, and if we add it here, we should add it at other places too. Created a new issue to track it: #7341

num scrollDiff = 0;
if (scrollContainer != null) {
// Wait one animation frame before measurements.
Copy link
Contributor

Choose a reason for hiding this comment

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

Not sure I understand all this scrolling logic...

Do we really need it?

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

This is for the mobile view: when the navigation menu is at the bottom, and it is clicked, there is no indication that something has been displayed under the fold. Scrolling to it makes the new content visible.

Copy link
Contributor

Choose a reason for hiding this comment

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

Can we just use scrollIntoView?

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

I think we have tried it and it worked with full-page elements, but had issues with embedded-scroll of the navigation. It may be worth to re-evaluate it again, a lot of time has passed since.

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

#7342 to track it separately

@sigurdm
Copy link
Contributor

sigurdm commented Jan 2, 2024

I'd like to see this on staging also

@isoos isoos merged commit 3896a9f into dart-lang:master Jan 2, 2024
32 checks passed
@isoos isoos deleted the foldable branch January 2, 2024 12:47
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Cannot unfold scoring details with keyboard
2 participants