Fix tests after all the refactoring...

converse.css

@@ -356,7 +356,6 @@ span.spinner.hor_centered {
     padding: 4px 8px;
     margin-right: 5px;
     color: white;
-    display: none;
 }
 
 #connecting-to-chat {

converse.js

@@ -866,7 +866,7 @@
 
                 this.updateVCard();
                 this.$el.appendTo(converse.chatboxesview.$el);
-                this.render().show().model.messages.fetch({add: true});
+                this.render().show().focus().model.messages.fetch({add: true});
 
                 if (this.model.get('status')) {
                     this.showStatusMessage(this.model.get('status'));
@@ -897,6 +897,7 @@
                         )
                     );
                 this.renderToolbar().renderAvatar();
+                converse.emit('onChatBoxOpened', this);
                 return this;
             },
 
@@ -1391,6 +1392,7 @@
 
             focus: function () {
                 this.$el.find('.chat-textarea').focus();
+                converse.emit('onChatBoxFocused', this);
                 return this;
             },
 
@@ -1404,14 +1406,13 @@
 
             show: function (callback) {
                 if (this.$el.is(':visible') && this.$el.css('opacity') == "1") {
-                    converse.emit('onChatBoxFocused', this);
-                    return this.focus();
+                    return this;
                 }
                 if (converse.animate) {
-                    this.$el.css({'opacity': 0, 'display': 'inline'}).animate({opacity: '1'}, 200, null, callback);
+                    this.$el.show(callback);
                 } else {
-                    this.$el.css({'opacity': 1, 'display': 'inline'});
-                    callback();
+                    this.$el.show();
+                    if (typeof callback === 'function') { callback(); }
                 }
                 if (converse.connection) {
                     // Without a connection, we haven't yet initialized
@@ -1779,6 +1780,7 @@
 
             hide: function (callback) {
                 this.$el.hide('fast', function () {
+                    converse.emit('onChatBoxClosed', this);
                     converse.controlboxtoggle.show(function () {
                         if (typeof callback === "function") {
                             callback();
@@ -1872,6 +1874,28 @@
             },
             is_chatroom: true,
 
+            initialize: function () {
+                this.connect(null);
+                this.model.messages.on('add', this.onMessageAdded, this);
+                this.model.on('destroy', function (model, response, options) {
+                    this.hide();
+                    converse.connection.muc.leave(
+                        this.model.get('jid'),
+                        this.model.get('nick'),
+                        $.proxy(this.onLeave, this),
+                        undefined);
+                },
+                this);
+                this.$el.appendTo(converse.chatboxesview.$el);
+                this.render().show().model.messages.fetch({add: true});
+            },
+
+            render: function () {
+                this.$el.attr('id', this.model.get('box_id'))
+                        .html(converse.templates.chatroom(this.model.toJSON()));
+                return this;
+            },
+
             sendChatRoomMessage: function (body) {
                 var match = body.replace(/^\s*/, "").match(/^\/(.*?)(?: (.*))?$/) || [false],
                     $chat_content;
@@ -1915,12 +1939,6 @@
                 }
             },
 
-            render: function () {
-                this.$el.attr('id', this.model.get('box_id'))
-                        .html(converse.templates.chatroom(this.model.toJSON()));
-                return this;
-            },
-
             renderChatArea: function () {
                 if (!this.$el.find('.chat-area').length) {
                     this.$el.find('.chat-body').empty().append(
@@ -1951,22 +1969,6 @@
                 }
             },
 
-            initialize: function () {
-                this.connect(null);
-                this.model.messages.on('add', this.onMessageAdded, this);
-                this.model.on('destroy', function (model, response, options) {
-                    this.hide();
-                    converse.connection.muc.leave(
-                        this.model.get('jid'),
-                        this.model.get('nick'),
-                        $.proxy(this.onLeave, this),
-                        undefined);
-                },
-                this);
-                this.$el.appendTo(converse.chatboxesview.$el);
-                this.render().show().model.messages.fetch({add: true});
-            },
-
             onLeave: function () {
                 this.model.set('connected', false);
             },
@@ -3391,11 +3393,15 @@
             },
 
             render: function () {
-                $('#conversejs').append(this.$el.html(
+                var toggle = this.$el.html(
                     converse.templates.controlbox_toggle({
                         'label_toggle': __('Toggle chat')
                     })
-                ));
+                );
+                if (converse.show_controlbox_by_default) {
+                    toggle.hide(); // It's either or
+                }
+                $('#conversejs').append(toggle);
                 return this;
             },
 

index.html

@@ -7,8 +7,8 @@
     <meta name="description" content="Converse.js: Open Source Browser-Based Instant Messaging" />
     <link rel="stylesheet" type="text/css" media="screen" href="stylesheets/stylesheet.css">
     <link rel="stylesheet" type="text/css" media="screen" href="converse.css">
-    <!--<script data-main="main" src="components/requirejs/require.js"></script>-->
-    <script src="builds/converse.min.js"></script>
+    <script data-main="main" src="components/requirejs/require.js"></script>
+    <!-- <script src="builds/converse.min.js"></script> -->
     <title>Converse.js</title>
 </head>
 

spec/chatbox.js

@@ -10,17 +10,23 @@
     return describe("Chatboxes", $.proxy(function(mock, utils) {
         describe("A Chatbox", $.proxy(function () {
             beforeEach(function () {
+                runs(function () {
                     utils.closeAllChatBoxes();
                     utils.removeControlBox();
+                });
+                waits(250);
+                runs(function () {
                     converse.roster.localStorage._clear();
                     utils.initConverse();
                     utils.createCurrentContacts();
                     utils.openControlBox();
+                });
+                waits(250);
+                runs(function () {
                     utils.openContactsPanel();
                 });
-
-            afterEach(function () {
-                utils.closeAllChatBoxes();
+                waits(250);
+                runs(function () {});
             });
 
             it("is created when you click on a roster item", $.proxy(function () {
@@ -44,10 +50,12 @@
 
             it("can be saved to, and retrieved from, localStorage", $.proxy(function () {
                 spyOn(converse, 'emit');
+                runs(function () {
                     utils.closeControlBox();
+                });
+                waits(250);
+                runs(function () {
                     expect(converse.emit).toHaveBeenCalledWith('onChatBoxClosed', jasmine.any(Object));
-
-                // First, we open 6 more chatboxes (controlbox is already open)
                     utils.openChatBoxes(6);
                     // We instantiate a new ChatBoxes collection, which by default
                     // will be empty.
@@ -66,32 +74,43 @@
                         expect(_.isEqual(new_attrs, old_attrs)).toEqual(true);
                     }
                     this.rosterview.render();
+                }.bind(converse));
             }, converse));
 
             it("can be closed again by clicking a DOM element with class 'close-chatbox-button'", $.proxy(function () {
                 spyOn(converse, 'emit');
-                var chatbox, view, $el,
-                    num_open_chats = this.chatboxes.length;
-                for (i=0; i<num_open_chats; i++) {
-                    chatbox = this.chatboxes.models[0];
-                    view = this.chatboxesview.views[chatbox.get('id')];
+                var view = this.chatboxesview.views.controlbox; // The controlbox is currently open
                 spyOn(view, 'closeChat').andCallThrough();
                 view.delegateEvents(); // We need to rebind all events otherwise our spy won't be called
+
+                runs(function () {
                     view.$el.find('.close-chatbox-button').click();
+                });
+                waits(250);
+                runs(function () {
                     expect(view.closeChat).toHaveBeenCalled();
                     expect(converse.emit).toHaveBeenCalledWith('onChatBoxClosed', jasmine.any(Object));
-                }
+                });
+                // TODO: Open a normal chatbox and close it again...
             }, converse));
 
             it("will be removed from localStorage when closed", $.proxy(function () {
                 spyOn(converse, 'emit');
                 this.chatboxes.localStorage._clear();
+                runs(function () {
                     utils.closeControlBox();
+                });
+                waits(250);
+                runs(function () {
+                    expect(converse.emit).toHaveBeenCalledWith('onChatBoxClosed', jasmine.any(Object));
                     expect(converse.chatboxes.length).toEqual(0);
                     utils.openChatBoxes(6);
                     expect(converse.chatboxes.length).toEqual(6);
                     expect(converse.emit).toHaveBeenCalledWith('onChatBoxOpened', jasmine.any(Object));
                     utils.closeAllChatBoxes();
+                });
+                waits(250);
+                runs(function () {
                     expect(converse.chatboxes.length).toEqual(0);
                     expect(converse.emit).toHaveBeenCalledWith('onChatBoxClosed', jasmine.any(Object));
                     var newchatboxes = new this.ChatBoxes();
@@ -101,6 +120,7 @@
                     // in localStorage either.
                     newchatboxes.onConnected();
                     expect(newchatboxes.length).toEqual(0);
+                }.bind(converse));
             }, converse));
 
             describe("A chat toolbar", $.proxy(function () {
@@ -341,8 +361,12 @@
                 it("can be sent from a chatbox, and will appear inside it", $.proxy(function () {
                     spyOn(converse, 'emit');
                     var contact_jid = mock.cur_names[0].replace(' ','.').toLowerCase() + '@localhost';
+                    runs(function () {
                         utils.openChatBoxFor(contact_jid);
-                    expect(converse.emit).toHaveBeenCalledWith('onChatBoxOpened', jasmine.any(Object));
+                    });
+                    waits(250);
+                    runs(function () {
+                        expect(converse.emit).toHaveBeenCalledWith('onChatBoxFocused', jasmine.any(Object));
                         var view = this.chatboxesview.views[contact_jid];
                         var message = 'This message is sent from this chatbox';
                         spyOn(view, 'sendMessage').andCallThrough();
@@ -350,10 +374,10 @@
                         view.$el.find('textarea.chat-textarea').trigger($.Event('keypress', {keyCode: 13}));
                         expect(view.sendMessage).toHaveBeenCalled();
                         expect(view.model.messages.length, 2);
-                    expect(converse.emit.callCount).toEqual(2);
                         expect(converse.emit.mostRecentCall.args, ['onMessageSend', message]);
                         var txt = view.$el.find('.chat-content').find('.chat-message').last().find('.chat-message-content').text();
                         expect(txt).toEqual(message);
+                    }.bind(converse));
                 }, converse));
 
                 it("are sanitized to prevent Javascript injection attacks", $.proxy(function () {

spec/chatroom.js

@@ -10,12 +10,35 @@
     return describe("ChatRooms", $.proxy(function (mock, utils) {
         describe("A Chat Room", $.proxy(function () {
             beforeEach(function () {
+                runs(function () {
                     utils.closeAllChatBoxes();
-                utils.createNewChatRoom('lounge', 'dummy');
                 });
-
-            afterEach(function () {
-                utils.closeAllChatBoxes();
+                waits(250);
+                runs(function () {
+                    utils.openControlBox();
+                });
+                waits(250);
+                runs(function () {
+                    utils.openRoomsPanel();
+                });
+                waits(300);
+                runs(function () {
+                    // Open a new chatroom
+                    var roomspanel = converse.chatboxesview.views.controlbox.roomspanel;
+                    var $input = roomspanel.$el.find('input.new-chatroom-name');
+                    var $nick = roomspanel.$el.find('input.new-chatroom-nick');
+                    var $server = roomspanel.$el.find('input.new-chatroom-server');
+                    $input.val('lounge');
+                    $nick.val('dummy');
+                    $server.val('muc.localhost');
+                    roomspanel.$el.find('form').submit();
+                });
+                waits(250);
+                runs(function () {
+                    utils.closeControlBox();
+                });
+                waits(250);
+                runs(function () {});
             });
 
             it("shows users currently present in the room", $.proxy(function () {
@@ -115,10 +138,15 @@
                 spyOn(converse, 'emit');
                 spyOn(converse.connection.muc, 'leave');
                 view.delegateEvents(); // We need to rebind all events otherwise our spy won't be called
+                runs(function () {
                     view.$el.find('.close-chatbox-button').click();
+                });
+                waits(250);
+                runs(function () {
                     expect(view.closeChat).toHaveBeenCalled();
-                expect(converse.connection.muc.leave).toHaveBeenCalled();
-                expect(converse.emit).toHaveBeenCalledWith('onChatBoxClosed', jasmine.any(Object));
+                    expect(this.connection.muc.leave).toHaveBeenCalled();
+                    expect(this.emit).toHaveBeenCalledWith('onChatBoxClosed', jasmine.any(Object));
+                }.bind(converse));
             }, converse));
         }, converse));
 

spec/controlbox.js

@@ -8,26 +8,31 @@
     );
 } (this, function (mock, utils) {
     describe("The Control Box", $.proxy(function (mock, utils) {
-        window.localStorage.clear();
 
-        it("is not shown by default", $.proxy(function () {
-            expect(this.rosterview.$el.is(':visible')).toEqual(false);
-        }, converse));
-
-        var open_controlbox = $.proxy(function () {
+        it("can be opened by clicking a DOM element with class 'toggle-online-users'", $.proxy(function () {
+            runs(function () {
+                utils.closeControlBox();
+            });
+            waits(250);
+            runs(function () {
                 // This spec will only pass if the controlbox is not currently
                 // open yet.
                 expect($("div#controlbox").is(':visible')).toBe(false);
                 spyOn(this.controlboxtoggle, 'onClick').andCallThrough();
                 spyOn(this.controlboxtoggle, 'showControlBox').andCallThrough();
+                spyOn(converse, 'emit');
                 // Redelegate so that the spies are now registered as the event handlers (specifically for 'onClick')
                 this.controlboxtoggle.delegateEvents();
                 $('.toggle-online-users').click();
+            }.bind(converse));
+            waits(250);
+            runs(function () {
                 expect(this.controlboxtoggle.onClick).toHaveBeenCalled();
                 expect(this.controlboxtoggle.showControlBox).toHaveBeenCalled();
+                expect(this.emit).toHaveBeenCalledWith('onControlBoxOpened', jasmine.any(Object));
                 expect($("div#controlbox").is(':visible')).toBe(true);
-        }, converse);
-        it("can be opened by clicking a DOM element with class 'toggle-online-users'", open_controlbox);
+            }.bind(converse));
+        }, converse));
 
         describe("The Status Widget", $.proxy(function () {
             it("shows the user's chat status, which is online by default", $.proxy(function () {
@@ -88,14 +93,21 @@
                 });
             }, converse));
         }, converse));
-    }, converse, utils, mock));
+    }, converse, mock, utils));
 
-    describe("The Contacts Roster", $.proxy(function (utils, mock) {
+    describe("The Contacts Roster", $.proxy(function (mock, utils) {
         describe("Pending Contacts", $.proxy(function () {
             beforeEach(function () {
+                runs(function () {
                     utils.openControlBox();
+                });
+                waits(250);
+                runs(function () {
                     utils.openContactsPanel();
                 });
+                waits(250);
+                runs(function () {});
+            });
 
             it("do not have a heading if there aren't any", $.proxy(function () {
                 expect(this.rosterview.$el.find('dt#pending-xmpp-contacts').css('display')).toEqual('none');
@@ -132,7 +144,7 @@
                 runs($.proxy(function () {
                     view.$el.find('.remove-xmpp-contact').click();
                 }, converse));
-                waits(500);
+                waits(250);
                 runs($.proxy(function () {
                     expect(window.confirm).toHaveBeenCalled();
                     expect(this.connection.roster.remove).toHaveBeenCalled();
@@ -177,8 +189,15 @@
 
         describe("Existing Contacts", $.proxy(function () {
             beforeEach($.proxy(function () {
+                runs(function () {
                     utils.openControlBox();
+                });
+                waits(250);
+                runs(function () {
                     utils.openContactsPanel();
+                });
+                waits(250);
+                runs(function () {});
             }, converse));
 
             it("do not have a heading if there aren't any", $.proxy(function () {
@@ -437,9 +456,9 @@
                 }
             }, converse));
         }, converse));
-    }, converse, utils, mock));
+    }, converse, mock, utils));
 
-    describe("The 'Add Contact' widget", $.proxy(function (utils, mock) {
+    describe("The 'Add Contact' widget", $.proxy(function (mock, utils) {
         it("opens up an add form when you click on it", $.proxy(function () {
             var panel = this.chatboxesview.views.controlbox.contactspanel;
             spyOn(panel, 'toggleContactForm').andCallThrough();
@@ -450,12 +469,19 @@
             panel.$el.find('a.toggle-xmpp-contact-form').click();
         }, converse));
 
-    }, converse, utils, mock));
+    }, converse, mock, utils));
 
     describe("The Controlbox Tabs", $.proxy(function () {
         beforeEach($.proxy(function () {
+            runs(function () {
                 utils.closeAllChatBoxes();
+            });
+            waits(250);
+            runs(function () {
                 utils.openControlBox();
+            });
+            waits(250);
+            runs(function () {});
         }, converse));
 
         it("contains two tabs, 'Contacts' and 'ChatRooms'", $.proxy(function () {
@@ -468,10 +494,17 @@
             expect($panels.children().last().is(':visible')).toBe(false);
         }, converse));
 
-        describe("The Chatrooms Panel", $.proxy(function () {
+        describe("chatrooms panel", $.proxy(function () {
             beforeEach($.proxy(function () {
+                runs(function () {
                     utils.closeAllChatBoxes();
+                });
+                waits(250);
+                runs(function () {
                     utils.openControlBox();
+                });
+                waits(250);
+                runs(function () {});
             }, converse));
 
             it("is opened by clicking the 'Chatrooms' tab", $.proxy(function () {

tests/utils.js

@@ -42,20 +42,26 @@
     };
 
     utils.openControlBox = function () {
+        var toggle = $(".toggle-online-users");
         if (!$("#controlbox").is(':visible')) {
-            $('.toggle-online-users').click();
+            if (!toggle.is(':visible')) {
+                toggle.show(toggle.click);
+            } else {
+                toggle.click();
+            }
         }
         return this;
     };
 
     utils.closeControlBox = function () {
         if ($("#controlbox").is(':visible')) {
-            $('.toggle-online-users').click();
+            $("#controlbox").find(".close-chatbox-button").click();
         }
         return this;
     };
 
     utils.removeControlBox = function () {
+        converse.controlboxtoggle.show();
         $('#controlbox').remove();
     };
 
@@ -89,23 +95,6 @@
         view.model.messages.reset().localStorage._clear();
     };
 
-    utils.createNewChatRoom = function (room, nick) {
-        var controlbox_was_visible = $("#controlbox").is(':visible');
-        utils.openControlBox();
-        utils.openRoomsPanel();
-        var roomspanel = converse.chatboxesview.views.controlbox.roomspanel;
-        var $input = roomspanel.$el.find('input.new-chatroom-name');
-        var $nick = roomspanel.$el.find('input.new-chatroom-nick');
-        var $server = roomspanel.$el.find('input.new-chatroom-server');
-        $input.val('lounge');
-        $nick.val('dummy');
-        $server.val('muc.localhost');
-        roomspanel.$el.find('form').submit();
-        if (!controlbox_was_visible) {
-            utils.closeControlBox();
-        }
-    };
-
     utils.createCurrentContacts = function () {
         // Create current (as opposed to requesting or pending) contacts
         // for the user's roster.