chrome/test/data/webui/media_router/issue_banner_tests.js

   1 // Copyright 2015 The Chromium Authors. All rights reserved.
   2 // Use of this source code is governed by a BSD-style license that can be
   3 // found in the LICENSE file.
   4
   5 /** @fileoverview Suite of tests for issue-banner. */
   6 cr.define('issue_banner', function() {
   7   function registerTests() {
   8     suite('IssueBanner', function() {
   9       /**
  10        * Issue Banner created before each test.
  11        * @type {IssueBanner}
  12        */
  13       var banner;
  14
  15       /**
  16        * Fake blocking issue with an optional action created before
  17        * each test.
  18        * @type {media_router.Issue}
  19        */
  20       var fakeBlockingIssueOne;
  21
  22       /**
  23        * Fake blocking issue without an optional action created before
  24        * each test.
  25        * @type {media_router.Issue}
  26        */
  27       var fakeBlockingIssueTwo;
  28
  29       /**
  30        * Fake non-blocking issue with an optional action created before
  31        * each test.
  32        * @type {media_router.Issue}
  33        */
  34       var fakeNonBlockingIssueOne;
  35
  36       /**
  37        * Fake non-blocking issue without an optional action created before
  38        * each test.
  39        * @type {media_router.Issue}
  40        */
  41       var fakeNonBlockingIssueTwo;
  42
  43       // Checks whether the 'issue-action-click' event was fired with the
  44       // expected data.
  45       var checkDataFromEventFiring = function(issue, data, isDefault) {
  46         assertEquals(issue.id, data.detail.id);
  47         if (isDefault)
  48           assertEquals(issue.defaultActionType, data.detail.actionType);
  49         else
  50           assertEquals(issue.secondaryActionType, data.detail.actionType);
  51         assertEquals(issue.helpPageId, data.detail.helpPageId);
  52       };
  53
  54       // Checks whether |expected| and the text in the |elementId| element
  55       // are equal.
  56       var checkElementText = function(expected, elementId) {
  57         assertEquals(expected.trim(), banner.$[elementId].textContent.trim());
  58       };
  59
  60       // Checks whether |issue| title and message are equal with the title
  61       // and message text in the UI.
  62       var checkIssueText = function(issue) {
  63         if (issue) {
  64           checkElementText(issue.title, 'blocking-issue-title');
  65           checkElementText(issue.message, 'blocking-issue-message');
  66           checkElementText(issue.message, 'non-blocking-message');
  67
  68           checkElementText(loadTimeData.getString(
  69               banner.issueActionTypeToButtonTextResource_[
  70                   issue.defaultActionType]), 'blocking-default');
  71           checkElementText(loadTimeData.getString(
  72               banner.issueActionTypeToButtonTextResource_[
  73                   issue.defaultActionType]), 'non-blocking-default');
  74
  75           if (issue.secondaryActionType) {
  76             checkElementText(loadTimeData.getString(
  77                 banner.issueActionTypeToButtonTextResource_[
  78                     issue.secondaryActionType]), 'blocking-opt');
  79             checkElementText(loadTimeData.getString(
  80                 banner.issueActionTypeToButtonTextResource_[
  81                     issue.secondaryActionType]), 'non-blocking-opt');
  82           }
  83         } else {
  84           checkElementText('', 'blocking-issue-title');
  85           checkElementText('', 'blocking-issue-message');
  86           checkElementText('', 'non-blocking-message');
  87           checkElementText('', 'blocking-default');
  88           checkElementText('', 'non-blocking-default');
  89         }
  90       };
  91
  92       // Checks whether parts of the UI is visible.
  93       var checkVisibility = function(isBlocking, hasOptAction) {
  94         assertEquals(!isBlocking, banner.$['blocking-issue'].hidden);
  95         assertEquals(isBlocking, banner.$['non-blocking-issue'].hidden);
  96         if (isBlocking) {
  97           assertEquals(!hasOptAction, banner.$['blocking-issue-buttons']
  98               .querySelector('paper-button').hidden);
  99         } else {
 100           assertEquals(!hasOptAction, banner.$['non-blocking-issue']
 101               .querySelector('span').hidden);
 102         }
 103       };
 104
 105       // Import issue_banner.html before running suite.
 106       suiteSetup(function() {
 107         return PolymerTest.importHtml(
 108             'chrome://media-router/elements/issue_banner/' +
 109             'issue_banner.html');
 110       });
 111
 112       // Initialize an issue-banner before each test.
 113       setup(function(done) {
 114         PolymerTest.clearBody();
 115         banner = document.createElement('issue-banner');
 116         document.body.appendChild(banner);
 117
 118         // Initialize issues.
 119         fakeBlockingIssueOne = new media_router.Issue(
 120             'issue id 1', 'Issue Title 1', 'Issue Message 1', 0, 1,
 121             'route id 1', true, 1234);
 122         fakeBlockingIssueTwo = new media_router.Issue(
 123             'issue id 2', 'Issue Title 2', 'Issue Message 2', 0, null,
 124             'route id 2', true, 1234);
 125         fakeNonBlockingIssueOne = new media_router.Issue(
 126             'issue id 3', 'Issue Title 3', 'Issue Message 3', 0, 1,
 127             'route id 3', false, 1234);
 128         fakeNonBlockingIssueTwo = new media_router.Issue(
 129             'issue id 4', 'Issue Title 4', 'Issue Message 4', 0, null,
 130             'route id 4', false, 1234);
 131
 132         // Allow for the issue banner to be created and attached.
 133         setTimeout(done);
 134       });
 135
 136       // Tests for 'issue-action-click' event firing when a blocking issue
 137       // default action is clicked.
 138       test('blocking issue default action click', function(done) {
 139         banner.issue = fakeBlockingIssueOne;
 140         banner.addEventListener('issue-action-click', function(data) {
 141           checkDataFromEventFiring(fakeBlockingIssueOne,
 142               data, true);
 143           done();
 144         });
 145         MockInteractions.tap(banner.$['blocking-default']);
 146       });
 147
 148       // Tests for 'issue-action-click' event firing when a blocking issue
 149       // optional action is clicked.
 150       test('blocking issue optional action click', function(done) {
 151         banner.issue = fakeBlockingIssueOne;
 152         banner.addEventListener('issue-action-click', function(data) {
 153           checkDataFromEventFiring(fakeBlockingIssueOne,
 154               data, false);
 155           done();
 156         });
 157         MockInteractions.tap(banner.$['blocking-opt']);
 158       });
 159
 160       // Tests for 'issue-action-click' event firing when a non-blocking issue
 161       // default action is clicked.
 162       test('non-blocking issue default action click', function(done) {
 163         banner.issue = fakeNonBlockingIssueOne;
 164         banner.addEventListener('issue-action-click', function(data) {
 165           checkDataFromEventFiring(fakeNonBlockingIssueOne,
 166               data, true);
 167           done();
 168         });
 169         MockInteractions.tap(banner.$['non-blocking-default']);
 170       });
 171
 172       // Tests for 'issue-action-click' event firing when a non-blocking issue
 173       // optional action is clicked.
 174       test('non-blocking issue optional action click', function(done) {
 175         banner.issue = fakeNonBlockingIssueOne;
 176         banner.addEventListener('issue-action-click', function(data) {
 177           checkDataFromEventFiring(fakeNonBlockingIssueOne,
 178               data, false);
 179           done();
 180         });
 181         MockInteractions.tap(banner.$['non-blocking-opt']);
 182       });
 183
 184       // Tests the issue text. While the UI will show only the blocking or
 185       // non-blocking interface, the issue's info will be set if specified.
 186       test('issue text', function() {
 187         // |issue| is null. Title and message text should be empty.
 188         assertEquals(null, banner.issue);
 189         checkIssueText(banner.issue);
 190
 191         // Set |issue| to be a blocking issue. Title and message text should
 192         // be updated.
 193         banner.issue = fakeBlockingIssueOne;
 194         checkIssueText(banner.issue);
 195
 196         // Set |issue| to be a non-blocking issue. Title and message text
 197         // should be updated.
 198         banner.issue = fakeNonBlockingIssueOne;
 199         checkIssueText(banner.issue);
 200       });
 201
 202       // Tests whether parts of the issue-banner is hidden based on the
 203       // current state.
 204       test('hidden versus visible components', function() {
 205         // The blocking UI should be shown along with an optional action.
 206         banner.issue = fakeBlockingIssueOne;
 207         checkVisibility(fakeBlockingIssueOne.isBlocking,
 208             fakeBlockingIssueOne.secondaryActionType);
 209
 210         // The blocking UI should be shown with no an optional action.
 211         banner.issue = fakeBlockingIssueTwo;
 212         checkVisibility(fakeBlockingIssueTwo.isBlocking,
 213             fakeBlockingIssueTwo.secondaryActionType);
 214
 215         // The non-blocking UI should be shown along with an optional action.
 216         banner.issue = fakeNonBlockingIssueOne;
 217         checkVisibility(fakeNonBlockingIssueOne.isBlocking,
 218             fakeNonBlockingIssueOne.secondaryActionType);
 219
 220         // The non-blocking UI should be shown with no an optional action.
 221         banner.issue = fakeNonBlockingIssueTwo;
 222         checkVisibility(fakeNonBlockingIssueTwo.isBlocking,
 223             fakeNonBlockingIssueTwo.secondaryActionType);
 224       });
 225     });
 226   }
 227
 228   return {
 229     registerTests: registerTests,
 230   };
 231 });