Skip to content

[Lens] fix drag and drop ghost after Chrome update to 134#213928

Merged
mbondyra merged 5 commits intoelastic:mainfrom
mbondyra:fix_dnd_ghost
Mar 12, 2025
Merged

[Lens] fix drag and drop ghost after Chrome update to 134#213928
mbondyra merged 5 commits intoelastic:mainfrom
mbondyra:fix_dnd_ghost

Conversation

@mbondyra
Copy link
Contributor

@mbondyra mbondyra commented Mar 11, 2025 •
edited by kibanamachine
Loading

Summary

Fixes #213708

Fixes the ghost display. As @nickofthyme pointed out here, the reason was using inset-inline-start: -10000px for the keyboard handler that is one of the children of the draggable component. The quick fix is to just move it outside of the html element that is dragged. @markov00 please assesswhere it should be merged 🙏🏼

@mbondyra mbondyra added Feature:Discover Discover Application Team:Visualizations Team label for Lens, elastic-charts, Graph, legacy editors (TSVB, Visualize, Timelion) t// Feature:Lens Feature:UnifiedFieldList The unified field list component used by Lens & Discover backport:version Backport to applied version labels v9.1.0 v8.19.0 v9.0.1 labels Mar 11, 2025
@mbondyra mbondyra requested review from a team as code owners March 11, 2025 14:20
@elasticmachine
Copy link
Contributor

elasticmachine commented Mar 11, 2025

Pinging @elastic/kibana-visualizations (Team:Visualizations)

markov00
markov00 approved these changes Mar 11, 2025
View reviewed changes
Copy link
Contributor

@markov00 markov00 left a comment

Choose a reason for hiding this comment

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

Tested locally, works perfectly, thanks

akowalska622
akowalska622 approved these changes Mar 11, 2025
View reviewed changes
Copy link
Contributor

@akowalska622 akowalska622 left a comment

Choose a reason for hiding this comment

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

Awesome investigation!

nickofthyme
nickofthyme approved these changes Mar 11, 2025
View reviewed changes
Copy link
Contributor

@nickofthyme nickofthyme left a comment

Choose a reason for hiding this comment

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

Tested and works great!

@jughosta
Copy link
Contributor

jughosta commented Mar 20, 2025

Hi team,
Looks like the backports are not merged yet. Would be nice to have them in before the release.

@kibanamachine
Copy link
Contributor

kibanamachine commented Mar 20, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.

@mbondyra mbondyra mentioned this pull request Mar 21, 2025
Merged
@kibanamachine
Copy link
Contributor

kibanamachine commented Mar 21, 2025

Looks like this PR has backport PRs but they still haven't been merged. Please merge them ASAP to keep the branches relatively in sync.

nickofthyme added a commit that referenced this pull request Mar 21, 2025
@mbondyra @kibanamachine @nickofthyme
[Lens] fix drag and drop failing test (#215439)
42e5799 
## Summary

Fixes #213324

For some reason this PR #213928
didn't catch that the changes make the test fail. This PR fixes it.
After this, we'll be able to backport the original PR.
(The pattern of using `data-attr-field` is already used in Discover so I
think it's a good opportunity to align)

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Nick Partridge <nicholas.partridge@elastic.co>
nickofthyme added a commit to kibanamachine/kibana that referenced this pull request Mar 21, 2025
@mbondyra @kibanamachine @nickofthyme
[Lens] fix drag and drop failing test (elastic#215439)
b740667 
## Summary

Fixes elastic#213324

For some reason this PR elastic#213928
didn't catch that the changes make the test fail. This PR fixes it.
After this, we'll be able to backport the original PR.
(The pattern of using `data-attr-field` is already used in Discover so I
think it's a good opportunity to align)

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Nick Partridge <nicholas.partridge@elastic.co>
nickofthyme added a commit to kibanamachine/kibana that referenced this pull request Mar 21, 2025
@mbondyra @kibanamachine @nickofthyme
[Lens] fix drag and drop failing test (elastic#215439)
0ab07e3 
## Summary

Fixes elastic#213324

For some reason this PR elastic#213928
didn't catch that the changes make the test fail. This PR fixes it.
After this, we'll be able to backport the original PR.
(The pattern of using `data-attr-field` is already used in Discover so I
think it's a good opportunity to align)

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Nick Partridge <nicholas.partridge@elastic.co>
nickofthyme added a commit to kibanamachine/kibana that referenced this pull request Mar 21, 2025
@mbondyra @kibanamachine @nickofthyme
[Lens] fix drag and drop failing test (elastic#215439)
5b00f29 
## Summary

Fixes elastic#213324

For some reason this PR elastic#213928
didn't catch that the changes make the test fail. This PR fixes it.
After this, we'll be able to backport the original PR.
(The pattern of using `data-attr-field` is already used in Discover so I
think it's a good opportunity to align)

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Nick Partridge <nicholas.partridge@elastic.co>
nickofthyme added a commit to kibanamachine/kibana that referenced this pull request Mar 21, 2025
@mbondyra @kibanamachine @nickofthyme
[Lens] fix drag and drop failing test (elastic#215439)
62ed50f 
## Summary

Fixes elastic#213324

For some reason this PR elastic#213928
didn't catch that the changes make the test fail. This PR fixes it.
After this, we'll be able to backport the original PR.
(The pattern of using `data-attr-field` is already used in Discover so I
think it's a good opportunity to align)

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Nick Partridge <nicholas.partridge@elastic.co>
nickofthyme added a commit to kibanamachine/kibana that referenced this pull request Mar 21, 2025
@mbondyra @kibanamachine @nickofthyme
[Lens] fix drag and drop failing test (elastic#215439)
75e3de5 
## Summary

Fixes elastic#213324

For some reason this PR elastic#213928
didn't catch that the changes make the test fail. This PR fixes it.
After this, we'll be able to backport the original PR.
(The pattern of using `data-attr-field` is already used in Discover so I
think it's a good opportunity to align)

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Nick Partridge <nicholas.partridge@elastic.co>
kibanamachine added a commit that referenced this pull request Mar 22, 2025
@kibanamachine @mbondyra @nickofthyme
[9.0] [Lens] fix drag and drop ghost after Chrome update to 134 (#213928
6d39f4e 
) (#214127)

# Backport

This will backport the following commits from `main` to `9.0`:
 - #213928
 - #215439

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Marta
Bondyra","email":"4283304+mbondyra@users.noreply.github.com"},"sourceCommit":{"committedDate":"2025-03-12T11:30:51Z","message":"[Lens]
fix drag and drop ghost after Chrome update to 134 (#213928)\n\n##
Summary\nFixes https://github.com/elastic/kibana/issues/213708\n\nFixes
the ghost display. As @nickofthyme pointed
out\n[here](https://github.com/elastic/kibana/issues/213708#issuecomment-2712076212),\nthe
reason was using inset-inline-start: -10000px for the keyboard\nhandler
that is one of the children of the draggable component. The\nquick fix
is to just move it outside of the html element that is\ndragged.
@markov00 please assesswhere it should be merged
🙏🏼\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"84ae9c98c208957b3efc02c6b00bed8d567d4209","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Feature:Discover","release_note:fix","Team:Visualizations","Feature:Lens","backport:prev-minor","backport:prev-major","Feature:UnifiedFieldList","v9.1.0"],"title":"[Lens]
fix drag and drop ghost after Chrome update to
134","number":213928,"url":"https://github.com/elastic/kibana/pull/213928","mergeCommit":{"message":"[Lens]
fix drag and drop ghost after Chrome update to 134 (#213928)\n\n##
Summary\nFixes https://github.com/elastic/kibana/issues/213708\n\nFixes
the ghost display. As @nickofthyme pointed
out\n[here](https://github.com/elastic/kibana/issues/213708#issuecomment-2712076212),\nthe
reason was using inset-inline-start: -10000px for the keyboard\nhandler
that is one of the children of the draggable component. The\nquick fix
is to just move it outside of the html element that is\ndragged.
@markov00 please assesswhere it should be merged
🙏🏼\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"84ae9c98c208957b3efc02c6b00bed8d567d4209"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/213928","number":213928,"mergeCommit":{"message":"[Lens]
fix drag and drop ghost after Chrome update to 134 (#213928)\n\n##
Summary\nFixes https://github.com/elastic/kibana/issues/213708\n\nFixes
the ghost display. As @nickofthyme pointed
out\n[here](https://github.com/elastic/kibana/issues/213708#issuecomment-2712076212),\nthe
reason was using inset-inline-start: -10000px for the keyboard\nhandler
that is one of the children of the draggable component. The\nquick fix
is to just move it outside of the html element that is\ndragged.
@markov00 please assesswhere it should be merged
🙏🏼\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"84ae9c98c208957b3efc02c6b00bed8d567d4209"}}]}]
BACKPORT-->

---------

Co-authored-by: Marta Bondyra <4283304+mbondyra@users.noreply.github.com>
Co-authored-by: Nick Partridge <nicholas.partridge@elastic.co>
kibanamachine added a commit that referenced this pull request Mar 22, 2025
@kibanamachine @mbondyra @nickofthyme
[8.16] [Lens] fix drag and drop ghost after Chrome update to 134 (#21…
cbe918e 
…3928) (#214123)

# Backport

This will backport the following commits from `main` to `8.16`:
 - #213928
 - #215439

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Marta
Bondyra","email":"4283304+mbondyra@users.noreply.github.com"},"sourceCommit":{"committedDate":"2025-03-12T11:30:51Z","message":"[Lens]
fix drag and drop ghost after Chrome update to 134 (#213928)\n\n##
Summary\nFixes https://github.com/elastic/kibana/issues/213708\n\nFixes
the ghost display. As @nickofthyme pointed
out\n[here](https://github.com/elastic/kibana/issues/213708#issuecomment-2712076212),\nthe
reason was using inset-inline-start: -10000px for the keyboard\nhandler
that is one of the children of the draggable component. The\nquick fix
is to just move it outside of the html element that is\ndragged.
@markov00 please assesswhere it should be merged
🙏🏼\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"84ae9c98c208957b3efc02c6b00bed8d567d4209","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Feature:Discover","release_note:fix","Team:Visualizations","Feature:Lens","backport:prev-minor","backport:prev-major","Feature:UnifiedFieldList","v9.1.0"],"title":"[Lens]
fix drag and drop ghost after Chrome update to
134","number":213928,"url":"https://github.com/elastic/kibana/pull/213928","mergeCommit":{"message":"[Lens]
fix drag and drop ghost after Chrome update to 134 (#213928)\n\n##
Summary\nFixes https://github.com/elastic/kibana/issues/213708\n\nFixes
the ghost display. As @nickofthyme pointed
out\n[here](https://github.com/elastic/kibana/issues/213708#issuecomment-2712076212),\nthe
reason was using inset-inline-start: -10000px for the keyboard\nhandler
that is one of the children of the draggable component. The\nquick fix
is to just move it outside of the html element that is\ndragged.
@markov00 please assesswhere it should be merged
🙏🏼\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"84ae9c98c208957b3efc02c6b00bed8d567d4209"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/213928","number":213928,"mergeCommit":{"message":"[Lens]
fix drag and drop ghost after Chrome update to 134 (#213928)\n\n##
Summary\nFixes https://github.com/elastic/kibana/issues/213708\n\nFixes
the ghost display. As @nickofthyme pointed
out\n[here](https://github.com/elastic/kibana/issues/213708#issuecomment-2712076212),\nthe
reason was using inset-inline-start: -10000px for the keyboard\nhandler
that is one of the children of the draggable component. The\nquick fix
is to just move it outside of the html element that is\ndragged.
@markov00 please assesswhere it should be merged
🙏🏼\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"84ae9c98c208957b3efc02c6b00bed8d567d4209"}}]}]
BACKPORT-->

---------

Co-authored-by: Marta Bondyra <4283304+mbondyra@users.noreply.github.com>
Co-authored-by: Nick Partridge <nicholas.partridge@elastic.co>
kibanamachine added a commit that referenced this pull request Mar 22, 2025
@kibanamachine @mbondyra @nickofthyme
[8.17] [Lens] fix drag and drop ghost after Chrome update to 134 (#21…
530db06 
…3928) (#214124)

# Backport

This will backport the following commits from `main` to `8.17`:
 - #213928
 - #215439

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Marta
Bondyra","email":"4283304+mbondyra@users.noreply.github.com"},"sourceCommit":{"committedDate":"2025-03-12T11:30:51Z","message":"[Lens]
fix drag and drop ghost after Chrome update to 134 (#213928)\n\n##
Summary\nFixes https://github.com/elastic/kibana/issues/213708\n\nFixes
the ghost display. As @nickofthyme pointed
out\n[here](https://github.com/elastic/kibana/issues/213708#issuecomment-2712076212),\nthe
reason was using inset-inline-start: -10000px for the keyboard\nhandler
that is one of the children of the draggable component. The\nquick fix
is to just move it outside of the html element that is\ndragged.
@markov00 please assesswhere it should be merged
🙏🏼\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"84ae9c98c208957b3efc02c6b00bed8d567d4209","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Feature:Discover","release_note:fix","Team:Visualizations","Feature:Lens","backport:prev-minor","backport:prev-major","Feature:UnifiedFieldList","v9.1.0"],"title":"[Lens]
fix drag and drop ghost after Chrome update to
134","number":213928,"url":"https://github.com/elastic/kibana/pull/213928","mergeCommit":{"message":"[Lens]
fix drag and drop ghost after Chrome update to 134 (#213928)\n\n##
Summary\nFixes https://github.com/elastic/kibana/issues/213708\n\nFixes
the ghost display. As @nickofthyme pointed
out\n[here](https://github.com/elastic/kibana/issues/213708#issuecomment-2712076212),\nthe
reason was using inset-inline-start: -10000px for the keyboard\nhandler
that is one of the children of the draggable component. The\nquick fix
is to just move it outside of the html element that is\ndragged.
@markov00 please assesswhere it should be merged
🙏🏼\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"84ae9c98c208957b3efc02c6b00bed8d567d4209"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/213928","number":213928,"mergeCommit":{"message":"[Lens]
fix drag and drop ghost after Chrome update to 134 (#213928)\n\n##
Summary\nFixes https://github.com/elastic/kibana/issues/213708\n\nFixes
the ghost display. As @nickofthyme pointed
out\n[here](https://github.com/elastic/kibana/issues/213708#issuecomment-2712076212),\nthe
reason was using inset-inline-start: -10000px for the keyboard\nhandler
that is one of the children of the draggable component. The\nquick fix
is to just move it outside of the html element that is\ndragged.
@markov00 please assesswhere it should be merged
🙏🏼\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"84ae9c98c208957b3efc02c6b00bed8d567d4209"}}]}]
BACKPORT-->

---------

Co-authored-by: Marta Bondyra <4283304+mbondyra@users.noreply.github.com>
Co-authored-by: Nick Partridge <nicholas.partridge@elastic.co>
kibanamachine added a commit that referenced this pull request Mar 22, 2025
@kibanamachine @mbondyra @nickofthyme
[8.x] [Lens] fix drag and drop ghost after Chrome update to 134 (#213928
9c2c251 
) (#214126)

# Backport

This will backport the following commits from `main` to `8.x`:
 - #213928
 - #215439

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Marta
Bondyra","email":"4283304+mbondyra@users.noreply.github.com"},"sourceCommit":{"committedDate":"2025-03-12T11:30:51Z","message":"[Lens]
fix drag and drop ghost after Chrome update to 134 (#213928)\n\n##
Summary\nFixes https://github.com/elastic/kibana/issues/213708\n\nFixes
the ghost display. As @nickofthyme pointed
out\n[here](https://github.com/elastic/kibana/issues/213708#issuecomment-2712076212),\nthe
reason was using inset-inline-start: -10000px for the keyboard\nhandler
that is one of the children of the draggable component. The\nquick fix
is to just move it outside of the html element that is\ndragged.
@markov00 please assesswhere it should be merged
🙏🏼\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"84ae9c98c208957b3efc02c6b00bed8d567d4209","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Feature:Discover","release_note:fix","Team:Visualizations","Feature:Lens","backport:prev-minor","backport:prev-major","Feature:UnifiedFieldList","v9.1.0"],"title":"[Lens]
fix drag and drop ghost after Chrome update to
134","number":213928,"url":"https://github.com/elastic/kibana/pull/213928","mergeCommit":{"message":"[Lens]
fix drag and drop ghost after Chrome update to 134 (#213928)\n\n##
Summary\nFixes https://github.com/elastic/kibana/issues/213708\n\nFixes
the ghost display. As @nickofthyme pointed
out\n[here](https://github.com/elastic/kibana/issues/213708#issuecomment-2712076212),\nthe
reason was using inset-inline-start: -10000px for the keyboard\nhandler
that is one of the children of the draggable component. The\nquick fix
is to just move it outside of the html element that is\ndragged.
@markov00 please assesswhere it should be merged
🙏🏼\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"84ae9c98c208957b3efc02c6b00bed8d567d4209"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/213928","number":213928,"mergeCommit":{"message":"[Lens]
fix drag and drop ghost after Chrome update to 134 (#213928)\n\n##
Summary\nFixes https://github.com/elastic/kibana/issues/213708\n\nFixes
the ghost display. As @nickofthyme pointed
out\n[here](https://github.com/elastic/kibana/issues/213708#issuecomment-2712076212),\nthe
reason was using inset-inline-start: -10000px for the keyboard\nhandler
that is one of the children of the draggable component. The\nquick fix
is to just move it outside of the html element that is\ndragged.
@markov00 please assesswhere it should be merged
🙏🏼\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"84ae9c98c208957b3efc02c6b00bed8d567d4209"}}]}]
BACKPORT-->

---------

Co-authored-by: Marta Bondyra <4283304+mbondyra@users.noreply.github.com>
Co-authored-by: Nick Partridge <nicholas.partridge@elastic.co>
kibanamachine added a commit that referenced this pull request Mar 22, 2025
@kibanamachine @mbondyra @nickofthyme
[8.18] [Lens] fix drag and drop ghost after Chrome update to 134 (#21…
4c972fd 
…3928) (#214125)

# Backport

This will backport the following commits from `main` to `8.18`:
 - #213928
 - #215439

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Marta
Bondyra","email":"4283304+mbondyra@users.noreply.github.com"},"sourceCommit":{"committedDate":"2025-03-12T11:30:51Z","message":"[Lens]
fix drag and drop ghost after Chrome update to 134 (#213928)\n\n##
Summary\nFixes https://github.com/elastic/kibana/issues/213708\n\nFixes
the ghost display. As @nickofthyme pointed
out\n[here](https://github.com/elastic/kibana/issues/213708#issuecomment-2712076212),\nthe
reason was using inset-inline-start: -10000px for the keyboard\nhandler
that is one of the children of the draggable component. The\nquick fix
is to just move it outside of the html element that is\ndragged.
@markov00 please assesswhere it should be merged
🙏🏼\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"84ae9c98c208957b3efc02c6b00bed8d567d4209","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Feature:Discover","release_note:fix","Team:Visualizations","Feature:Lens","backport:prev-minor","backport:prev-major","Feature:UnifiedFieldList","v9.1.0"],"title":"[Lens]
fix drag and drop ghost after Chrome update to
134","number":213928,"url":"https://github.com/elastic/kibana/pull/213928","mergeCommit":{"message":"[Lens]
fix drag and drop ghost after Chrome update to 134 (#213928)\n\n##
Summary\nFixes https://github.com/elastic/kibana/issues/213708\n\nFixes
the ghost display. As @nickofthyme pointed
out\n[here](https://github.com/elastic/kibana/issues/213708#issuecomment-2712076212),\nthe
reason was using inset-inline-start: -10000px for the keyboard\nhandler
that is one of the children of the draggable component. The\nquick fix
is to just move it outside of the html element that is\ndragged.
@markov00 please assesswhere it should be merged
🙏🏼\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"84ae9c98c208957b3efc02c6b00bed8d567d4209"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/213928","number":213928,"mergeCommit":{"message":"[Lens]
fix drag and drop ghost after Chrome update to 134 (#213928)\n\n##
Summary\nFixes https://github.com/elastic/kibana/issues/213708\n\nFixes
the ghost display. As @nickofthyme pointed
out\n[here](https://github.com/elastic/kibana/issues/213708#issuecomment-2712076212),\nthe
reason was using inset-inline-start: -10000px for the keyboard\nhandler
that is one of the children of the draggable component. The\nquick fix
is to just move it outside of the html element that is\ndragged.
@markov00 please assesswhere it should be merged
🙏🏼\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"84ae9c98c208957b3efc02c6b00bed8d567d4209"}}]}]
BACKPORT-->

---------

Co-authored-by: Marta Bondyra <4283304+mbondyra@users.noreply.github.com>
Co-authored-by: Nick Partridge <nicholas.partridge@elastic.co>
@kibanamachine kibanamachine added v8.18.0 and removed backport missing Added to PRs automatically when the are determined to be missing a backport. labels Mar 22, 2025
@mbondyra mbondyra deleted the fix_dnd_ghost branch March 22, 2025 09:51
CAWilson94 pushed a commit to CAWilson94/kibana that referenced this pull request Mar 22, 2025
@mbondyra @kibanamachine @CAWilson94
[Lens] fix drag and drop ghost after Chrome update to 134 (elastic#21…
a343f0b 
…3928)

## Summary
Fixes elastic#213708

Fixes the ghost display. As @nickofthyme pointed out
[here](elastic#213708 (comment)),
the reason was using inset-inline-start: -10000px for the keyboard
handler that is one of the children of the draggable component. The
quick fix is to just move it outside of the html element that is
dragged. @markov00 please assesswhere it should be merged 🙏🏼

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
JoseLuisGJ pushed a commit to JoseLuisGJ/kibana that referenced this pull request Mar 24, 2025
@mbondyra @kibanamachine
@nickofthyme @JoseLuisGJ
[Lens] fix drag and drop failing test (elastic#215439)
f9fd0b8 
## Summary

Fixes elastic#213324

For some reason this PR elastic#213928
didn't catch that the changes make the test fail. This PR fixes it.
After this, we'll be able to backport the original PR.
(The pattern of using `data-attr-field` is already used in Discover so I
think it's a good opportunity to align)

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Nick Partridge <nicholas.partridge@elastic.co>
@mistic mistic added v8.17.5 and removed v8.17.4 labels Mar 25, 2025
@mistic
Copy link
Contributor

mistic commented Mar 25, 2025 •
edited
Loading

This PR didn't land on time for the latest 8.17.4 and 8.16.6 BC. Updating the labels.

@mistic mistic added v8.16.7 and removed v8.16.6 labels Mar 25, 2025
cqliu1 pushed a commit to cqliu1/kibana that referenced this pull request Mar 31, 2025
@mbondyra @kibanamachine
@nickofthyme @cqliu1
[Lens] fix drag and drop failing test (elastic#215439)
4bc1fe5 
## Summary

Fixes elastic#213324

For some reason this PR elastic#213928
didn't catch that the changes make the test fail. This PR fixes it.
After this, we'll be able to backport the original PR.
(The pattern of using `data-attr-field` is already used in Discover so I
think it's a good opportunity to align)

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Nick Partridge <nicholas.partridge@elastic.co>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@markov00 markov00 markov00 approved these changes

@nickofthyme nickofthyme nickofthyme approved these changes

@akowalska622 akowalska622 akowalska622 approved these changes

Assignees

No one assigned

Labels

Feature:Discover Discover Application Feature:Lens Feature:UnifiedFieldList The unified field list component used by Lens & Discover release_note:fix Team:Visualizations Team label for Lens, elastic-charts, Graph, legacy editors (TSVB, Visualize, Timelion) t// v8.16.7 v8.17.5 v8.18.0 v8.19.0 v9.0.0 v9.1.0

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

[DragAndDrop] Dragging doesn't show anymore the dragged element

8 participants

@mbondyra @elasticmachine @kibanamachine @jughosta @mistic @markov00 @nickofthyme @akowalska622