Fix more failing tests

spec/controlbox.js

@@ -41,13 +41,15 @@
                 test_utils.createContacts(_converse, 'all').openControlBox();
 
                 var contacts_panel = _converse.chatboxviews.get('controlbox').contactspanel;
-                expect(_.isNull(contacts_panel.tab_el.querySelector('.msgs-indicator'))).toBeTruthy();
 
                 var sender_jid = mock.cur_names[0].replace(/ /g,'.').toLowerCase() + '@localhost';
                 test_utils.openChatBoxFor(_converse, sender_jid);
                 var chatview = _converse.chatboxviews.get(sender_jid);
                 chatview.model.set({'minimized': true});
 
+                expect(_.isNull(_converse.chatboxviews.el.querySelector('.restore-chat .message-count'))).toBeTruthy();
+                expect(_.isNull(_converse.rosterview.el.querySelector('.msgs-indicator'))).toBeTruthy();
+
                 var msg = $msg({
                         from: sender_jid,
                         to: _converse.connection.jid,
@@ -56,7 +58,8 @@
                     }).c('body').t('hello').up()
                     .c('active', {'xmlns': 'http://jabber.org/protocol/chatstates'}).tree();
                 _converse.chatboxes.onMessage(msg);
-                expect(contacts_panel.tab_el.querySelector('.msgs-indicator').textContent).toBe('1');
+                expect(_converse.chatboxviews.el.querySelector('.restore-chat .message-count').textContent).toBe('1');
+                expect(_converse.rosterview.el.querySelector('.msgs-indicator').textContent).toBe('1');
 
                 msg = $msg({
                         from: sender_jid,
@@ -66,14 +69,12 @@
                     }).c('body').t('hello again').up()
                     .c('active', {'xmlns': 'http://jabber.org/protocol/chatstates'}).tree();
                 _converse.chatboxes.onMessage(msg);
-                expect(contacts_panel.tab_el.querySelector('.msgs-indicator').textContent).toBe('2');
-
-                var roomspanel = _converse.chatboxviews.get('controlbox').roomspanel;
-                expect(_.isNull(roomspanel.tab_el.querySelector('.msgs-indicator'))).toBeTruthy();
+                expect(_converse.chatboxviews.el.querySelector('.restore-chat .message-count').textContent).toBe('2');
+                expect(_converse.rosterview.el.querySelector('.msgs-indicator').textContent).toBe('2');
 
                 chatview.model.set({'minimized': false});
-                expect(_.includes(contacts_panel.tab_el.firstChild.classList, 'unread-msgs')).toBeFalsy();
-                expect(_.isNull(contacts_panel.tab_el.querySelector('.msgs-indicator'))).toBeTruthy();
+                expect(_.isNull(_converse.chatboxviews.el.querySelector('.restore-chat .message-count'))).toBeTruthy();
+                expect(_.isNull(_converse.rosterview.el.querySelector('.msgs-indicator'))).toBeTruthy();
                 done();
             }));
         });
@@ -87,8 +88,8 @@
 
                 test_utils.openControlBox();
                 var view = _converse.xmppstatusview;
-                expect($(view.el).find('a.choose-xmpp-status').hasClass('online')).toBe(true);
-                expect($(view.el).find('a.choose-xmpp-status').attr('data-value')).toBe('I am online');
+                expect($(view.el).find('.xmpp-status span:first-child').hasClass('online')).toBe(true);
+                expect(view.el.querySelector('.xmpp-status span.online').textContent.trim()).toBe('I am online');
                 done();
             }));
 
@@ -98,23 +99,25 @@
                     function (done, _converse) {
 
                 test_utils.openControlBox();
-                var view = _converse.xmppstatusview;
-                spyOn(view, 'toggleOptions').and.callThrough();
-                spyOn(view, 'setStatus').and.callThrough();
-                spyOn(_converse, 'emit');
-                view.delegateEvents(); // We need to rebind all events otherwise our spy won't be called
-                view.el.querySelector('a.choose-xmpp-status').click();
-                expect(view.toggleOptions).toHaveBeenCalled();
-                spyOn(view, 'updateStatusUI').and.callThrough();
-                view.initialize(); // Rebind events for spy
-                $(view.el).find('.dropdown dd ul li a')[1].click(); // Change status to "dnd"
-                expect(view.setStatus).toHaveBeenCalled();
-                expect(_converse.emit).toHaveBeenCalledWith('statusChanged', 'dnd');
-                expect(view.updateStatusUI).toHaveBeenCalled();
-                expect($(view.el).find('a.choose-xmpp-status').hasClass('online')).toBe(false);
-                expect($(view.el).find('a.choose-xmpp-status').hasClass('dnd')).toBe(true);
-                expect($(view.el).find('a.choose-xmpp-status').attr('data-value')).toBe('I am busy');
-                done();
+
+                var cbview = _converse.chatboxviews.get('controlbox');
+                cbview.el.querySelector('.change-status').click()
+                var modal = _converse.xmppstatusview.status_modal;
+
+                test_utils.waitUntil(function () {
+                    return u.isVisible(modal.el);
+                }, 1000).then(function () {
+                    var view = _converse.xmppstatusview;
+                    spyOn(_converse, 'emit');
+                    modal.el.querySelector('label[for="radio-busy"]').click(); // Change status to "dnd"
+                    modal.el.querySelector('[type="submit"]').click();
+
+                    expect(_converse.emit).toHaveBeenCalledWith('statusChanged', 'dnd');
+                    expect($(view.el).find('.xmpp-status span:first-child').hasClass('online')).toBe(false);
+                    expect($(view.el).find('.xmpp-status span:first-child').hasClass('dnd')).toBe(true);
+                    expect(view.el.querySelector('.xmpp-status span:first-child').textContent.trim()).toBe('I am busy');
+                    done();
+                });
             }));
 
             it("can be used to set a custom status message",
@@ -123,22 +126,26 @@
                     function (done, _converse) {
 
                 test_utils.openControlBox();
-                var view = _converse.xmppstatusview;
-                _converse.xmppstatus.save({'status': 'online'});
-                spyOn(view, 'setStatusMessage').and.callThrough();
-                spyOn(view, 'renderStatusChangeForm').and.callThrough();
-                spyOn(_converse, 'emit');
-                view.delegateEvents(); // We need to rebind all events otherwise our spy won't be called
-                view.el.querySelector('a.change-xmpp-status-message').click();
-                expect(view.renderStatusChangeForm).toHaveBeenCalled();
-                var msg = 'I am happy';
-                view.el.querySelector('input.custom-xmpp-status').value = msg;
-                view.el.querySelector('[type="submit"]').click();
-                expect(view.setStatusMessage).toHaveBeenCalled();
-                expect(_converse.emit).toHaveBeenCalledWith('statusMessageChanged', msg);
-                expect($(view.el).find('a.choose-xmpp-status').hasClass('online')).toBe(true);
-                expect($(view.el).find('a.choose-xmpp-status').attr('data-value')).toBe(msg);
-                done();
+
+                var cbview = _converse.chatboxviews.get('controlbox');
+                cbview.el.querySelector('.change-status').click()
+                var modal = _converse.xmppstatusview.status_modal;
+
+                test_utils.waitUntil(function () {
+                    return u.isVisible(modal.el);
+                }, 1000).then(function () {
+                    var view = _converse.xmppstatusview;
+                    spyOn(_converse, 'emit');
+
+                    var msg = 'I am happy';
+                    modal.el.querySelector('input[name="status_message"]').value = msg;
+                    modal.el.querySelector('[type="submit"]').click();
+
+                    expect(_converse.emit).toHaveBeenCalledWith('statusMessageChanged', msg);
+                    expect($(view.el).find('.xmpp-status span:first-child').hasClass('online')).toBe(true);
+                    expect(view.el.querySelector('.xmpp-status span:first-child').textContent.trim()).toBe(msg);
+                    done();
+                });
             }));
         });
     });

spec/roster.js

@@ -207,22 +207,24 @@
                     null, ['rosterGroupsFetched'], {},
                     function (done, _converse) {
 
-                var $filter;
-                var $type;
                 _converse.roster_groups = true;
                 test_utils.openControlBox();
                 test_utils.createGroupedContacts(_converse);
                 _converse.rosterview.filter_view.delegateEvents();
-                $filter = $(_converse.rosterview.el).find('.roster-filter');
                 var $roster = $(_converse.rosterview.roster_el);
-                $type = $(_converse.rosterview.el).find('.filter-type');
-                $type.val('groups');
+
+                var button = _converse.rosterview.el.querySelector('span[data-type="groups"]');
+                button.click();
+
                 test_utils.waitUntil(function () {
                     return $roster.find('li:visible').length === 15;
                 }, 600).then(function () {
                     expect($roster.find('div.roster-group:visible a.group-toggle').length).toBe(5);
-                    $filter.val("colleagues");
-                    u.triggerEvent($filter[0], "keydown", "KeyboardEvent");
+
+                    var filter = _converse.rosterview.el.querySelector('.roster-filter');
+                    filter.value = "colleagues";
+                    u.triggerEvent(filter, "keydown", "KeyboardEvent");
+
                     return test_utils.waitUntil(function () {
                         return $roster.find('div.roster-group:not(.collapsed) a.group-toggle').length === 1;
                     }, 600);
@@ -233,9 +235,9 @@
                     // Check that all contacts under the group are shown
                     expect($roster.find('div.roster-group:not(.collapsed) li:hidden').length).toBe(0);
 
-                    $filter = $(_converse.rosterview.el).find('.roster-filter');
-                    $filter.val("xxx");
-                    u.triggerEvent($filter[0], "keydown", "KeyboardEvent");
+                    var filter = _converse.rosterview.el.querySelector('.roster-filter');
+                    filter.value = "xxx";
+                    u.triggerEvent(filter, "keydown", "KeyboardEvent");
 
                     return test_utils.waitUntil(function () {
                         return $roster.find('div.roster-group.collapsed a.group-toggle').length === 5;
@@ -243,9 +245,9 @@
                 }).then(function () {
                     expect($roster.find('div.roster-group:not(.collapsed) a').length).toBe(0);
 
-                    $filter = $(_converse.rosterview.el).find('.roster-filter');
-                    $filter.val(""); // Check that groups are shown again, when the filter string is cleared.
-                    u.triggerEvent($filter[0], "keydown", "KeyboardEvent");
+                    var filter = _converse.rosterview.el.querySelector('.roster-filter');
+                    filter.value = ""; // Check that groups are shown again, when the filter string is cleared.
+                    u.triggerEvent(filter, "keydown", "KeyboardEvent");
                     return test_utils.waitUntil(function () {
                         return $roster.find('div.roster-group.collapsed a.group-toggle').length === 0;
                     }, 600);
@@ -264,21 +266,18 @@
                 _converse.roster_groups = true;
                 test_utils.openControlBox();
                 test_utils.createGroupedContacts(_converse);
-                var $filter = $(_converse.rosterview.el).find('.roster-filter');
-                _converse.rosterview.filter_view.delegateEvents();
-                $filter.val("xxx");
-                u.triggerEvent($filter[0], "keydown", "KeyboardEvent");
-                expect($filter.hasClass("x")).toBeFalsy();
-                $filter = $(_converse.rosterview.el).find('.roster-filter');
+
+                var filter = _converse.rosterview.el.querySelector('.roster-filter');
+                filter.value = "xxx";
+                u.triggerEvent(filter, "keydown", "KeyboardEvent");
+                expect(_.includes(filter.classList, "x")).toBeFalsy();
+                expect(u.hasClass('hidden', _converse.rosterview.el.querySelector('.roster-filter-form .clear-input'))).toBeTruthy();
+
                 test_utils.waitUntil(function () {
-                    return $(_converse.rosterview.el).find('.roster-filter').hasClass("x");
+                    return !u.hasClass('hidden', _converse.rosterview.el.querySelector('.roster-filter-form .clear-input'));
                 }, 900).then(function () {
-                    var $filter = $(_converse.rosterview.el).find('.roster-filter');
-                    $filter.addClass("onX")[0].click();
-                    return test_utils.waitUntil(function () {
-                        return !$(_converse.rosterview.el).find('.roster-filter').hasClass("x");
-                    }, 900)
-                }).then(function () {
+                    var filter = _converse.rosterview.el.querySelector('.roster-filter');
+                    _converse.rosterview.el.querySelector('.clear-input').click();
                     expect(document.querySelector('.roster-filter').value).toBe("");
                     done();
                 });
@@ -289,27 +288,24 @@
                     null, ['rosterGroupsFetched'], {},
                     function (done, _converse) {
 
-                var $filter;
-                _converse.roster_groups = true;
                 test_utils.createGroupedContacts(_converse);
                 var jid = mock.cur_names[3].replace(/ /g,'.').toLowerCase() + '@localhost';
                 _converse.roster.get(jid).set('chat_status', 'online');
+                jid = mock.cur_names[4].replace(/ /g,'.').toLowerCase() + '@localhost';
+                _converse.roster.get(jid).set('chat_status', 'dnd');
                 test_utils.openControlBox();
 
-                _converse.rosterview.filter_view.delegateEvents();
-                var $type = $(_converse.rosterview.el).find('.filter-type');
-                $type.val('state')
-                u.triggerEvent($type[0], "change");
+                var button = _converse.rosterview.el.querySelector('span[data-type="state"]');
+                button.click();
 
-                $filter = $(_converse.rosterview.el).find('.state-type');
                 var $roster = $(_converse.rosterview.roster_el);
-
                 test_utils.waitUntil(function () {
-                        return $roster.find('li:visible').length === 15;
+                    return $roster.find('li:visible').length === 15;
                 }, 500).then(function () {
+                    var filter = _converse.rosterview.el.querySelector('.state-type');
                     expect($roster.find('ul.roster-group-contacts:visible').length).toBe(5);
-                    $filter.val("online");
-                    u.triggerEvent($filter[0], 'change');
+                    filter.value = "online";
+                    u.triggerEvent(filter, 'change');
 
                     return test_utils.waitUntil(function () {
                         return $roster.find('li:visible').length === 1;
@@ -317,9 +313,15 @@
                 }).then(function () {
                     expect($roster.find('li:visible').eq(0).text().trim()).toBe('Rinse Sommer');
                     expect($roster.find('ul.roster-group-contacts:visible').length).toBe(1);
-                    var $type = $(_converse.rosterview.el).find('.filter-type');
-                    $type.val('contacts');
-                    u.triggerEvent($type[0], 'change');
+
+                    var filter = _converse.rosterview.el.querySelector('.state-type');
+                    filter.value = "dnd";
+                    u.triggerEvent(filter, 'change');
+                    return test_utils.waitUntil(function () {
+                        return $roster.find('li:visible').eq(0).text().trim() === 'Annegreet Gomez';
+                    }, 900)
+                }).then(function () {
+                    expect($roster.find('ul.roster-group-contacts:visible').length).toBe(1);
                     done();
                 });
             }));

spec/xmppstatus.js

@@ -6,9 +6,8 @@
 
         it("won't send <show>online</show> when setting a custom status message", mock.initConverse(function (_converse) {
             _converse.xmppstatus.save({'status': 'online'});
-            spyOn(_converse.xmppstatus, 'setStatusMessage').and.callThrough();
             spyOn(_converse.connection, 'send');
-            _converse.xmppstatus.setStatusMessage("I'm also happy!");
+            _converse.api.user.status.message.set("I'm also happy!");
             expect(_converse.connection.send).toHaveBeenCalled();
             var $stanza = $(_converse.connection.send.calls.argsFor(0)[0].tree());
             expect($stanza.children().length).toBe(2);

src/templates/profile_view.html

@@ -14,7 +14,7 @@
     <span class="{{{o.chat_status}}} w-100 align-self-center" data-value="{{{o.chat_status}}}">
         <span class="fa
             {[ if (o.chat_status === 'online') { ]} fa-circle {[ } ]}
-            {[ if (o.chat_status === 'busy') { ]} fa-minus-circle {[ } ]}
+            {[ if (o.chat_status === 'dnd') { ]} fa-minus-circle {[ } ]}
             {[ if (o.chat_status === 'away') { ]} fa-dot-circle-o {[ } ]}
             {[ if (o.chat_status === 'xa') { ]} fa-circle-o {[ } ]}
             {[ if (o.chat_status === 'offline') { ]} fa-times-circle {[ } ]}"></span> {{{o.status_message}}}</span>

src/templates/roster_filter.html

@@ -1,7 +1,7 @@
 <form class="roster-filter-form input-button-group {[ if (!o.visible) { ]} hidden {[ } ]}">
     <div class="form-inline flex-nowrap">
         <div class="btn-group">
-            <input value="{{{o.filter_text}}}"
+            <input {[ if (o.filter_text) { ]} value="{{{o.filter_text}}}" {[ } ]}
                 class="roster-filter form-control {[ if (o.filter_type === 'state') { ]} hidden {[ } ]}"
                 placeholder="{{{o.placeholder}}}">
             <span class="clear-input fa fa-times {[ if (!o.filter_text) { ]} hidden {[ } ]}"></span>

tests/runner.js

@@ -32,7 +32,7 @@ require.config(config);
 
 var specs = [
     "jasmine",
-    //"spec/transcripts",
+    "spec/transcripts",
     "spec/spoilers",
     "spec/profiling",
     "spec/utils",