Toolbar remove/insert issue

[cyberwombat]

I have a view where I insert a button in my toolbar

 init: function() {
         this.getController("Viewport").getViewportToolbar().insert(2, {xtype: "button", iconCls: 'info', cls: "viewportGoButton", view: "Invite", align : 'right', hidden: false});


    },

Then I go to another view - this button is still present - I now want to remove it and add another:
 init: function() {
        this.getController("Viewport").getViewportToolbar().removeAt(2);
        this.getController("Viewport").getViewportToolbar().insert(2, {xtype: "button", iconCls: 'info', cls: "viewportGoButton", view: "Invite", align : 'right', hidden: false});


    },

However this gives me the error:

Uncaught TypeError: Cannot read property 'dom' of null
Ext.define.insertItemsencha-touch-all-debug.js:32577
Ext.define.doItemAddsencha-touch-all-debug.js:32350
Base.implement.callParentsencha-touch-all-debug.js:2768
Ext.define.doItemAddsencha-touch-all-debug.js:32677
Ext.define.onItemAddsencha-touch-all-debug.js:32312
Ext.define.onAdd

If I do not use remove I have 2 buttons. If I use '3' for the new button it doesn't show.

How do I replace buttons without getting this error?

[mitchellsimoens]

This is working for me against our latest code:

        Ext.create('Ext.Panel', {
            fullscreen : true,
            items      : [
                {
                    xtype  : 'toolbar',
                    docked : 'top',
                    items  : [
                        {
                            text    : 'Test',
                            handler : function(btn) {
                                var toolbar = btn.up('toolbar');

                                toolbar.removeAt(2);
                                toolbar.add({
                                    text : 'New',
                                    ui   : 'confirm'
                                });
                            }
                        },
                        {
                            text : 'Another Button'
                        },
                        {
                            text : 'Remove Me'
                        }
                    ]
                }
            ]
        });

[cyberwombat]

It seems to be an issue with align:right and navigationbar. Please try this example - it causes the same issue and does not remove button (though in my app the button gets removed)

xtype  : 'navigationbar',
                    docked : 'top',
                    items  : [
                        {
                            text    : 'Test',
                            handler : function(btn) {
                                var toolbar = btn.up('navigationbar');


                                toolbar.removeAt(2);
                                toolbar.add({
                                    text : 'New',
                                    ui   : 'confirm',
                                    align: 'right'
                                });
                            }
                        },
                        {
                            text : 'Another Button'
                        },
                        {
                            text : 'Remove Me'
                        }
                    ]
                },

[cyberwombat]

Could someone from Sencha please try above code example? Sounds like a bug but would like a more experience dev to try it