I'm trying to customise the standard cytoscape's CanvasRenderer and facing an issue.

When I try to extend CanvasRenderer and then register it as extension, cytoscape throws warning and doesn't register the renderer:

cytoscape.cjs.js:844 Can not register myRenderer for renderer since clientFunctions already exists in the prototype and can not be overridden

If I delete all the methods that "already exists" (based on the source code it's all the methods of BaseRenderer), the renderer is registered successfully, but then fails to initialize with another error:

TypeError: this.init is not a function at Renderer.BaseRenderer (cytoscape.cjs.js:26770)

Well ok, let's bring the init back. But now we at the original problem again:

cytoscape.cjs.js:844 Can not register myRenderer for renderer since init already exists in the prototype and can not be overridden

Here is how I do that:

let CanvasRenderer = cytoscape('renderer', 'canvas')
let MyRenderer = function (options) {
  CanvasRenderer.call(this, options)
}
MyRenderer.prototype = Object.create(CanvasRenderer.prototype)

cytoscape('renderer', 'myRenderer', MyRenderer) //<- here I got the warnings and the renderer is not added.

This is how I remove properties that 'already exist':

let BaseRenderer = cytoscape('renderer', 'base');

Object.keys(BaseRenderer.prototype).forEach(function(key) {
  MyRenderer.prototype[key] = null
});

The only way I was able to make it all work is by altering the source code of the cytoscape.js by removing the logic that checks for the existence of properties:

From cytoscape.js/src/extension.js:

...
for (var pName in bProto) {
  var pVal = bProto[pName];
  var existsInR = rProto[pName] != null;

  if (existsInR) { //when I comment this 'if' block, everything works as expected.
    return overrideErr(pName);
  }

  proto[pName] = pVal; // take impl from base
}
...

But that defeats the purpose of extensions.

So how to correctly extended CanvasRenderer to make a custom renderer based on it?

I'm looking to override methods related to drawing edges like findEdgeControlPoints, drawEdgePath and possible a few more.