PDA

View Full Version : [OPEN] Ext.Mixin chaining invalid or docs need updating



Artur Bodera (Joust)
19 Sep 2014, 2:18 AM
From docs:
http://docs.sencha.com/extjs/5.0/apidocs/#!/api/Ext.Mixin




Chaining

One way for a mixin to provide methods that act more like normal inherited methods is to use an on declaration. These methods will be injected into thecallParent chain between the derived and superclass. For example:




Ext.define('Foo.bar.Util', {
extend: 'Ext.Mixin',
mixinConfig: {
on: {
destroy: function () {
console.log('M');
}
}
}
});
Ext.define('Foo.bar.Base', {
destroy: function () {
console.log('B');
}
});
Ext.define('Foo.bar.Derived', {
extend: 'Foo.bar.Base',
mixins: {
util: 'Foo.bar.Util'
},

destroy: function () {
this.callParent();
console.log('D');
}
});

var obj = new Foo.bar.Derived();
obj.destroy();
// logs M then B then D



What happens instead:
https://fiddle.sencha.com/#fiddle/ajp

B
M
D
In other words: the mixin is called after? superclass method.

mitchellsimoens
22 Sep 2014, 7:39 AM
These methods will be injected into the callParent chain between the derived and superclass.

So it should go between the Foo.bar.Base.destroy and Foo.bar.Derived.destroy method correct? So the B, M, D order is proper? From that description I wouldn't expect Foo.bar.Util.destroy to come before Foo.bar.Base, it should come just after Foo.bar.Base.

agarberi
23 Sep 2014, 12:36 AM
Hello,
sorry if I enter the discussion, but I tried the Fiddle with a little change:
I inverted the lines in the destroy() method of Derived class.

From:


destroy: function() {
this.callParent();
console.log('D');
}



To:


destroy: function() {
console.log('D');
this.callParent();
}


It outputs:
D
B
M

So the mixin seems to be called after base class (instead of after the derived class).
I don't know if this is right or wrong, I just want to better understand how it works (from the documentation I would have expected D,M,B, that is "injected into the callParent chain between the derived and superclass").

Artur Bodera (Joust)
23 Sep 2014, 12:51 AM
So it should go between the Foo.bar.Base.destroy and Foo.bar.Derived.destroy method correct? So the B, M, D order is proper? From that description I wouldn't expect Foo.bar.Util.destroy to come before Foo.bar.Base, it should come just after Foo.bar.Base.


Let's disect it one more time:


These methods will be injected into the callParent chain between the derived and superclass.


So the callParent chain, before adding a mixin, is as follows:
Foo.bar.Base - the super class
Foo.bar.Derived - the base
So the execution would come from top to bottom, first the Base then Derived.

"Between the derived and superclass" means between 1. and 2., so after adding a mixin:
Foo.bar.Base - the super class
Foo.bar.Util - the mixin
Foo.bar.Derived - the base

So the problem is in the documentation - last lines of the example should read:



obj.destroy();
// logs B then M then D

Artur Bodera (Joust)
23 Sep 2014, 12:53 AM
Hello,
sorry if I enter the discussion, but I tried the Fiddle with a little change:
I inverted the lines in the destroy() method of Derived class.


Well, you've changed the order of lines so effectively manipulated the output, but that does not affect the call tree (order of method calls).

What's more important is how they are called. So the first part of the documentation with description is correct, but then the example and last line of the example source code is not correct.

agarberi
23 Sep 2014, 12:59 AM
What I mean is that with the documentation example you are not seeing the execution order, as callParent() is before log(), forcing the display of parent logs before the Derived one.
If you want to see the calling order in the output, you should log() immediately as first line, then continue the chain call.
Inverting the lines, as I suggested, you see that the mixin is not injected between Derived and Base, but instead is called after Base.


Note:
may be it was a typo, but in your message you wrote "Foo.bar.Derived - the base", while the "base" is "Foo.bar.Base".

mitchellsimoens
23 Sep 2014, 3:52 AM
@Artur Bodera (Joust) I see. Yes the docs do need updating to change that comment line.

@agarberi, this mixin on config will use the callParent behavior so it's all about what happens when you execute the callParent. The example as is does have the wrong order in that comment line:


// logs M then B then D

should be


// logs B then M then D