How can I override a native JS function ( canvas's getContext() ) in pure JavaScript?

Question

I'd like to when canvas element calls 'getContext('webgl')', return 'null' value..

I tried to find WebGLRenderingContext prototype and update it, but i can't find it.

WebGLRenderingContext and WebGLRenderingContextBase has no prototype.getContext.

How can i change it return to 'null' value?

I've tested with below..

var test = document.createElement('canvas');`
test.getContext("webgl");`

This returns WebGLRenderingContext object...

please help me :)

Answer 1

Messing with native prototypes? Well, I assume you know what you are doing. If so and you really want to overwrite getContext prototype method, you can achieve this with simple decorator for HTMLCanvasElement.prototype.getContext:

HTMLCanvasElement.prototype.getContext = function (orig) {
  return function(type) {
    return type !== "webgl" ? orig.apply(this, arguments) : null
  }
}(HTMLCanvasElement.prototype.getContext)

So for any context like 2d, 3d, it will work normally, but for "webgl" it will give null. No idea, why you need this, though.

Answer 2

Not sure why you want to do this, but assuming you Know Exactly What You're Doing™ you can do it this way:

// store a reference to original vector
HTMLCanvasElement.prototype.__oldGetContext = HTMLCanvasElement.prototype.getContext;

// patch
HTMLCanvasElement.prototype.getContext = function(type, options) {
  if (type === "webgl" || type === "experimental-webgl") {
    console.log("WebGL suppressed!");                // remove this in production
    return null;
  }
  else return this.__oldGetContext(type, options);   // call original vector
}

// test (assuming browser do indeed support *webgl...)
var c = document.createElement("canvas");
var ctx = c.getContext("webgl") || c.getContext("experimental-webgl");

// works with 2D
var c2 = document.createElement("canvas");
var ctx2 = c2.getContext("2d");
console.log("2d?", !!ctx2);

You will need to do something similar for probablySupportsContext() when it lands.

The key for this to work is to patch before any other code uses the getContext() call.

Use at own risk!