Cannot read properties of null (reading 'blendFuncSeparate')

[JiayiXuu]

High-level description

Chrome browser unable to render WebGL content unless the browser is restarted.

Steps to reproduce

The bug shows up somewhat randomly, mostly under one of the two circumstances:

• After vtk.js window is opened in browser for too long and try to refresh the page.
• After vtk.js window crashes due to excess memory/computation usage, (i.e. when inspector reports "Content lost" and the screen becomes blank), and try to refresh the page.

Detailed behavior

webpack compile and local server is successful, but same bug still shows up after recompiling webpack, seems like a browser issue.

Environment

• vtk.js: latest master
• OS: Windows 10
• Browser: <Chrome Version 101.0.4951.54

[floryst]

Do you know how long is "too long"? I haven't encountered it on a mac. I've heard of issues related to memory caps on windows, so that might be related to this. (If it is related, then there might be a slow memory leak.)

[JiayiXuu]

Do you know how long is "too long"? I haven't encountered it on a mac. I've heard of issues related to memory caps on windows, so that might be related to this. (If it is related, then there might be a slow memory leak.)

The behavior is sort of random, I can't exactly say how long. Often time it happens after a memory crash so it's more or less related. Also I dug up an older thread reporting the same issue #472.

[mpictor]

For anyone happening across this issue, check that webgl is working in your browser. It's not for me, and I think that's the cause. To test that, I went to https://webglsamples.org/aquarium/aquarium.html. I get an error there:

It does not appear your computer supports WebGL.
Click here for more information.

Status: Could not create a WebGL context, VENDOR = 0xffff, DEVICE = 0xffff, GL_VENDOR = Disabled, GL_RENDERER = Disabled, Sandboxed = yes, Optimus = no, AMD switchable = no, Reset notification strategy = 0x0000, ErrorMessage = BindToCurrentSequence failed: .

---

If it is useful to the vtk-js devs, here's how I encountered the blendFuncSeparate error:

This error happens very reliably for me when attempting to view antscan data in ParaView Glance (e.g. https://biomedisa.info/paraview/?name=[GAGA-04-06.stl]&url=[https://biomedisa.info/media/antscan/processed/GAGA_5x/GAGA-04-06.stl])

Go to url, wait for it to load. Nothing appears. Select a different representation type (e.g. Surface With Edges). At the top of the window,

🛑 4 ERROR(S)

will appear in red. Click it, and the popup shows your browser and the errors. For me:

ParaViewGlance: master
Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/145.0.0.0 Safari/537.36

Uncaught TypeError: Cannot read properties of null (reading 'blendFuncSeparate')
Uncaught TypeError: Cannot read properties of null (reading 'blendFuncSeparate')
Uncaught TypeError: Cannot read properties of null (reading 'blendFuncSeparate')
Uncaught TypeError: Cannot read properties of null (reading 'blendFuncSeparate')

But like I say at the top, I think the ultimate cause is webgl not working in my browser at the moment.