Various bugfixes based on the previous refactoring.

These two commit should ideally be one, but I inadvertently pushed to
remote too early.

spec/muc.js

@@ -1307,7 +1307,6 @@
                     .c('status', {code: '110'});
                 _converse.connection._dataRecv(test_utils.createRequest(presence));
                 expect(view.model.saveAffiliationAndRole).toHaveBeenCalled();
-                debugger;
                 expect(u.isVisible(view.el.querySelector('.toggle-chatbox-button'))).toBeTruthy();
                 await test_utils.waitUntil(() => !_.isNull(view.el.querySelector('.configure-chatroom-button')))
                 expect(u.isVisible(view.el.querySelector('.configure-chatroom-button'))).toBeTruthy();
@@ -1874,11 +1873,11 @@
                 const view = _converse.chatboxviews.get('lounge@montague.lit');
                 const chat_area = view.el.querySelector('.chat-area');
 
-                expect(view.model.get('affiliation')).toBe('owner');
+                expect(view.model.getOwnAffiliation()).toBe('owner');
                 expect(view.model.features.get('open')).toBe(false);
                 expect(view.el.querySelectorAll('input.invited-contact').length).toBe(1);
 
-                view.model.set('affiliation', 'member');
+                view.model.getOwnOccupant().set('affiliation', 'member');
                 await test_utils.waitUntil(() => view.el.querySelectorAll('input.invited-contact').length === 0);
 
                 view.model.features.set('open', 'true');

src/converse-muc-views.js

@@ -480,7 +480,6 @@ converse.plugins.add('converse-muc-views', {
                 this.model.on('change', this.renderHeading, this);
                 this.model.on('change:connection_status', this.onConnectionStatusChanged, this);
                 this.model.on('change:hidden_occupants', this.updateOccupantsToggle, this);
-                this.model.on('change:role', this.renderBottomPanel, this);
                 this.model.on('change:subject', this.setChatRoomSubject, this);
                 this.model.on('configurationNeeded', this.getAndRenderConfigurationForm, this);
                 this.model.on('destroy', this.hide, this);
@@ -491,8 +490,8 @@ converse.plugins.add('converse-muc-views', {
                 this.model.occupants.on('add', this.onOccupantAdded, this);
                 this.model.occupants.on('remove', this.onOccupantRemoved, this);
                 this.model.occupants.on('change:show', this.showJoinOrLeaveNotification, this);
-                this.model.occupants.on('change:role', this.informOfOccupantsRoleChange, this);
-                this.model.occupants.on('change:affiliation', this.informOfOccupantsAffiliationChange, this);
+                this.model.occupants.on('change:role', this.onOccupantRoleChanged, this);
+                this.model.occupants.on('change:affiliation', this.onOccupantAffiliationChanged, this);
 
                 this.createEmojiPicker();
                 this.render();
@@ -532,7 +531,7 @@ converse.plugins.add('converse-muc-views', {
 
             renderBottomPanel () {
                 const container = this.el.querySelector('.bottom-panel');
-                if (this.model.features.get('moderated') && this.model.getOwnOccupant().get('role') === 'visitor') {
+                if (this.model.features.get('moderated') && this.model.getOwnRole() === 'visitor') {
                     container.innerHTML = tpl_chatroom_bottom_panel({'__': __});
                 } else {
                     if (!container.firstElementChild || !container.querySelector('.sendXMPPMessage')) {
@@ -608,7 +607,14 @@ converse.plugins.add('converse-muc-views', {
                 return _converse.ChatBoxView.prototype.showChatStateNotification.apply(this, arguments);
             },
 
-            informOfOccupantsAffiliationChange(occupant, changed) {
+            onOccupantAffiliationChanged (occupant) {
+                if (occupant.get('jid') === _converse.bare_jid) {
+                    this.renderHeading();
+                }
+                this.informOfOccupantsAffiliationChange(occupant);
+            },
+
+            informOfOccupantsAffiliationChange (occupant) {
                 const previous_affiliation = occupant._previousAttributes.affiliation,
                       current_affiliation = occupant.get('affiliation');
 
@@ -632,6 +638,13 @@ converse.plugins.add('converse-muc-views', {
                 }
             },
 
+            onOccupantRoleChanged (occupant, changed) {
+                if (occupant.get('jid') === _converse.bare_jid) {
+                    this.renderBottomPanel();
+                }
+                this.informOfOccupantsRoleChange(occupant, changed);
+            },
+
             informOfOccupantsRoleChange (occupant, changed) {
                 if (changed === "none") {
                     return;
@@ -661,6 +674,7 @@ converse.plugins.add('converse-muc-views', {
                  */
                 return tpl_chatroom_head(
                     Object.assign(this.model.toJSON(), {
+                        'isOwner': this.model.getOwnAffiliation() === 'owner',
                         'title': this.model.getDisplayName(),
                         'Strophe': Strophe,
                         '_converse': _converse,
@@ -1270,6 +1284,9 @@ converse.plugins.add('converse-muc-views', {
             },
 
             onOccupantAdded (occupant) {
+                if (occupant.get('jid') === _converse.bare_jid) {
+                    this.renderHeading();
+                }
                 if (occupant.get('show') === 'online') {
                     this.showJoinNotification(occupant);
                 }
@@ -1707,10 +1724,9 @@ converse.plugins.add('converse-muc-views', {
             async initialize () {
                 OrderedListView.prototype.initialize.apply(this, arguments);
 
-                this.model.on(
-                    'change:affiliation',
-                    o => (o.get('jid') === _converse.bare_jid) && this.renderInviteWidget()
-                );
+                this.model.on('add', this.maybeRenderInviteWidget, this);
+                this.model.on('change:affiliation', this.maybeRenderInviteWidget, this);
+
                 this.chatroomview = this.model.chatroomview;
                 this.chatroomview.model.features.on('change', this.renderRoomFeatures, this);
                 this.chatroomview.model.features.on('change:open', this.renderInviteWidget, this);
@@ -1743,6 +1759,12 @@ converse.plugins.add('converse-muc-views', {
                 }
             },
 
+            maybeRenderInviteWidget (occupant) {
+                if (occupant.get('jid') === _converse.bare_jid) {
+                    this.renderInviteWidget();
+                }
+            },
+
             renderInviteWidget () {
                 const widget = this.el.querySelector('.room-invite');
                 if (this.shouldInviteWidgetBeShown()) {
@@ -1827,7 +1849,7 @@ converse.plugins.add('converse-muc-views', {
             shouldInviteWidgetBeShown () {
                 return _converse.allow_muc_invitations &&
                     (this.chatroomview.model.features.get('open') ||
-                        this.chatroomview.model.getOwnOccupant().get('affiliation') === "owner"
+                        this.chatroomview.model.getOwnAffiliation() === "owner"
                     );
             },
 

src/headless/converse-muc.js

@@ -715,7 +715,7 @@ converse.plugins.add('converse-muc', {
                 if (!_converse.send_chat_state_notifications ||
                         !this.get('chat_state') ||
                         this.get('connection_status') !== converse.ROOMSTATUS.ENTERED ||
-                        this.features.get('moderated') && this.getOwnOccupant().get('role') === 'visitor') {
+                        this.features.get('moderated') && this.getOwnRole() === 'visitor') {
                     return;
                 }
                 const chat_state = this.get('chat_state');
@@ -973,6 +973,25 @@ converse.plugins.add('converse-muc', {
                 return _converse.api.sendIQ(iq).then(callback).catch(errback);
             },
 
+            /**
+             * Returns the `role` which the current user has in this MUC
+             * @private
+             * @method _converse.ChatRoom#getOwnRole
+             * @returns { ('none'|'visitor'|'participant'|'moderator') }
+             */
+            getOwnRole () {
+                return _.get(this.getOwnOccupant(), 'attributes.role');
+            },
+
+            /**
+             * Returns the `affiliation` which the current user has in this MUC
+             * @private
+             * @method _converse.ChatRoom#getOwnAffiliation
+             * @returns { ('none'|'outcast'|'member'|'admin'|'owner') }
+             */
+            getOwnAffiliation () {
+                return _.get(this.getOwnOccupant(), 'attributes.affiliation');
+            },
 
             /**
              * Get the {@link _converse.ChatRoomOccupant} instance which
@@ -982,15 +1001,7 @@ converse.plugins.add('converse-muc', {
              * @returns { _converse.ChatRoomOccupant }
              */
             getOwnOccupant () {
-                const occupant = this.occupants.findWhere({'jid': _converse.bare_jid});
-                if (occupant) {
-                    return occupant;
-                }
-                const attributes = {
-                    'jid': _converse.bare_jid,
-                    'resource': Strophe.getResourceFromJid(_converse.resource)
-                };
-                return this.occupants.create(attributes);
+                return this.occupants.findWhere({'jid': _converse.bare_jid});
             },
 
             /**
@@ -1719,7 +1730,7 @@ converse.plugins.add('converse-muc', {
                 this.createInfoMessages(stanza);
                 if (stanza.querySelector("status[code='110']")) {
                     this.onOwnPresence(stanza);
-                    if (this.getOwnOccupant().get('role') !== 'none' &&
+                    if (this.getOwnRole() !== 'none' &&
                             this.get('connection_status') === converse.ROOMSTATUS.CONNECTING) {
                         this.save('connection_status', converse.ROOMSTATUS.CONNECTED);
                     }
@@ -1778,7 +1789,7 @@ converse.plugins.add('converse-muc', {
                         // (in which case Prosody doesn't send a 201 status),
                         // otherwise the features would have been fetched in
                         // the "initialize" method already.
-                        if (this.getOwnOccupant().get('affiliation') === 'owner' && this.get('auto_configure')) {
+                        if (this.getOwnAffiliation() === 'owner' && this.get('auto_configure')) {
                             this.autoConfigureChatRoom().then(() => this.refreshRoomFeatures());
                         } else {
                             this.getRoomFeatures();
@@ -1832,6 +1843,12 @@ converse.plugins.add('converse-muc', {
         });
 
 
+        /**
+         * Represents an participant in a MUC
+         * @class
+         * @namespace _converse.ChatRoomOccupant
+         * @memberOf _converse
+         */
         _converse.ChatRoomOccupant = Backbone.Model.extend({
 
             defaults: {

src/templates/chatroom_head.html

@@ -10,7 +10,7 @@
     {[ if (!o._converse.singleton) { ]}
         <a class="chatbox-btn close-chatbox-button fa fa-sign-out-alt" title="{{{o.info_close}}}"></a>
     {[ } ]}
-    {[ if (o.affiliation == 'owner') { ]}
+    {[ if (o.isOwner) { ]}
         <a class="chatbox-btn configure-chatroom-button fa fa-wrench" title="{{{o.info_configure}}} "></a>
     {[ } ]}
     <a class="chatbox-btn show-room-details-modal fa fa-info-circle" title="{{{o.info_details}}}"></a>