Missing WebGL2 and Bitmap Renderer in Canvas and OffscreenCanvas definitions in latest build

[jeffreytgilbert]

TypeScript Version: 3.5.0

Search Terms: Canvas, OffscreenCanvas, WebGL2, Bitmap Renderer

Expected behavior:
https://developer.mozilla.org/en-US/docs/Web/API/OffscreenCanvas/getContext#Return_value

Actual behavior:
Missing WebGL2 and Bitmap Renderer in Canvas and OffscreenCanvas definitions in latest 3.5.0 build of typescript. EventTarget definitions incorrectly refer to HTMLCanvasElement, which OffscreenCanvas does not support. Instead, event listeners should use the EventTarget definition: https://dom.spec.whatwg.org/#interface-eventtarget

[jeffreytgilbert]

Also, texImageSource should be updated to include OffscreenCanvas

https://www.khronos.org/registry/webgl/specs/latest/1.0/#WEBGLRENDERINGCONTEXT

[jeffreytgilbert]

I was thinking this was initially thinking this was a bug ticket, but then i switched it to a feature request when i saw WebGL 2 support was not present, but now I'm thinking there might also be bugs. Full disclosure: I'm no typescript expert.

[jeffreytgilbert]

Just to be clear, what I keep running into right now is Typescript can't distinguish between the available signatures and pick the right one. That in turn results in errors in the IDE and through the build actions.

[jeffreytgilbert]

Under index.d.ts, there is only 1 signature, and it's for WebGL2. Why wouldn't that be alongside the webgl, 2d, and bitmaprenderer signatures in lib.dom.d.ts?

[jeffreytgilbert]

Hi @nkemnitz @karhu can you help me reason through this.

[nkemnitz]

Until it's fixed, you can try avoiding those ambiguity-related errors by being a lot more explicit:

function getWebGLRenderingContext(webGLVersion: number): WebGLRenderingContext {
  const WEBGL_ATTRIBUTES = {};

  const canvas = typeof OffscreenCanvas === 'function' ?
    new OffscreenCanvas(1, 1) :
    document.createElement('canvas');

  if (webGLVersion === 1) {
    if (canvas instanceof OffscreenCanvas) {
      return (canvas.getContext('webgl', WEBGL_ATTRIBUTES)) as WebGLRenderingContext;
    } else {
      return (canvas.getContext('webgl', WEBGL_ATTRIBUTES) ||
              canvas.getContext('webgl-experimental', WEBGL_ATTRIBUTES)) as WebGLRenderingContext;
    }
  } else {
    if (canvas instanceof OffscreenCanvas) {
      return (canvas.getContext('webgl2', WEBGL_ATTRIBUTES)) as WebGLRenderingContext;
    } else {
      return (canvas.getContext('webgl2', WEBGL_ATTRIBUTES)) as WebGLRenderingContext;
    }
  }
}

The OffscreenCanvas+WebGL2 path however will still fail. The WebGL2 typings from DefinitelyTyped that you use don't override OffscreenCanvas.getContext, yet.

And I guess for that you could just add

interface OffscreenCanvas extends EventTarget {
    getContext(contextId: "webgl2", options?: any): OffscreenRenderingContext | null;
}

[jakebailey]

This was all done in the linked microsoft/TypeScript-DOM-lib-generator#698 and pulled in here in #40500.