menubuttonrenderer_test.js 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143
  1. // Copyright 2008 The Closure Library Authors. All Rights Reserved.
  2. //
  3. // Licensed under the Apache License, Version 2.0 (the "License");
  4. // you may not use this file except in compliance with the License.
  5. // You may obtain a copy of the License at
  6. //
  7. // http://www.apache.org/licenses/LICENSE-2.0
  8. //
  9. // Unless required by applicable law or agreed to in writing, software
  10. // distributed under the License is distributed on an "AS-IS" BASIS,
  11. // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  12. // See the License for the specific language governing permissions and
  13. // limitations under the License.
  14. goog.provide('goog.ui.style.app.MenuButtonRendererTest');
  15. goog.setTestOnly('goog.ui.style.app.MenuButtonRendererTest');
  16. goog.require('goog.dom');
  17. goog.require('goog.testing.jsunit');
  18. goog.require('goog.testing.ui.style');
  19. goog.require('goog.ui.Component');
  20. goog.require('goog.ui.MenuButton');
  21. goog.require('goog.ui.style.app.MenuButtonRenderer');
  22. var renderer = goog.ui.style.app.MenuButtonRenderer.getInstance();
  23. var button;
  24. // Write iFrame tag to load reference FastUI markup. Then, our tests will
  25. // compare the generated markup to the reference markup.
  26. var refPath = '../../../../../webutil/css/fastui/app/menubutton_spec.html';
  27. goog.testing.ui.style.writeReferenceFrame(refPath);
  28. function shouldRunTests() {
  29. // Disable tests when being run as a part of open-source repo as the button
  30. // specs are not included in closure-library.
  31. return !(/closure\/goog\/ui/.test(location.pathname));
  32. }
  33. function setUp() {
  34. button = new goog.ui.MenuButton('Hello Generated', null, renderer);
  35. button.setTooltip('Click for Generated');
  36. }
  37. function tearDown() {
  38. if (button) {
  39. button.dispose();
  40. }
  41. goog.dom.removeChildren(goog.dom.getElement('sandbox'));
  42. }
  43. function testGeneratedButton() {
  44. button.render(goog.dom.getElement('sandbox'));
  45. goog.testing.ui.style.assertStructureMatchesReference(
  46. button.getElement(), 'normal-resting');
  47. assertEquals(
  48. 'Hello Generated', button.getContentElement().firstChild.nodeValue);
  49. assertEquals(
  50. 'Click for Generated', button.getElement().getAttribute('title'));
  51. }
  52. function testButtonStates() {
  53. button.render(goog.dom.getElement('sandbox'));
  54. goog.testing.ui.style.assertStructureMatchesReference(
  55. button.getElement(), 'normal-resting');
  56. button.setState(goog.ui.Component.State.HOVER, true);
  57. goog.testing.ui.style.assertStructureMatchesReference(
  58. button.getElement(), 'normal-hover');
  59. button.setState(goog.ui.Component.State.HOVER, false);
  60. button.setState(goog.ui.Component.State.FOCUSED, true);
  61. goog.testing.ui.style.assertStructureMatchesReference(
  62. button.getElement(), 'normal-focused');
  63. button.setState(goog.ui.Component.State.FOCUSED, false);
  64. button.setState(goog.ui.Component.State.ACTIVE, true);
  65. goog.testing.ui.style.assertStructureMatchesReference(
  66. button.getElement(), 'normal-active');
  67. button.setState(goog.ui.Component.State.ACTIVE, false);
  68. button.setState(goog.ui.Component.State.DISABLED, true);
  69. goog.testing.ui.style.assertStructureMatchesReference(
  70. button.getElement(), 'normal-disabled');
  71. }
  72. function testDecoratedButton() {
  73. button.decorate(goog.dom.getElement('button'));
  74. goog.testing.ui.style.assertStructureMatchesReference(
  75. button.getElement(), 'normal-resting');
  76. assertEquals(
  77. 'Hello Decorated', button.getContentElement().firstChild.nodeValue);
  78. assertEquals(
  79. 'Click for Decorated', button.getElement().getAttribute('title'));
  80. }
  81. function testDecoratedButtonBox() {
  82. button.decorate(goog.dom.getElement('button-box'));
  83. goog.testing.ui.style.assertStructureMatchesReference(
  84. button.getElement(), 'normal-resting');
  85. assertEquals(
  86. 'Hello Decorated Box', button.getContentElement().firstChild.nodeValue);
  87. assertEquals(
  88. 'Click for Decorated Box', button.getElement().getAttribute('title'));
  89. }
  90. function testExistingContentIsUsed() {
  91. button.decorate(goog.dom.getElement('button-with-dom-content'));
  92. goog.testing.ui.style.assertStructureMatchesReference(
  93. button.getElement(), 'normal-resting');
  94. // Safari 3 adds style="-webkit-user-select" to the strong tag, so we
  95. // can't simply look at the HTML.
  96. var content = button.getContentElement();
  97. assertEquals(
  98. 'Unexpected number of child nodes; expected existing number ' +
  99. 'plus one for the dropdown element',
  100. 4, content.childNodes.length);
  101. assertEquals('Unexpected tag', 'STRONG', content.childNodes[0].tagName);
  102. assertEquals(
  103. 'Unexpected text content', 'Hello Strong',
  104. content.childNodes[0].innerHTML);
  105. assertEquals('Unexpected tag', 'EM', content.childNodes[2].tagName);
  106. assertEquals(
  107. 'Unexpected text content', 'Box', content.childNodes[2].innerHTML);
  108. }
  109. function testDecoratedButtonWithMenu() {
  110. button.decorate(goog.dom.getElement('button-with-menu'));
  111. assertEquals('Unexpected number of menu items', 2, button.getItemCount());
  112. goog.testing.ui.style.assertStructureMatchesReference(
  113. button.getElement(), 'normal-resting');
  114. assertFalse(
  115. 'Expected menu element to not be contained by button',
  116. goog.dom.contains(button.getElement(), button.getMenu().getElement()));
  117. }
  118. function testDropDownExistsAfterButtonRename() {
  119. button.decorate(goog.dom.getElement('button-2'));
  120. button.setContent('New title');
  121. goog.testing.ui.style.assertStructureMatchesReference(
  122. button.getElement(), 'normal-resting');
  123. assertEquals(
  124. 'Unexpected number of child nodes; expected text element ' +
  125. 'and the dropdown element',
  126. 2, button.getContentElement().childNodes.length);
  127. assertEquals('New title', button.getContentElement().firstChild.nodeValue);
  128. assertEquals(
  129. 'Click for Decorated', button.getElement().getAttribute('title'));
  130. }