Tree viewer visual glitches in Chrome

[maxpatiiuk]

Can be replicated in the Herb RGBE database in Chrome on mac. Does not happen on Firefox. Is even worse when you scroll / move the mouse or zoom

@grantfitzsimmons might feel in more details

[grantfitzsimmons]

https://user-images.githubusercontent.com/37256050/211647853-ae9e0cc3-9eb4-42c5-881b-79e295f20875.mp4

No words– using Chrome Version 108.0.5359.124 (Official Build) (arm64), macOS Ventura 13.1 (22C65)

[maxpatiiuk]

See also https://github.com/specify/specify7/issues/2689#issue-1503071493

[maxpatiiuk]

From @grantfitzsimmons:

Screen Recording 2022-08-19 at 6.21.56 PM.webm

Using a trackpad in Google Chrome, I cannot zoom in to read an item in the taxon tree.

db: newmexico-july22 user: zrogers browser: Google Chrome OS: macOS Monterey

[maxpatiiuk]

From @grantfitzsimmons:

https://user-images.githubusercontent.com/37256050/179652266-f370e7dc-5ffe-4f2a-bedf-70141558143c.mov

version: 7.7 dark mode is enabled Google Chrome

[CarolineDenis]

A) Wait for chrome to fix the bug B) Break down all components and disable one at a time to find which one is causing the issue

[grantfitzsimmons]

https://user-images.githubusercontent.com/37256050/234293510-cd765f2e-1694-435e-9a06-c234d26765ed.mp4

It just seems like we should break down all components and disable them to find out what the cause is.

[maxpatiiuk]

From @bronwyncombs:

Describe the bug A clear and concise description of what the bug is.

Scrolling vertically on tree page causes intense screen glitch/flash.
This was not re-creatable on my MacBook using Chrome, though.

To Reproduce Steps to reproduce the behavior:

1. Go to 'Trees'
2. Scroll down
3. See error

Expected behavior A clear and concise description of what you expected to happen.

Screenshots If applicable, add screenshots to help explain your problem.

https://github.com/specify/specify7/assets/135047322/6d97cdbc-c19f-4f89-9ee5-16f522c7870e

Desktop:

• OS: Windows 10
• Browser: Edge
• Specify 7 Version: 7.8.13-prerelease

Database Name: coloradopaleo

Reported By Name of your institution

Additional context Database name or any other context about the problem here.

[maxpatiiuk]

Interesting that this bug affects both Chrome and Edge - of course, they share a lot of code now, but that only means we need to fix this bug more urgently

[grantfitzsimmons]

We need to solve this urgently

[grantfitzsimmons]

Recreated today on herb_rbge

[bronwyncombs]

From Roybn @ RBGE:

Elspeth has been experiencing an issue with scrolling in the taxon tree. She has recorded a video in powerpoint and added notes to the slide. She is experiencing this issue on both her laptop and PC, and in both Firefox and Chrome. I have tried to recreate the issue, but haven’t been able to replicate the behaviour.

https://github.com/specify/specify7/assets/135047322/60606e1c-85cf-4cd8-a0b8-2166455e379b

Steps to recreate: 

1. Open Taxon tree
2. Search for Camellia
3. Can scroll up and down using mouse scroll
4. Can select another taxon
5. Scroll back up to Camellia and select
6. Try using the scroll bar to move down tree
7. Tree is ‘stuck’ and cannot use the scroll bar to move away to select another taxon.

Additional Context

I have also been unable to recreate this. Tested on herb-rbge on the test panel (v7.9.0 & v7.9.1), sandbox, and the cloud instance (both on v7.9.1-arm).

• Desktop: Chrome v118.0.5993.88, macOS Sonoma 14.0
• I have asked what OS the laptop and PC Elspeth is using is

[emenslin]

Fixed