Bug 1142514: add tests for the context views in the Loop conversation window. r=Standard8
authorMike de Boer <mdeboer@mozilla.com>
Tue, 21 Apr 2015 12:07:02 +0200
changeset 240090 d7b5d8ab603415137a9c77bfc82d32efbd42d61b
parent 240089 7ca87bde48a4e9712b1ccaee20532cbff9fffa20
child 240091 504612c13764271ead3e1d98a1d0f78b657e7044
push id12487
push usermdeboer@mozilla.com
push dateTue, 21 Apr 2015 10:16:12 +0000
treeherderfx-team@d7b5d8ab6034 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersStandard8
bugs1142514
milestone40.0a1
Bug 1142514: add tests for the context views in the Loop conversation window. r=Standard8
browser/components/loop/test/desktop-local/conversation_test.js
browser/components/loop/test/desktop-local/roomViews_test.js
browser/components/loop/test/shared/activeRoomStore_test.js
--- a/browser/components/loop/test/desktop-local/conversation_test.js
+++ b/browser/components/loop/test/desktop-local/conversation_test.js
@@ -132,17 +132,18 @@ describe("loop.conversation", function()
   describe("AppControllerView", function() {
     var conversationStore, client, ccView, dispatcher;
     var conversationAppStore, roomStore;
 
     function mountTestComponent() {
       return TestUtils.renderIntoDocument(
         React.createElement(loop.conversation.AppControllerView, {
           roomStore: roomStore,
-          dispatcher: dispatcher
+          dispatcher: dispatcher,
+          mozLoop: navigator.mozLoop
         }));
     }
 
     beforeEach(function() {
       client = new loop.Client();
       dispatcher = new loop.Dispatcher();
       conversationStore = new loop.store.ConversationStore(
         dispatcher, {
--- a/browser/components/loop/test/desktop-local/roomViews_test.js
+++ b/browser/components/loop/test/desktop-local/roomViews_test.js
@@ -3,18 +3,18 @@ var expect = chai.expect;
 /* jshint newcap:false */
 
 describe("loop.roomViews", function () {
   "use strict";
 
   var ROOM_STATES = loop.store.ROOM_STATES;
   var SCREEN_SHARE_STATES = loop.shared.utils.SCREEN_SHARE_STATES;
 
-  var sandbox, dispatcher, roomStore, activeRoomStore, fakeWindow;
-  var fakeMozLoop;
+  var sandbox, dispatcher, roomStore, activeRoomStore, fakeWindow,
+    fakeMozLoop, fakeContextURL;
 
   beforeEach(function() {
     sandbox = sinon.sandbox.create();
 
     dispatcher = new loop.Dispatcher();
 
     fakeMozLoop = {
       getAudioBlob: sinon.stub(),
@@ -43,16 +43,22 @@ describe("loop.roomViews", function () {
     activeRoomStore = new loop.store.ActiveRoomStore(dispatcher, {
       mozLoop: {},
       sdkDriver: {}
     });
     roomStore = new loop.store.RoomStore(dispatcher, {
       mozLoop: {},
       activeRoomStore: activeRoomStore
     });
+
+    fakeContextURL = {
+      description: "An invalid page",
+      location: "http://invalid.com",
+      thumbnail: "data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
+    };
   });
 
   afterEach(function() {
     sandbox.restore();
     loop.shared.mixins.setRootObject(window);
   });
 
   describe("ActiveRoomStoreMixin", function() {
@@ -98,51 +104,54 @@ describe("loop.roomViews", function () {
     beforeEach(function() {
       sandbox.stub(dispatcher, "dispatch");
     });
 
     afterEach(function() {
       view = null;
     });
 
-    function mountTestComponent() {
+    function mountTestComponent(props) {
+      props = _.extend({
+        dispatcher: dispatcher,
+        roomData: {},
+        show: true,
+        showContext: false
+      }, props);
       return TestUtils.renderIntoDocument(
-        React.createElement(
-          loop.roomViews.DesktopRoomInvitationView, {
-            dispatcher: dispatcher,
-            roomStore: roomStore
-          }));
+        React.createElement(loop.roomViews.DesktopRoomInvitationView, props));
     }
 
-    it("should dispatch an EmailRoomUrl action when the email button is " +
-      "pressed", function() {
-        view = mountTestComponent();
+    it("should dispatch an EmailRoomUrl action when the email button is pressed",
+      function() {
+        view = mountTestComponent({
+          roomData: { roomUrl: "http://invalid" }
+        });
 
-        view.setState({roomUrl: "http://invalid"});
-
-        var emailBtn = view.getDOMNode().querySelector('.btn-email');
+        var emailBtn = view.getDOMNode().querySelector(".btn-email");
 
         React.addons.TestUtils.Simulate.click(emailBtn);
 
         sinon.assert.calledOnce(dispatcher.dispatch);
         sinon.assert.calledWith(dispatcher.dispatch,
           new sharedActions.EmailRoomUrl({roomUrl: "http://invalid"}));
       });
 
     describe("Rename Room", function() {
       var roomNameBox;
 
       beforeEach(function() {
-        view = mountTestComponent();
-        view.setState({
-          roomToken: "fakeToken",
-          roomName: "fakeName"
+        view = mountTestComponent({
+          roomData: {
+            roomToken: "fakeToken",
+            roomName: "fakeName"
+          }
         });
 
-        roomNameBox = view.getDOMNode().querySelector('.input-room-name');
+        roomNameBox = view.getDOMNode().querySelector(".input-room-name");
       });
 
       it("should dispatch a RenameRoom action when the focus is lost",
         function() {
           React.addons.TestUtils.Simulate.change(roomNameBox, { target: {
             value: "reallyFake"
           }});
 
@@ -170,34 +179,34 @@ describe("loop.roomViews", function () {
               roomToken: "fakeToken",
               newRoomName: "reallyFake"
             }));
         });
     });
 
     describe("Copy Button", function() {
       beforeEach(function() {
-        view = mountTestComponent();
-
-        view.setState({roomUrl: "http://invalid"});
+        view = mountTestComponent({
+          roomData: { roomUrl: "http://invalid" }
+        });
       });
 
       it("should dispatch a CopyRoomUrl action when the copy button is " +
         "pressed", function() {
-          var copyBtn = view.getDOMNode().querySelector('.btn-copy');
+          var copyBtn = view.getDOMNode().querySelector(".btn-copy");
 
           React.addons.TestUtils.Simulate.click(copyBtn);
 
           sinon.assert.calledOnce(dispatcher.dispatch);
           sinon.assert.calledWith(dispatcher.dispatch,
             new sharedActions.CopyRoomUrl({roomUrl: "http://invalid"}));
         });
 
       it("should change the text when the url has been copied", function() {
-          var copyBtn = view.getDOMNode().querySelector('.btn-copy');
+          var copyBtn = view.getDOMNode().querySelector(".btn-copy");
 
           React.addons.TestUtils.Simulate.click(copyBtn);
 
           // copied_url_button is the l10n string.
           expect(copyBtn.textContent).eql("copied_url_button");
       });
     });
 
@@ -210,16 +219,35 @@ describe("loop.roomViews", function () {
         var shareBtn = view.getDOMNode().querySelector(".btn-share");
 
         React.addons.TestUtils.Simulate.click(shareBtn);
 
         expect(view.state.showMenu).to.eql(true);
         expect(view.refs.menu.props.show).to.eql(true);
       });
     });
+
+    describe("Context", function() {
+      it("should not render the context data when told not to", function() {
+        view = mountTestComponent();
+
+        expect(view.getDOMNode().querySelector(".room-context")).to.eql(null);
+      });
+
+      it("should render context when data is available", function() {
+        view = mountTestComponent({
+          showContext: true,
+          roomData: {
+            roomContextUrls: [fakeContextURL]
+          }
+        });
+
+        expect(view.getDOMNode().querySelector(".room-context")).to.not.eql(null);
+      });
+    });
   });
 
   describe("DesktopRoomConversationView", function() {
     var view;
 
     beforeEach(function() {
       loop.store.StoreMixin.register({
         feedbackStore: new loop.store.FeedbackStore(dispatcher, {
@@ -463,127 +491,178 @@ describe("loop.roomViews", function () {
         iconURL: "http://example.com/foo.png"
       };
     });
 
     afterEach(function() {
       view = fakeProvider = null;
     });
 
-    function mountTestComponent() {
+    function mountTestComponent(props) {
+      props = _.extend({
+        dispatcher: dispatcher,
+        show: true
+      }, props);
       return TestUtils.renderIntoDocument(
-        React.createElement(loop.roomViews.SocialShareDropdown, {
-          dispatcher: dispatcher,
-          roomStore: roomStore,
-          show: true
-        })
-      );
+        React.createElement(loop.roomViews.SocialShareDropdown, props));
     }
 
     describe("#render", function() {
       it("should show no contents when the Social Providers have not been fetched yet", function() {
         view = mountTestComponent();
 
         expect(view.getDOMNode()).to.eql(null);
       });
 
       it("should show different contents when the Share XUL button is not available", function() {
-        activeRoomStore.setStoreState({
+        view = mountTestComponent({
           socialShareProviders: []
         });
-        view = mountTestComponent();
 
         var node = view.getDOMNode();
         expect(node.querySelector(".share-panel-header")).to.not.eql(null);
       });
 
       it("should show an empty list when no Social Providers are available", function() {
-        activeRoomStore.setStoreState({
+        view = mountTestComponent({
           socialShareButtonAvailable: true,
           socialShareProviders: []
         });
 
-        view = mountTestComponent();
-
         var node = view.getDOMNode();
         expect(node.querySelector(".icon-add-share-service")).to.not.eql(null);
         expect(node.querySelectorAll(".dropdown-menu-item").length).to.eql(1);
       });
 
       it("should show a list of available Social Providers", function() {
-        activeRoomStore.setStoreState({
+        view = mountTestComponent({
           socialShareButtonAvailable: true,
           socialShareProviders: [fakeProvider]
         });
 
-        view = mountTestComponent();
-
         var node = view.getDOMNode();
         expect(node.querySelector(".icon-add-share-service")).to.not.eql(null);
         expect(node.querySelector(".dropdown-menu-separator")).to.not.eql(null);
 
         var dropdownNodes = node.querySelectorAll(".dropdown-menu-item");
         expect(dropdownNodes.length).to.eql(2);
         expect(dropdownNodes[1].querySelector("img").src).to.eql(fakeProvider.iconURL);
         expect(dropdownNodes[1].querySelector("span").textContent)
           .to.eql(fakeProvider.name);
       });
     });
 
     describe("#handleToolbarAddButtonClick", function() {
       it("should dispatch an action when the 'add to toolbar' button is clicked", function() {
-        activeRoomStore.setStoreState({
+        view = mountTestComponent({
           socialShareProviders: []
         });
 
-        view = mountTestComponent();
-
         var addButton = view.getDOMNode().querySelector(".btn-toolbar-add");
         React.addons.TestUtils.Simulate.click(addButton);
 
         sinon.assert.calledOnce(dispatcher.dispatch);
         sinon.assert.calledWithExactly(dispatcher.dispatch,
           new sharedActions.AddSocialShareButton());
       });
     });
 
     describe("#handleAddServiceClick", function() {
       it("should dispatch an action when the 'add provider' item is clicked", function() {
-        activeRoomStore.setStoreState({
+        view = mountTestComponent({
           socialShareProviders: [],
           socialShareButtonAvailable: true
         });
 
-        view = mountTestComponent();
-
         var addItem = view.getDOMNode().querySelector(".dropdown-menu-item:first-child");
         React.addons.TestUtils.Simulate.click(addItem);
 
         sinon.assert.calledOnce(dispatcher.dispatch);
         sinon.assert.calledWithExactly(dispatcher.dispatch,
           new sharedActions.AddSocialShareProvider());
       });
     });
 
     describe("#handleProviderClick", function() {
       it("should dispatch an action when a provider item is clicked", function() {
-        activeRoomStore.setStoreState({
+        view = mountTestComponent({
           roomUrl: "http://example.com",
           socialShareButtonAvailable: true,
           socialShareProviders: [fakeProvider]
         });
 
-        view = mountTestComponent();
-
         var providerItem = view.getDOMNode().querySelector(".dropdown-menu-item:last-child");
         React.addons.TestUtils.Simulate.click(providerItem);
 
         sinon.assert.calledOnce(dispatcher.dispatch);
         sinon.assert.calledWithExactly(dispatcher.dispatch,
           new sharedActions.ShareRoomUrl({
             provider: fakeProvider,
-            roomUrl: activeRoomStore.getStoreState().roomUrl,
+            roomUrl: "http://example.com",
             previews: []
           }));
       });
     });
   });
+
+  describe("DesktopRoomContextView", function() {
+    var view;
+
+    afterEach(function() {
+      view = null;
+    });
+
+    function mountTestComponent(props) {
+      props = _.extend({
+        show: true
+      }, props);
+      return TestUtils.renderIntoDocument(
+        React.createElement(loop.roomViews.DesktopRoomContextView, props));
+    }
+
+    describe("#render", function() {
+      it("should show the context information properly when available", function() {
+        view = mountTestComponent({
+          roomData: {
+            roomDescription: "Hello, is it me you're looking for?",
+            roomContextUrls: [fakeContextURL]
+          }
+        });
+
+        var node = view.getDOMNode();
+        expect(node).to.not.eql(null);
+        expect(node.querySelector(".room-context-thumbnail").src).to.
+          eql(fakeContextURL.thumbnail);
+        expect(node.querySelector(".room-context-description").textContent).to.
+          eql(fakeContextURL.description);
+        expect(node.querySelector(".room-context-comment").textContent).to.
+          eql(view.props.roomData.roomDescription);
+      });
+
+      it("should not render optional data", function() {
+        view = mountTestComponent({
+          roomData: { roomContextUrls: [fakeContextURL] }
+        });
+
+        expect(view.getDOMNode().querySelector(".room-context-comment")).to.
+          eql(null);
+      });
+
+      it("should not render the component when 'show' is false", function() {
+        view = mountTestComponent({
+          show: false
+        });
+
+        expect(view.getDOMNode()).to.eql(null);
+      });
+
+      it("should close the view when the close button is clicked", function() {
+        view = mountTestComponent({
+          roomData: { roomContextUrls: [fakeContextURL] }
+        });
+
+        var closeBtn = view.getDOMNode().querySelector(".room-context-btn-close");
+        React.addons.TestUtils.Simulate.click(closeBtn);
+        expect(view.getDOMNode()).to.eql(null);
+      });
+    })
+  });
 });
--- a/browser/components/loop/test/shared/activeRoomStore_test.js
+++ b/browser/components/loop/test/shared/activeRoomStore_test.js
@@ -277,16 +277,18 @@ describe("loop.store.ActiveRoomStore", f
           windowId: "42",
           type: "room",
           roomToken: fakeToken
         }));
 
         sinon.assert.calledTwice(dispatcher.dispatch);
         sinon.assert.calledWithExactly(dispatcher.dispatch,
           new sharedActions.SetupRoomInfo({
+            roomContextUrls: undefined,
+            roomDescription: undefined,
             roomToken: fakeToken,
             roomName: fakeRoomData.decryptedContext.roomName,
             roomOwner: fakeRoomData.roomOwner,
             roomUrl: fakeRoomData.roomUrl,
             socialShareButtonAvailable: false,
             socialShareProviders: []
           }));
       });
@@ -456,16 +458,17 @@ describe("loop.store.ActiveRoomStore", f
             roomInfoFailure: ROOM_INFO_FAILURES.DECRYPT_FAILED
           }, expectedDetails)));
       });
 
       it("should dispatch UpdateRoomInfo message with the context if decryption was successful", function() {
         fetchServerAction.cryptoKey = "fakeKey";
 
         var roomContext = {
+          description: "Never gonna let you down. Never gonna give you up...",
           roomName: "The wonderful Loopy room",
           urls: [{
             description: "An invalid page",
             location: "http://invalid.com",
             thumbnail: "data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
           }]
         };