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

[Security Solution] Scroll bar is displaying on collapse the Treemap panel #136374

Closed
ghost opened this issue Jul 14, 2022 · 5 comments · Fixed by #136787
Closed

[Security Solution] Scroll bar is displaying on collapse the Treemap panel #136374

ghost opened this issue Jul 14, 2022 · 5 comments · Fixed by #136787
Assignees
@andrew-goldstein @michaelolo24
Labels
bug Fixes for quality problems that affect the customer experience fixed impact:low Addressing this issue will have a low level of impact on the quality/strength of our product. QA:Validated Issue has been validated by QA Team: SecuritySolution Security Solutions Team working on SIEM, Endpoint, Timeline, Resolver, etc. Team:Threat Hunting:Investigations Security Solution Investigations Team Team:Threat Hunting Security Solution Threat Hunting Team v8.4.0

Comments

@ghost
Copy link

ghost commented Jul 14, 2022

Describe the bug
Scroll bar is displaying on collapse the Treemap panel

Build info

VERSION : 8.4.0 SNAPSHOT
BUILD: 54479
COMMIT: 8a945789baa48244340cdff5fdf45fc9f67d3ad3

Preconditions

  1. Kibana should be running
  2. Alerts should be triggered

Steps to Reproduce

  1. Navigate to Alerts tab.
  2. Select the treemap from drop down
  3. Collapse the Treemap panel
  4. Observe that scroll bar is displaying on collapse the Treemap panel

Actual Result
Scroll bar is displaying on collapse the Treemap panel

Expected Result
Scroll bar should not be displayed on collapse the Treemap panel

What's Working
This issue is not occurring for Table and trend panel

Screen-shot
image
@ghost ghost added bug Fixes for quality problems that affect the customer experience triage_needed impact:medium Addressing this issue will have a medium level of impact on the quality/strength of our product. Team: SecuritySolution Security Solutions Team working on SIEM, Endpoint, Timeline, Resolver, etc. v8.4.0 labels Jul 14, 2022
@elasticmachine
Copy link
Contributor

Pinging @elastic/security-solution (Team: SecuritySolution)

@ghost ghost assigned ghost and unassigned ghost Jul 14, 2022
@ghost ghost added impact:low Addressing this issue will have a low level of impact on the quality/strength of our product. and removed impact:medium Addressing this issue will have a medium level of impact on the quality/strength of our product. labels Jul 14, 2022
@ghost ghost assigned MadameSheema Jul 14, 2022
@MadameSheema MadameSheema added Team:Threat Hunting:Investigations Security Solution Investigations Team Team:Threat Hunting Security Solution Threat Hunting Team labels Jul 14, 2022
@elasticmachine
Copy link
Contributor

Pinging @elastic/security-threat-hunting (Team:Threat Hunting)

andrew-goldstein added a commit to andrew-goldstein/kibana that referenced this issue Jul 21, 2022
@andrew-goldstein
## [Security Solution] Fixes scroll bar displayed on collapsed Treema…
2d8d78d 
…p panel

This PR fixes [issue 136374](elastic#136374), where sometimes, a scroll bar is displayed when the Treemap panel is collapsed, per the following screenshot:

![screenshot from issue 136374](https://user-images.githubusercontent.com/61860752/178940030-62391fde-0170-4472-ad5d-d9dd102499ea.png)

_Above: Image from the repro steps of <https://github.com/elastic/kibana/issues/136374>_

### Notes

- ⚠️ The issue, (even before the fix), may not appear on some platforms. For example, the following screenshot was taken with Chrome `103.0.5060.134` on macOS _before_ the fix:

![mac_chrome_treemap_collapsed_before](https://user-images.githubusercontent.com/4459398/180098942-a1aac4b0-8568-4afa-b97c-c7d00e471e54.png)

_Above: Even BEFORE the fix, the issue may not appear in Chrome on macOS_

- This PR was desk tested in light and dark on Windows and macOS (see screenshots below) using the following browsers:
  - Chrome `103.0.5060.134`
  - Firefox `102.0.1`
  - Safari `15.5`

- The Treemap legend scroll bar was updated in this PR to use the `eui-yScroll` style, per the before and after screenshots below:

#### BEFORE: The treemap legend scroll bar (Windows, light theme)

![windows_chrome_treemap_expanded_before](https://user-images.githubusercontent.com/4459398/180099530-ba462da6-7687-44ea-ad40-4d67abbbb895.png)

_Above: BEFORE: The treemap legend scroll bar (Windows, light theme)_

#### AFTER: The treemap legend scroll bar (Windows, light theme)

![windows_chrome_treemap_expanded_after_light_theme](https://user-images.githubusercontent.com/4459398/180099755-5e5f5536-2bf4-4edc-b53a-12105ecb4f79.png)

_Above: AFTER: The treemap legend scroll bar (Windows, light theme)_

#### AFTER: The treemap legend scroll bar (Windows, dark theme)

![windows_chrome_treemap_expanded_after_dark_theme](https://user-images.githubusercontent.com/4459398/180099883-8d7a25ce-4b0e-46a8-b7ad-2cc0c9356b9a.png)

_Above: AFTER: The treemap legend scroll bar (Windows, dark theme)_

#### AFTER: The treemap legend scroll bar (macOS, light theme)

![mac_chrome_treemap_expanded_after_light_theme](https://user-images.githubusercontent.com/4459398/180100158-97b131b8-61a7-4390-93f7-cdc6d2ee782d.png)

_Above: AFTER: The treemap legend scroll bar (macOS, light theme)_

#### AFTER: The treemap legend scroll bar (macOS, dark theme)

![mac_chrome_treemap_expanded_after_dark_theme](https://user-images.githubusercontent.com/4459398/180101628-7d5333f2-e428-4a3e-b394-0d14accacdef.png)

_Above: AFTER: The treemap legend scroll bar (macOS, dark theme)_

### Desk Testing

The following BEFORE / AFTER screenshots of the collapsed Treemap panel were taken using Chrome `103.0.5060.134` on Windows and macOS:

#### BEFORE: Collapsed panel (Windows, light theme)

![windows_chrome_treemap_collapsed_before](https://user-images.githubusercontent.com/4459398/180100527-4239e7cd-7e45-4e7f-8342-07bc206da3a4.png)

_Above: BEFORE: Collapsed panel (Windows, light theme)_

#### AFTER: Collapsed panel (Windows, light theme)

![windows_chrome_treemap_collapsed_after_light_theme](https://user-images.githubusercontent.com/4459398/180100619-0ffd9d86-563e-4e4b-984d-c03f84a393b6.png)

_Above: AFTER: Collapsed panel (Windows, light theme)_

#### AFTER: Collapsed panel (Windows, dark theme)

![windows_chrome_treemap_collapsed_after_dark_theme](https://user-images.githubusercontent.com/4459398/180100789-b5bed14f-4d00-4645-9078-ccba680454b8.png)

_Above: AFTER: Collapsed panel (Windows, dark theme)_

#### AFTER: Collapsed panel (macOS, light theme)

![mac_chrome_treemap_collapsed_after_light_theme](https://user-images.githubusercontent.com/4459398/180100879-0881e6f3-83ee-4fd4-827d-73cf2c0b6b58.png)

_Above: AFTER: Collapsed panel (macOS, light theme)_

#### AFTER: Collapsed panel (macOS, dark theme)

![mac_chrome_treemap_collapsed_after_dark_theme](https://user-images.githubusercontent.com/4459398/180101153-50775efd-831b-47f7-937b-4f5b25b13ff6.png)

_Above: AFTER: Collapsed panel (macOS, dark theme)_
@andrew-goldstein andrew-goldstein mentioned this issue Jul 21, 2022
Merged
andrew-goldstein added a commit that referenced this issue Jul 21, 2022
@andrew-goldstein
[Security Solution] Fixes scroll bar displayed on collapsed Treemap p…
a9780d2 
…anel (#136787)

## [Security Solution] Fixes scroll bar displayed on collapsed Treemap panel

This PR fixes [issue 136374](#136374), where sometimes, a scroll bar is displayed when the Treemap panel is collapsed, per the following screenshot:

![screenshot from issue 136374](https://user-images.githubusercontent.com/61860752/178940030-62391fde-0170-4472-ad5d-d9dd102499ea.png)

_Above: Image from the repro steps of <https://github.com/elastic/kibana/issues/136374>_

### Notes

- ⚠️ The issue, (even before the fix), may not appear on some platforms. For example, the following screenshot was taken with Chrome `103.0.5060.134` on macOS _before_ the fix:

![mac_chrome_treemap_collapsed_before](https://user-images.githubusercontent.com/4459398/180098942-a1aac4b0-8568-4afa-b97c-c7d00e471e54.png)

_Above: Even BEFORE the fix, the issue may not appear in Chrome on macOS_

- This PR was desk tested in light and dark on Windows and macOS (see screenshots below) using the following browsers:
  - Chrome `103.0.5060.134`
  - Firefox `102.0.1`
  - Safari `15.5`

- The Treemap legend scroll bar was updated in this PR to use the `eui-yScroll` style, per the before and after screenshots below:

#### BEFORE: The treemap legend scroll bar (Windows, light theme)

![windows_chrome_treemap_expanded_before](https://user-images.githubusercontent.com/4459398/180099530-ba462da6-7687-44ea-ad40-4d67abbbb895.png)

_Above: BEFORE: The treemap legend scroll bar (Windows, light theme)_

#### AFTER: The treemap legend scroll bar (Windows, light theme)

![windows_chrome_treemap_expanded_after_light_theme](https://user-images.githubusercontent.com/4459398/180099755-5e5f5536-2bf4-4edc-b53a-12105ecb4f79.png)

_Above: AFTER: The treemap legend scroll bar (Windows, light theme)_

#### AFTER: The treemap legend scroll bar (Windows, dark theme)

![windows_chrome_treemap_expanded_after_dark_theme](https://user-images.githubusercontent.com/4459398/180099883-8d7a25ce-4b0e-46a8-b7ad-2cc0c9356b9a.png)

_Above: AFTER: The treemap legend scroll bar (Windows, dark theme)_

#### AFTER: The treemap legend scroll bar (macOS, light theme)

![mac_chrome_treemap_expanded_after_light_theme](https://user-images.githubusercontent.com/4459398/180100158-97b131b8-61a7-4390-93f7-cdc6d2ee782d.png)

_Above: AFTER: The treemap legend scroll bar (macOS, light theme)_

#### AFTER: The treemap legend scroll bar (macOS, dark theme)

![mac_chrome_treemap_expanded_after_dark_theme](https://user-images.githubusercontent.com/4459398/180101628-7d5333f2-e428-4a3e-b394-0d14accacdef.png)

_Above: AFTER: The treemap legend scroll bar (macOS, dark theme)_

### Desk Testing

The following BEFORE / AFTER screenshots of the collapsed Treemap panel were taken using Chrome `103.0.5060.134` on Windows and macOS:

#### BEFORE: Collapsed panel (Windows, light theme)

![windows_chrome_treemap_collapsed_before](https://user-images.githubusercontent.com/4459398/180100527-4239e7cd-7e45-4e7f-8342-07bc206da3a4.png)

_Above: BEFORE: Collapsed panel (Windows, light theme)_

#### AFTER: Collapsed panel (Windows, light theme)

![windows_chrome_treemap_collapsed_after_light_theme](https://user-images.githubusercontent.com/4459398/180100619-0ffd9d86-563e-4e4b-984d-c03f84a393b6.png)

_Above: AFTER: Collapsed panel (Windows, light theme)_

#### AFTER: Collapsed panel (Windows, dark theme)

![windows_chrome_treemap_collapsed_after_dark_theme](https://user-images.githubusercontent.com/4459398/180100789-b5bed14f-4d00-4645-9078-ccba680454b8.png)

_Above: AFTER: Collapsed panel (Windows, dark theme)_

#### AFTER: Collapsed panel (macOS, light theme)

![mac_chrome_treemap_collapsed_after_light_theme](https://user-images.githubusercontent.com/4459398/180100879-0881e6f3-83ee-4fd4-827d-73cf2c0b6b58.png)

_Above: AFTER: Collapsed panel (macOS, light theme)_

#### AFTER: Collapsed panel (macOS, dark theme)

![mac_chrome_treemap_collapsed_after_dark_theme](https://user-images.githubusercontent.com/4459398/180101153-50775efd-831b-47f7-937b-4f5b25b13ff6.png)

_Above: AFTER: Collapsed panel (macOS, dark theme)_
@andrew-goldstein
Copy link
Contributor

@deepikakeshav-qasource, this issue auto-closed when the fix in #136787 was merged.

Would you be willing to verify the fix?

@ghost
Copy link
Author

ghost commented Jul 25, 2022

Hi @andrew-goldstein ,

Yes, We will test this fix on latest 8.4.0 snapshot

Thanks!!

@ghost
Copy link
Author

ghost commented Jul 29, 2022

Hi @andrew-goldstein ,

We have validated this issue on 8.4.0 BC1 build and observed that issue is Fixed 🟢

Please find the below testing Details:

Build info

VERSION : 8.4.0 BC1
Build: 54999
COMMIT: 58f7eaf0f8dc3c43cbfcd393e587f155e97b3d0d

Screenshot/Screencast
image

Hence, We are marking as QA Validated!!

Thanks!!

@ghost ghost added the QA:Validated Issue has been validated by QA label Jul 29, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@andrew-goldstein andrew-goldstein

@michaelolo24 michaelolo24

Labels
bug Fixes for quality problems that affect the customer experience fixed impact:low Addressing this issue will have a low level of impact on the quality/strength of our product. QA:Validated Issue has been validated by QA Team: SecuritySolution Security Solutions Team working on SIEM, Endpoint, Timeline, Resolver, etc. Team:Threat Hunting:Investigations Security Solution Investigations Team Team:Threat Hunting Security Solution Threat Hunting Team v8.4.0
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

[Security Solution] Fixes scroll bar displayed on collapsed Treemap panel andrew-goldstein/kibana
4 participants
@andrew-goldstein @elasticmachine @michaelolo24 @MadameSheema