remoting/webapp/unittests/menu_button_unittest.js

   1 // Copyright 2014 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 (function() {
   6
   7 'use strict';
   8
   9 var onShow = null;
  10 var onHide = null;
  11 var menuButton = null;
  12
  13 module('MenuButton', {
  14   setup: function() {
  15     var fixture = document.getElementById('qunit-fixture');
  16     fixture.innerHTML =
  17         '<span class="menu-button" id="menu-button-container">' +
  18           '<button class="menu-button-activator">Click me</button>' +
  19           '<ul>' +
  20             '<li id="menu-option-1">Option 1</li>' +
  21           '</ul>' +
  22         '</span>';
  23     onShow = sinon.spy();
  24     onHide = sinon.spy();
  25     menuButton = new remoting.MenuButton(
  26         document.getElementById('menu-button-container'),
  27         onShow, onHide);
  28   },
  29   teardown: function() {
  30     onShow = null;
  31     onHide = null;
  32     menuButton = null;
  33   }
  34 });
  35
  36 test('should display on click', function() {
  37   var menu = menuButton.menu();
  38   ok(menu.offsetWidth == 0 && menu.offsetHeight == 0);
  39   menuButton.button().click();
  40   ok(menu.offsetWidth != 0 && menu.offsetHeight != 0);
  41 });
  42
  43 test('should dismiss when the menu is clicked', function() {
  44   var menu = menuButton.menu();
  45   menuButton.button().click();
  46   menu.click();
  47   ok(menu.offsetWidth == 0 && menu.offsetHeight == 0);
  48 });
  49
  50 test('should dismiss when anything outside the menu is clicked', function() {
  51   var menu = menuButton.menu();
  52   menuButton.button().click();
  53   var x = menu.offsetRight + 1;
  54   var y = menu.offsetBottom + 1;
  55   var notMenu = document.elementFromPoint(x, y);
  56   base.debug.assert(notMenu != menu);
  57   notMenu.click();
  58   ok(menu.offsetWidth == 0 && menu.offsetHeight == 0);
  59 });
  60
  61 test('should dismiss when menu item is clicked', function() {
  62   var menu = menuButton.menu();
  63   menuButton.button().click();
  64   var element = document.getElementById('menu-option-1');
  65   element.click();
  66   ok(menu.offsetWidth == 0 && menu.offsetHeight == 0);
  67 });
  68
  69 test('should invoke callbacks', function() {
  70   ok(!onShow.called);
  71   menuButton.button().click();
  72   ok(onShow.called);
  73   ok(!onHide.called);
  74   menuButton.menu().click();
  75   ok(onHide.called);
  76 });
  77
  78 test('select method should set/unset background image', function() {
  79   var element = document.getElementById('menu-option-1');
  80   var style = window.getComputedStyle(element);
  81   ok(style.backgroundImage == 'none');
  82   remoting.MenuButton.select(element, true);
  83   style = window.getComputedStyle(element);
  84   ok(style.backgroundImage != 'none');
  85   remoting.MenuButton.select(element, false);
  86   style = window.getComputedStyle(element);
  87   ok(style.backgroundImage == 'none');
  88 });
  89
  90 }());