wheelhandler_test.js 9.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302
  1. // Copyright 2014 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.events.WheelHandlerTest');
  15. goog.setTestOnly('goog.events.WheelHandlerTest');
  16. goog.require('goog.dom');
  17. goog.require('goog.events');
  18. goog.require('goog.events.BrowserEvent');
  19. goog.require('goog.events.WheelEvent');
  20. goog.require('goog.events.WheelHandler');
  21. goog.require('goog.string');
  22. goog.require('goog.testing.PropertyReplacer');
  23. goog.require('goog.testing.events');
  24. goog.require('goog.testing.jsunit');
  25. goog.require('goog.userAgent');
  26. goog.require('goog.userAgent.product');
  27. var log;
  28. var stubs = new goog.testing.PropertyReplacer();
  29. var PREFERRED_TYPE = 'wheel';
  30. var LEGACY_TYPE = 'mousewheel';
  31. var GECKO_TYPE = 'DOMMouseScroll';
  32. var HORIZONTAL = 'h';
  33. var VERTICAL = 'v';
  34. var DeltaMode = goog.events.WheelEvent.DeltaMode;
  35. var mouseWheelEvent;
  36. var mouseWheelEventRtl;
  37. var mouseWheelHandler;
  38. var mouseWheelHandlerRtl;
  39. function setUpPage() {
  40. log = goog.dom.getElement('log');
  41. }
  42. function setUp() {
  43. stubs.remove(goog, 'userAgent');
  44. goog.userAgent = {
  45. product: {
  46. CHROME: false,
  47. version: 0,
  48. isVersion: function(version) {
  49. return goog.string.compareVersions(this.version, version) >= 0;
  50. }
  51. },
  52. GECKO: false,
  53. IE: false,
  54. version: 0,
  55. isVersionOrHigher: function(version) {
  56. return goog.string.compareVersions(this.version, version) >= 0;
  57. }
  58. };
  59. }
  60. function tearDown() {
  61. stubs.reset();
  62. goog.dispose(mouseWheelHandler);
  63. goog.dispose(mouseWheelHandlerRtl);
  64. mouseWheelHandlerRtl = null;
  65. mouseWheelHandler = null;
  66. mouseWheelEvent = null;
  67. mouseWheelEventRtl = null;
  68. }
  69. function tearDownPage() {
  70. // Create interactive demo.
  71. mouseWheelHandler = new goog.events.WheelHandler(document.body);
  72. goog.events.listen(
  73. mouseWheelHandler, goog.events.WheelEvent.EventType.WHEEL, function(e) {
  74. log.innerHTML += goog.string.subs(
  75. '<br />(deltaX, deltaY): (%s, %s)', e.deltaX, e.deltaY);
  76. });
  77. }
  78. function testGetDomEventType() {
  79. // Defaults to legacy non-gecko event.
  80. assertEquals(LEGACY_TYPE, goog.events.WheelHandler.getDomEventType());
  81. // Gecko start to support wheel with version 17.
  82. goog.userAgent.GECKO = true;
  83. goog.userAgent.version = 16;
  84. assertEquals(GECKO_TYPE, goog.events.WheelHandler.getDomEventType());
  85. goog.userAgent.version = 17;
  86. assertEquals(PREFERRED_TYPE, goog.events.WheelHandler.getDomEventType());
  87. goog.userAgent.GECKO = false;
  88. // IE started with version 9.
  89. goog.userAgent.IE = true;
  90. goog.userAgent.version = 8;
  91. assertEquals(LEGACY_TYPE, goog.events.WheelHandler.getDomEventType());
  92. goog.userAgent.version = 9;
  93. assertEquals(PREFERRED_TYPE, goog.events.WheelHandler.getDomEventType());
  94. goog.userAgent.IE = false;
  95. // Chrome started with version 31.
  96. goog.userAgent.product.CHROME = true;
  97. goog.userAgent.product.version = 30;
  98. assertEquals(LEGACY_TYPE, goog.events.WheelHandler.getDomEventType());
  99. goog.userAgent.product.version = 31;
  100. assertEquals(PREFERRED_TYPE, goog.events.WheelHandler.getDomEventType());
  101. goog.userAgent.product.CHROME = false;
  102. }
  103. function testPreferredStyleWheel() {
  104. // Enable 'wheel'
  105. goog.userAgent.IE = true;
  106. goog.userAgent.version = 9;
  107. createHandlerAndListen();
  108. handleEvent(createFakePreferredEvent(DeltaMode.PIXEL, 10, 20, 30));
  109. assertWheelEvent(DeltaMode.PIXEL, 10, 20, 30);
  110. assertPixelDeltas(1);
  111. handleEvent(createFakePreferredEvent(DeltaMode.LINE, 10, 20, 30));
  112. assertWheelEvent(DeltaMode.LINE, 10, 20, 30);
  113. assertPixelDeltas(15);
  114. handleEvent(createFakePreferredEvent(DeltaMode.PAGE, 10, 20, 30));
  115. assertWheelEvent(DeltaMode.PAGE, 10, 20, 30);
  116. assertPixelDeltas(30 * 15);
  117. }
  118. function testLegacyStyleWheel() {
  119. // 'mousewheel' enabled by default
  120. createHandlerAndListen();
  121. // Test one dimensional.
  122. handleEvent(createFakeLegacyEvent(10));
  123. assertWheelEvent(DeltaMode.PIXEL, 0, -10, 0);
  124. assertPixelDeltas(1);
  125. // Test two dimensional.
  126. handleEvent(createFakeLegacyEvent(/* ignored */ 10, 20, 30));
  127. assertWheelEvent(DeltaMode.PIXEL, -20, -30, 0);
  128. assertPixelDeltas(1);
  129. }
  130. function testLegacyGeckoStyleWheel() {
  131. goog.userAgent.GECKO = true;
  132. createHandlerAndListen();
  133. // Test no axis.
  134. handleEvent(createFakeGeckoEvent(10));
  135. assertWheelEvent(DeltaMode.LINE, 0, 10, 0);
  136. assertPixelDeltas(15);
  137. // Vertical axis.
  138. handleEvent(createFakeGeckoEvent(10, VERTICAL));
  139. assertWheelEvent(DeltaMode.LINE, 0, 10, 0);
  140. assertPixelDeltas(15);
  141. // Horizontal axis.
  142. handleEvent(createFakeGeckoEvent(10, HORIZONTAL));
  143. assertWheelEvent(DeltaMode.LINE, 10, 0, 0);
  144. assertPixelDeltas(15);
  145. }
  146. function testLegacyIeStyleWheel() {
  147. goog.userAgent.IE = true;
  148. createHandlerAndListen();
  149. // Non-gecko, non-webkit events get wheelDelta divided by -40 to get detail.
  150. handleEvent(createFakeLegacyEvent(120));
  151. assertWheelEvent(DeltaMode.PIXEL, 0, -120, 0);
  152. handleEvent(createFakeLegacyEvent(-120));
  153. assertWheelEvent(DeltaMode.PIXEL, 0, 120, 0);
  154. handleEvent(createFakeLegacyEvent(1200));
  155. assertWheelEvent(DeltaMode.PIXEL, 0, -1200, 0);
  156. }
  157. function testNullBody() {
  158. goog.userAgent.IE = true;
  159. var documentObjectWithNoBody = {};
  160. goog.testing.events.mixinListenable(documentObjectWithNoBody);
  161. mouseWheelHandler = new goog.events.WheelHandler(documentObjectWithNoBody);
  162. }
  163. // Be sure to call this after setting up goog.userAgent mock and not before.
  164. function createHandlerAndListen() {
  165. mouseWheelHandler = new goog.events.WheelHandler(goog.dom.getElement('foo'));
  166. goog.events.listen(
  167. mouseWheelHandler, goog.events.WheelEvent.EventType.WHEEL,
  168. function(e) { mouseWheelEvent = e; });
  169. mouseWheelHandlerRtl =
  170. new goog.events.WheelHandler(goog.dom.getElement('fooRtl'));
  171. goog.events.listen(
  172. mouseWheelHandlerRtl, goog.events.WheelEvent.EventType.WHEEL,
  173. function(e) { mouseWheelEventRtl = e; });
  174. }
  175. function handleEvent(event) {
  176. mouseWheelHandler.handleEvent(event);
  177. mouseWheelHandlerRtl.handleEvent(event);
  178. }
  179. function assertWheelEvent(deltaMode, deltaX, deltaY, deltaZ) {
  180. assertTrue('event should be non-null', !!mouseWheelEvent);
  181. assertTrue(
  182. 'event should have correct JS type',
  183. mouseWheelEvent instanceof goog.events.WheelEvent);
  184. assertEquals(
  185. 'event should have correct deltaMode property', deltaMode,
  186. mouseWheelEvent.deltaMode);
  187. assertEquals(
  188. 'event should have correct deltaX property', deltaX,
  189. mouseWheelEvent.deltaX);
  190. assertEquals(
  191. 'event should have correct deltaY property', deltaY,
  192. mouseWheelEvent.deltaY);
  193. assertEquals(
  194. 'event should have correct deltaZ property', deltaZ,
  195. mouseWheelEvent.deltaZ);
  196. // RTL
  197. assertTrue('event should be non-null', !!mouseWheelEventRtl);
  198. assertTrue(
  199. 'event should have correct JS type',
  200. mouseWheelEventRtl instanceof goog.events.WheelEvent);
  201. assertEquals(
  202. 'event should have correct deltaMode property', deltaMode,
  203. mouseWheelEventRtl.deltaMode);
  204. assertEquals(
  205. 'event should have correct deltaX property', -deltaX,
  206. mouseWheelEventRtl.deltaX);
  207. assertEquals(
  208. 'event should have correct deltaY property', deltaY,
  209. mouseWheelEventRtl.deltaY);
  210. assertEquals(
  211. 'event should have correct deltaZ property', deltaZ,
  212. mouseWheelEventRtl.deltaZ);
  213. }
  214. function assertPixelDeltas(scale) {
  215. assertEquals(mouseWheelEvent.deltaX * scale, mouseWheelEvent.pixelDeltaX);
  216. assertEquals(mouseWheelEvent.deltaY * scale, mouseWheelEvent.pixelDeltaY);
  217. assertEquals(mouseWheelEvent.deltaZ * scale, mouseWheelEvent.pixelDeltaZ);
  218. // RTL
  219. assertEquals(
  220. mouseWheelEventRtl.deltaX * scale, mouseWheelEventRtl.pixelDeltaX);
  221. assertEquals(
  222. mouseWheelEventRtl.deltaY * scale, mouseWheelEventRtl.pixelDeltaY);
  223. assertEquals(
  224. mouseWheelEventRtl.deltaZ * scale, mouseWheelEventRtl.pixelDeltaZ);
  225. }
  226. function createFakePreferredEvent(
  227. opt_deltaMode, opt_deltaX, opt_deltaY, opt_deltaZ) {
  228. var event = {
  229. type: PREFERRED_TYPE,
  230. deltaMode: opt_deltaMode,
  231. deltaX: opt_deltaX,
  232. deltaY: opt_deltaY,
  233. deltaZ: opt_deltaZ
  234. };
  235. return new goog.events.BrowserEvent(event);
  236. }
  237. function createFakeLegacyEvent(
  238. opt_wheelDelta, opt_wheelDeltaX, opt_wheelDeltaY) {
  239. var event = {
  240. type: LEGACY_TYPE,
  241. wheelDelta: opt_wheelDelta,
  242. wheelDeltaX: opt_wheelDeltaX,
  243. wheelDeltaY: opt_wheelDeltaY
  244. };
  245. return new goog.events.BrowserEvent(event);
  246. }
  247. function createFakeGeckoEvent(opt_detail, opt_axis) {
  248. var event = {
  249. type: GECKO_TYPE,
  250. detail: opt_detail,
  251. axis: opt_axis,
  252. HORIZONTAL_AXIS: HORIZONTAL,
  253. VERTICAL_AXIS: VERTICAL
  254. };
  255. return new goog.events.BrowserEvent(event);
  256. }