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

[Lens] (Accessibility) Fix focus on drag and drop actions #90561

Merged
merged 7 commits into from
Feb 10, 2021

Conversation

mbondyra
Copy link
Contributor

@mbondyra mbondyra commented Feb 7, 2021

Summary

Fixes #90586

  1. When a field from datasource is added to workspace or dimension panel by dnd, the focus stays on the field. I made this decision thinking that user may want to add multiple fields one after another
    focus field

  2. For all the operations inside dimension panel, the focus moves to the target.
    dimension-focus

@mbondyra mbondyra marked this pull request as ready for review February 8, 2021 10:29
@mbondyra mbondyra added Feature:Lens v7.12.0 release_note:skip Skip the PR/issue when compiling release notes Team:Visualizations Visualization editors, elastic-charts and infrastructure v8.0.0 labels Feb 8, 2021
@elasticmachine
Copy link
Contributor

Pinging @elastic/kibana-app (Team:KibanaApp)

@mbondyra mbondyra changed the title [Lens] drag and drop focus management [Lens] Fix focus on drag and drop actions Feb 8, 2021
@elastic elastic deleted a comment from kibanamachine Feb 8, 2021
@mbondyra mbondyra changed the title [Lens] Fix focus on drag and drop actions [Lens] (Accessibility) Fix focus on drag and drop actions Feb 8, 2021
@mbondyra
Copy link
Contributor Author

mbondyra commented Feb 8, 2021

@elasticmachine merge upstream

Copy link
Contributor

@myasonik myasonik left a comment

Choose a reason for hiding this comment

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

🚀

Played around with it and couldn't break it. Seems good!

@mbondyra
Copy link
Contributor Author

mbondyra commented Feb 9, 2021

@elasticmachine merge upstream

@flash1293
Copy link
Contributor

@elasticmachine merge upstream

Copy link
Contributor

@flash1293 flash1293 left a comment

Choose a reason for hiding this comment

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

Tested in Chrome and Firefox and works fine for me

import { useEffect, useState, useCallback } from 'react';

const getFirstFocusable = (el: HTMLElement | null) => {
const focusableSelector = 'button, [href], input, select, textarea, [tabindex]';
Copy link
Contributor

Choose a reason for hiding this comment

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

nit: It's not used in Kibana at the moment, but there's a dependency to tabbable already which is also used by EUI for this task. Maybe we can use it here as well.

@kibanamachine
Copy link
Contributor

💚 Build Succeeded

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id before after diff
lens 481 482 +1

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id before after diff
lens 892.2KB 893.1KB +925.0B

History

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

@mbondyra mbondyra merged commit df3e14d into elastic:master Feb 10, 2021
@mbondyra mbondyra deleted the lens/focus_management branch February 10, 2021 12:50
mbondyra added a commit to mbondyra/kibana that referenced this pull request Feb 10, 2021
gmmorris added a commit to gmmorris/kibana that referenced this pull request Feb 10, 2021
* master: (99 commits)
  [Fleet] Use Fleet Server indices in the search bar (elastic#90835)
  [Search Sessions] added an info flyout to session management (elastic#90559)
  [ILM] Revisit searchable snapshot field after new redesign (elastic#90793)
  [Alerting] License Errors on Alert List View (elastic#89920)
  RFC Improve saved object migrations algorithm (elastic#84333)
  [Lens] (Accessibility) Fix focus on drag and drop actions (elastic#90561)
  Use new shortcut links to Fleet discuss forums. (elastic#90786)
  Do not generate an ephemeral encryption key in production. (elastic#81511)
  [Fleet] Use staging registry for snapshot builds (elastic#90327)
  Actually deleting x-pack/tsconfig.refs.json (elastic#90898)
  Add deprecation warning to all Beats CM pages. (elastic#90741)
  skip flaky suite (elastic#90136)
  Revert "Revert "[Metrics UI] Add Metrics Anomaly Alert Type (elastic#89244)"" (elastic#90889)
  remove ref to removed tsconfig file
  [core.logging] Uses host timezone as default (elastic#90368)
  [Maps] remove maps_file_upload plugin and fold public folder into file_upload plugin (elastic#90292)
  Revert "[Metrics UI] Add Metrics Anomaly Alert Type (elastic#89244)"
  [dev-utils/ci-stats] support disabling ship errors (elastic#90851)
  Prefix with / (elastic#90836)
  [Metrics UI] Add Metrics Anomaly Alert Type (elastic#89244)
  ...
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Feature:Lens release_note:skip Skip the PR/issue when compiling release notes Team:Visualizations Visualization editors, elastic-charts and infrastructure v7.12.0 v8.0.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Lens] (Accessibility) When moving an element to another group by drag and drop, the focus is lost
5 participants