Add WebGL rendering tests & improve the WebGLHelper API

[jahow]

In this PR:

• Two new rendering tests: heatmap-layer and webgl-points
• Simpler shader compilation with the WebGLHelper class, the WebGLFragment and WebGLVertex classes were removed to simplify the system overall

Previously caches of shaders and programs were maintained using the objects uid which required these intermediary classes.

[jahow]

Damn, the webgl rendering on CircleCI is broken...

• Expected:
  

• Actual:
  

[jahow]

@tschaub @ahocevar the webgl rendering tests finally passed with the --ignore-gpu-blacklist option set for chrome. This PR is ready for merge, thanks for any review!

[tschaub]

Glad you were able to configure Puppeteer in a way that works in CI without complicating local dev. Thanks for the work on this @jahow.

[jahow]

I'm glad too ;) thanks

[ahocevar]

@jahow I think something is still wrong with the rendering tests. When I run them locally (with npm run test-rendering), I get

uncaught exception [Error: TypeError: Cannot read property 'indexOf' of undefined
    at includes (http://127.0.0.1:3000/cases/heatmap-layer/main.js:7003:14)
    at new WebGLHelper (http://127.0.0.1:3000/cases/heatmap-layer/main.js:51843:93)
    at new WebGLPointsLayerRenderer (http://127.0.0.1:3000/cases/heatmap-layer/main.js:41100:20)
    at Heatmap.createRenderer (http://127.0.0.1:3000/cases/heatmap-layer/main.js:29191:12)
    at Heatmap.getRenderer (http://127.0.0.1:3000/cases/heatmap-layer/main.js:29693:29)
    at Heatmap.render (http://127.0.0.1:3000/cases/heatmap-layer/main.js:29630:32)
    at CompositeMapRenderer.renderFrame (http://127.0.0.1:3000/cases/heatmap-layer/main.js:37942:29)
    at Map.renderFrame_ (http://127.0.0.1:3000/cases/heatmap-layer/main.js:4559:20)
    at Map.<anonymous> (http://127.0.0.1:3000/cases/heatmap-layer/main.js:3525:12)]
case ./cases/heatmap-layer/main.js (Heatmap layer renders properly using webgl)': mismatch 0.738

The rendered result is a blank image. Maybe this is related to #9014?

[jahow]

I think removing this parameter should solve the problem :

openlayers/src/ol/webgl.js

Line 327 in e9e804a

const gl = getContext(canvas, {failIfMajorPerformanceCaveat: true});

This "indexof" error appears when the context creation did not succeed, which sometimes happen depending on the environment.

[ahocevar]

@jahow Thanks for looking into this so quickly. Removing this parameter makes the exception go away indeed, but the test still fails with a mismatch of 0.148. Looking at the generated result, I see no heatmap at all. Just the base map. So I guess the remaining issue is still related to #9014.

[jahow]

Which I successfully reproduced on a MacOS environment so should be fixable.

Although I'm a bit worried about all the discrepancies between platforms with the webgl rendering. So far the GPU was blacklisted in the CI, I have major glitches on debian/firefox and the rendering fails altogether for a different reason on MacOS. I just hope it comes from my implementation... Did you have those sort of issues with the previous webgl renderers?

[ahocevar]

The previous webgl renderers were also unreliable, but at least I got something to see. Now, it just renders nothing.