Stores: add() nested Models problem

[Corcho]

Hi, it's been more like 8 hours of debugging and researching my problem... I come here as my last resort.

Im trying to use the add() method of store to add a new record. The trick here is the model has a hasMany property. This is the definition code of the models:

Ext.define('MyApp.model.Notification', {
    extend: 'Ext.data.Model'
     
    ,requires: [
        'MyApp.model.notification.NotificationButton'
    ]
    ,fields: [{
         name: 'type'
        ,type: 'string'
    },{
         name: 'icon'
        ,type: 'string'
    },{
         name: 'description'
        ,type: 'string'
    }]
    
    ,hasMany: {
         model: 'MyApp.model.notification.NotificationButton'
        ,name: 'buttons'
    }
});

Ext.define('MyApp.model.notification.NotificationButton', {
     extend: 'Ext.data.Model'
    ,fields: [{
         name: 'text'
        ,type: 'string'
    },{
         name: 'image'
        ,type: 'string'
    },{
         name: 'id'
        ,type: 'string'
    },{
         name: 'fn'
        ,type: 'string'
    }]
    
    ,belongsTo: 'MyApp.model.Notification'
});

And this is an example of the object:

{    notifications: [{
         "type": "warning"
        ,"icon": "resources/images/myImage.png"
        ,"description": "desc"
        ,"buttons": [{
             "id": 'btn-1'
            ,"text": "YES"
            ,"image": "resources/images/image2.png"
            ,"fn": "example"
        },{
             "id": 'btn-2'
            ,"text": "LATER"
            ,"image": "resources/images/image3.png"
            ,"fn": "example"
        }]
    }]
}

The weird thing is that if I set the store to autoload a JSON file like above, it works fine and the buttons are added corretly. BUT, when I fire the ADD() method of the store and pass the same JSON object, Notification model is added well, but not with the buttons. It's like the "Notification" model is not calling the "NotificationButton" model. To be clear: when I fire add() method, a "Notification" record is added and "buttons" is added like a simple array and not as a model.

This is how I'm trying to add the new record:

var test= Ext.create('MyApp.model.Notification', {
         "type": "warning"
        ,"icon": "resources/images/myImage.png"
        ,"description": "desc"
        ,"buttons": [{
             "id": 'btn-1'
            ,"text": "YES"
            ,"image": "resources/images/image2.png"
            ,"fn": "example"
        },{
             "id": 'btn-2'
            ,"text": "LATER"
            ,"image": "resources/images/image3.png"
            ,"fn": "example"
        }]
    });
        Ext.getStore(storeId).add(test);

And this is what the console shows me:

newClass {phantom: true, internalId: "ext-record-26", raw: undefined, data: Object, modified: Object…}
data: Object
buttons: Array[2]
0: Object
id: "btn-1"
image: "resources/images/image2.png"
text: "YES"
__proto__: Object

1: Object
length: 2
__proto__: Array[0]

description: "desc"
icon: "resources/images/myImage.png"
type: "warning"
__proto__: Object

dirty: false
editing: false
events: Object
id: "MyApp.model.Notification-ext-record-26"
internalId: "ext-record-26"
modified: Object
phantom: true
raw: undefined
store: newClass
__proto__: prototype

Is there something I'm doing wrong here? I tryed some other approaches and none worked for me. Any help or approach would be appreciated.

Bye!

MORE INFO:
This is the record when I set the store to autoload, and what I spect to get when I add a new one. See how "buttons" are shown as records and not as an array:

0: newClass
buttonsStore: newClass
data: Object
dirty: false
editing: false
events: Object
id: "MyApp.model.Notification-ext-record-26"
index: 0
internalId: "ext-record-26"
modified: Object
phantom: true
raw: Object
store: newClass
__proto__: prototype

Finally, came up to this post that sais it's a "bug" in 4.0. Anyone with an idea to fix this in 4.0?

[mitchellsimoens]

The data has to get read by the reader which is why when you load the json it works.