Odoo Override Javascript Class Method

Question

First off, my apologies - I'm a complete novice when it comes to javascript so this is a bit above my head. I'm also fairly new to Odoo and have mostly stuck with python and XML customization thus far.

I'm trying to override a javascript method within a class to replace it completely with my own version. From the Odoo documentation (https://www.odoo.com/documentation/14.0/reference/javascript_reference.html#patching-an-existing-class) this should be a simple matter of using the .include() method to patch the original class with my new method. But when I do this I get an error Error while loading mymodule.CustomControlPanelModelExtension: TypeError: ControlPanelModelExtension.include is not a function

The original Odoo code that I'm trying to override:

odoo.define("web/static/src/js/control_panel/control_panel_model_extension.js", function (require) {
  "use strict";
    
  // a bunch of code here ...

  class ControlPanelModelExtension extends ActionModel.Extension {
    // more code here ...

    // this is the method I'm trying to override
    _getAutoCompletionFilterDomain(filter, filterQueryElements) {
      // original method body here
    }

    // more code
  }

  // more code
});

Below is what I came up with based on the documentation but this gives me the error Error while loading mymodule.CustomControlPanelModelExtension: TypeError: ControlPanelModelExtension.include is not a function (this error is reported in browser dev tools console).

odoo.define('mymodule.CustomControlPanelModelExtension', function(require) {
  "use strict";

  var ControlPanelModelExtension = require('web/static/src/js/control_panel/control_panel_model_extension.js');

  ControlPanelModelExtension.include({

    // override _getAutoCompletionFilterDomain 
    _getAutoCompletionFilterDomain: function(filter, filterQueryElements) {
      // my custom implementation here
    },

  });
});

Any ideas what I'm doing wrong here? I've tried various other things with extends and such but I don't think I want to extend - that won't replace the function in existing instances.

Answer 1

The problem here is that the include function is available only for the classes that inherit from OdooClass and in this case the class you are trying to inherit is a native JavaScript class.

---

Then, to add a property or method to a class, the prototype property of the object class must be modified.

odoo.define('mymodule.CustomControlPanelModelExtension', function(require) {
    "use strict";

    const ControlPanelModelExtension = require('web/static/src/js/control_panel/control_panel_model_extension.js');

    function _getAutoCompletionFilterDomain(filter, filterQueryElements) {
        // your custom implementation here
    }

    ControlPanelModelExtension.prototype._getAutoCompletionFilterDomain = _getAutoCompletionFilterDomain;

    return ControlPanelModelExtension;
});