Call render on the roster if an item is removed, to clear headings.

converse.js

@@ -1629,8 +1629,8 @@
             this.model.on("remove", function (item) {
                 // remove element from the rosterView instance
                 this.rosteritemviews[item.id].$el.remove();
-
                 delete this.rosteritemviews[item.id];
+                this.render();
             }, this);
 
             this.$el.hide()
@@ -1642,57 +1642,55 @@
                             '<dt id="pending-xmpp-contacts">Pending contacts</dt>'),
 
         render: function (item) {
-            if (!item) {
-                return this;
-            }
             var $my_contacts = this.$el.find('#xmpp-contacts'),
                 $contact_requests = this.$el.find('#xmpp-contact-requests'),
                 $pending_contacts = this.$el.find('#pending-xmpp-contacts'),
                 $count, presence_change;
-            // TODO see if user_id would be useful
-            var user_id = Strophe.getNodeFromJid(item.id),
-                    view = this.rosteritemviews[item.id],
-                    ask = item.get('ask'),
-                    subscription = item.get('subscription'),
-                    crit = {order:'asc'};
-
-                if (ask === 'subscribe') {
-                    $pending_contacts.after(view.render().el);
-                    $pending_contacts.after($pending_contacts.siblings('dd.pending-xmpp-contact').tsort(crit));
-                } else if (ask === 'request') {
-                    $contact_requests.after(view.render().el);
-                    $contact_requests.after($contact_requests.siblings('dd.requesting-xmpp-contact').tsort(crit));
-                } else if (subscription === 'both' || subscription === 'to') {
-                    if (!item.options.sorted) {
-                        // this attribute will be true only after all of the elements have been added on the page
-                        // at this point all offline
-                        $my_contacts.after(view.render().el);
-                    }
-                    else {
-                        // just by calling render will be enough to change the icon of the existing item without
-                        // having to reinsert it and the sort will come from the presence change
-                        view.render();
+            if (item) {
+                var user_id = Strophe.getNodeFromJid(item.id),
+                        view = this.rosteritemviews[item.id],
+                        ask = item.get('ask'),
+                        subscription = item.get('subscription'),
+                        crit = {order:'asc'};
+
+                    if (ask === 'subscribe') {
+                        $pending_contacts.after(view.render().el);
+                        $pending_contacts.after($pending_contacts.siblings('dd.pending-xmpp-contact').tsort(crit));
+                    } else if (ask === 'request') {
+                        $contact_requests.after(view.render().el);
+                        $contact_requests.after($contact_requests.siblings('dd.requesting-xmpp-contact').tsort(crit));
+                    } else if (subscription === 'both' || subscription === 'to') {
+                        if (!item.options.sorted) {
+                            // this attribute will be true only after all of the elements have been added on the page
+                            // at this point all offline
+                            $my_contacts.after(view.render().el);
+                        }
+                        else {
+                            // just by calling render will be enough to change the icon of the existing item without
+                            // having to reinsert it and the sort will come from the presence change
+                            view.render();
+                        }
                     }
+                presence_change = view.model.changed['presence_type'];
+                if (presence_change) {
+                    // resort all items only if the model has changed it's presence_type as this render
+                    // is also triggered when the resource is changed which always comes before the presence change
+                    // therefore we avoid resorting when the change doesn't affect the position of the item
+                    $my_contacts.after($my_contacts.siblings('dd.current-xmpp-contact.offline').tsort('a', crit));
+                    $my_contacts.after($my_contacts.siblings('dd.current-xmpp-contact.unavailable').tsort('a', crit));
+                    $my_contacts.after($my_contacts.siblings('dd.current-xmpp-contact.away').tsort('a', crit));
+                    $my_contacts.after($my_contacts.siblings('dd.current-xmpp-contact.busy').tsort('a', crit));
+                    $my_contacts.after($my_contacts.siblings('dd.current-xmpp-contact.online').tsort('a', crit));
                 }
-            presence_change = view.model.changed['presence_type'];
-            if (presence_change) {
-                // resort all items only if the model has changed it's presence_type as this render
-                // is also triggered when the resource is changed which always comes before the presence change
-                // therefore we avoid resorting when the change doesn't affect the position of the item
-                $my_contacts.after($my_contacts.siblings('dd.current-xmpp-contact.offline').tsort('a', crit));
-                $my_contacts.after($my_contacts.siblings('dd.current-xmpp-contact.unavailable').tsort('a', crit));
-                $my_contacts.after($my_contacts.siblings('dd.current-xmpp-contact.away').tsort('a', crit));
-                $my_contacts.after($my_contacts.siblings('dd.current-xmpp-contact.busy').tsort('a', crit));
-                $my_contacts.after($my_contacts.siblings('dd.current-xmpp-contact.online').tsort('a', crit));
-            }
 
-            if (item.options.isLast && !item.options.sorted) {
-                // this will be true after all of the roster items have been added with the default
-                // options where all of the items are offline and now we can show the rosterView
-                item.options.sorted = true;
-                $my_contacts.after($my_contacts.siblings('dd.current-xmpp-contact.offline').tsort('a', crit));
-                $my_contacts.after($my_contacts.siblings('dd.current-xmpp-contact.unavailable').tsort('a', crit));
-                this.$el.show();
+                if (item.options.isLast && !item.options.sorted) {
+                    // this will be true after all of the roster items have been added with the default
+                    // options where all of the items are offline and now we can show the rosterView
+                    item.options.sorted = true;
+                    $my_contacts.after($my_contacts.siblings('dd.current-xmpp-contact.offline').tsort('a', crit));
+                    $my_contacts.after($my_contacts.siblings('dd.current-xmpp-contact.unavailable').tsort('a', crit));
+                    this.$el.show();
+                }
             }
             // Hide the headings if there are no contacts under them
             _.each([$my_contacts, $contact_requests, $pending_contacts], function (h) {