ExtJs5 - overriding native method defined inside ext-all-debug.js

Asked 3/11, 2014 at 11:2 Answered 27/6 at 21:59

Solved firefox extjs migration overriding firebug

Suppose i want to override a function inside the native code provided by Sencha in the file ext-all-debug.js.

The function is defined inside the Ext.util.Renderable-class and has the name cacheRefEls.

The overriding should take place inside the index.html of the project to make it easier to maintain for future releases.

I have already tried out the override solutions proposed inside this thread:

Steps to overriding Sencha ExtJS standard component functionality (Ext.tree.Panel & Ext.data.TreeStore as two examples)

My index.html looks as follows:

<html>
...
<script type="text/javascript">
    Ext.define('Myapp.view.Renderable', {
        override: 'Ext.util.Renderable',
        cacheRefEls: function(el) {
              console.log("in overider method");
             //my adapted version of it
        }   
    });
</script>
...
</html>

Unfortunately after accessing the localhost:8080 over Firefox-33 it is visible from the Firebug-2-Console-log that it still uses the native version of the function.

What am i missing here?

Dormeuse answered 3/11, 2014 at 11:2 Comment(1)

cacheRefEls is a private method and cannot be overridden. If you created your override successfully you should be seeing: Ext.util.Renderable: Public method "cacheRefEls" conflicts with private framework method declared by Ext.util.Renderable – Godfry 4/11, 2014 at 0:28

In ExtJS 5, you need to move these methods to the privates configuration.

You should have seen the error:

Public method "cacheRefEls" conflicts with private framework method declared by Ext.util.Renderable

You can still override the private method. In your case, the solution would be:

Ext.define('Myapp.view.Renderable', {
    override: 'Ext.util.Renderable',
    privates: {
       cacheRefEls: function(el) {
          console.log("in overider method");
         //my adapted version of it
       }
    }   
});

Paugh answered 26/3, 2015 at 18:30 Comment(1)

not all overridden methods need to go within privates, only those that originally belong there like cacheRefEls. You would have to add statics if the method that you are trying to override belongs there. – Pentathlon 10/6, 2016 at 13:58

It's proposed here that private functions can be overridden by placing them in a privates section in the override. If that was true in previous versions, it's not true in ExtJS version 7.

I added the code below into our overrides, targeting another private function within Renderable, with a breakpoint on the one code line - never hits it. Makes sense - it's private for a reason - but I'm trying to prevent XSS injection now, so I need to hit up the text property of render templates. Because this doesn't work, I'm gonna have some trouble on this one:

Ext.define('overrides.general.util.Renderable', {
   override: 'Ext.util.Renderable',
   privates: {
      initRenderTpl: function () {
         this.callParent();
      }
   }
});

Impend answered 27/6 at 21:59 Comment(0)

Recommended topics

Hot tags