Skip to content

[BUG]: Some plots render incorrectly when using virtual-webgl in Chromium browsers #7764

@camdecoster

Description

@camdecoster

Description

Some plots are rendering incorrectly (missing or muted colors) when using virtual-webgl in Chromium based browsers. This was originally reported in plotly/Kaleido#375.

Screenshots/Video

Without virtual-webgl With virtual-webgl
Image Image

See plotly/Kaleido#375 for more examples.

Steps to reproduce

  • Start plotly.js devtools
  • Open the mock 'gl2d_parcoords_constraints'
  • Note that there are number of dark red lines on the left side of the plot
  • Edit devtools/test_dashboard/index.html to include the following <script> tag in the body
    <script src="../../node_modules/virtual-webgl/src/virtual-webgl.js"></script>
  • Reload the mock
  • Note that a few of the dark red lines are now missing

Notes

  • This bug was discovered when development of Kaleido v1 started
  • The previous version of Kaleido (v0.2.1) used Chromium v88. Kaleido v1 uses the installed Chromium version (usually a pretty recent one).
  • At some point between the release of Chromium v88 and Chrome v112 (the oldest Chrome for Testing available here), the bug was introduced
  • It's unclear if it's a bug in Chromium, a bug in virtual-webgl, or a bug in plotly.js
  • Firefox doesn't have the issue, though colors do appear to render a differently for some plots when using/not using virtual-webgl
  • Chromium v147 shows the following console warnings when using virtual-webgl:
    virtual-webgl.js:389 WebGLRenderingContext.canvas is not supported
    (anonymous) @ virtual-webgl.js:389
    (anonymous) @ virtual-webgl.js:1008
    virtual-webgl.js:389 WebGLRenderingContext.drawingBufferColorSpace is not supported
    (anonymous) @ virtual-webgl.js:389
    (anonymous) @ virtual-webgl.js:1008
    virtual-webgl.js:389 WebGLRenderingContext.unpackColorSpace is not supported
    (anonymous) @ virtual-webgl.js:389
    (anonymous) @ virtual-webgl.js:1008
    virtual-webgl.js:389 WebGLRenderingContext.drawingBufferFormat is not supported
    (anonymous) @ virtual-webgl.js:389
    (anonymous) @ virtual-webgl.js:1008
    
  • Firefox v145 shows the following console warnings when using virtual-webgl:
    WebGLRenderingContext.canvas is not supported <anonymous code>:formatted:8942:27
    WebGLRenderingContext.drawingBufferColorSpace is not supported <anonymous code>:formatted:8942:27
    WebGLRenderingContext.unpackColorSpace is not supported <anonymous code>:formatted:8942:27
    
  • virtual-webgl support was added in plotly.js in Add option to use virtual-webgl for handling multiple WebGL contexts  #6784

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugsomething broken

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions