Rendering issues with Chrome and Edge on Linux Mint

[higg]

I am consistently encountering a rendering issue when using speedscope with Chrome/Edge on Linux Mint. I do not encounter this problem with Firefox, or with any of these browsers on Windows or MacOS.

The issue seems to be related the browser's zoom level, as some zoom levels will render correctly, while others do not. For any particular instance of the app, the association of the issue and particular zoom levels is consistent. But across instances, the issue will be associated with a different set of zoom levels--even when working with the same data import.

For example, on one occasion, the zoom levels that showed the rendering issue are marked with *'s:

* 25
- 33
* 50
- 67
* 75
* 80
* 90
* 100
- 110
- 125
* 150
* 175
* 200
- 250
* 300
* 400
- 500

Reloading the application and importing the same data will produce a different set of *'s.

The three screenshots below show the following sequence:
- Incorrect rendering upon initial import (zoom 100%)
- Correct rendering after zoom change (zoom 110%)
- Different incorrect rendering after zoom change (zoom 100%)

The rendering problems correlate with an Uncaught RangeError: Maximum call stack size exceeded
being presented to the console. I have provided an example stack associated with below.

speedscope.tsx:5 speedscope v1.15.0
canvas-context.ts:34 WebGL initialized. renderer: ANGLE (Google, Vulkan 1.3.0 (SwiftShader Device (Subzero) (0x0000C0DE)), SwiftShader driver), vendor: Google Inc. (Google), version: WebGL 1.0 (OpenGL ES 2.0 Chromium)
graphics.ts:431 Uncaught RangeError: Maximum call stack size exceeded
    at get renderTargetWidthInPixels [as renderTargetWidthInPixels] (graphics.ts:431:9)
    at onBeforeFrame (canvas-context.ts:58:39)
    at graphics.ts:497:46
    at Set.forEach ()
    at a.resize (graphics.ts:497:32)
    at maybeResize (application.tsx:101:33)
    at onBeforeFrame (canvas-context.ts:63:7)
    at graphics.ts:497:46
    at Set.forEach ()
    at a.resize (graphics.ts:497:32)
get renderTargetWidthInPixels @ graphics.ts:431
onBeforeFrame @ canvas-context.ts:58
(anonymous) @ graphics.ts:497
resize @ graphics.ts:497
maybeResize @ application.tsx:101
onBeforeFrame @ canvas-context.ts:63
(anonymous) @ graphics.ts:497
resize @ graphics.ts:497
maybeResize @ application.tsx:101
onBeforeFrame @ canvas-context.ts:63
(anonymous) @ graphics.ts:497
resize @ graphics.ts:497
... etc ...
maybeResize @ application.tsx:101
onBeforeFrame @ canvas-context.ts:63
(anonymous) @ graphics.ts:497
resize @ graphics.ts:497
requestAnimationFrame (async)
requestFrame @ canvas-context.ts:53
onWindowResize @ application.tsx:111

I'm not sure if this problem is specific to speedscope or not, but if you think this is worth pursuing, please let me know if there's anything I can do to help. I can easily reproduce this.

Relevant versioning and specs:
Chrome: Version 111.0.5563.64 (Official Build) (64-bit)
Edge: Version 111.0.1661.43 (Official build) (64-bit)
System:
Kernel: 5.15.0-58-generic x86_64 bits: 64
Desktop: Cinnamon 5.6.7 Distro: Linux Mint 21.1 Vera

The hardware is an ASUS UX305CA laptop. Happy to provide more specific specs if requested.