adding check for mousemove (#13090)
* adding check for mousemove * adding unit test for SyntheticMouseEvent * changing test to start with 2, removing comments
Jason Williams committed
Jun 24, 2018 at 10:24 UTC
6a530e3baa9c44a509979c5d7013d4e1617cbc76
2 files changed
+82
-2
packages/react-dom/src/events/SyntheticMouseEvent.js
+2
-2
@@ -53,7 +53,7 @@ const SyntheticMouseEvent = SyntheticUIEvent.extend({
53
return 0;
54
}
55
56
- return event.screenX - screenX;
56
+ return event.type === 'mousemove' ? event.screenX - screenX : 0;
57
},
58
movementY: function(event) {
59
if ('movementY' in event) {
@@ -68,7 +68,7 @@ const SyntheticMouseEvent = SyntheticUIEvent.extend({
68
return 0;
69
}
70
71
- return event.screenY - screenY;
71
+ return event.type === 'mousemove' ? event.screenY - screenY : 0;
72
},
73
});
74
packages/react-dom/src/events/__tests__/SyntheticMouseEvent-test.js
new
+80
@@ -0,0 +1,80 @@
1
+/**
2
+ * Copyright (c) 2013-present, Facebook, Inc.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ *
7
+ * @emails react-core
8
+ */
9
+
10
+'use strict';
11
+
12
+let React;
13
+let ReactDOM;
14
+
15
+describe('SyntheticMouseEvent', () => {
16
+ let container;
17
+
18
+ beforeEach(() => {
19
+ React = require('react');
20
+ ReactDOM = require('react-dom');
21
+
22
+ // The container has to be attached for events to fire.
23
+ container = document.createElement('div');
24
+ document.body.appendChild(container);
25
+ });
26
+
27
+ afterEach(() => {
28
+ document.body.removeChild(container);
29
+ container = null;
30
+ });
31
+
32
+ it('should only use values from movementX/Y when event type is mousemove', () => {
33
+ const events = [];
34
+ const onMouseMove = event => {
35
+ events.push(event.movementX);
36
+ };
37
+
38
+ const onMouseDown = event => {
39
+ events.push(event.movementX);
40
+ };
41
+
42
+ const node = ReactDOM.render(
43
+ <div onMouseMove={onMouseMove} onMouseDown={onMouseDown} />,
44
+ container,
45
+ );
46
+
47
+ let event = new MouseEvent('mousemove', {
48
+ relatedTarget: null,
49
+ bubbles: true,
50
+ screenX: 2,
51
+ screenY: 2,
52
+ });
53
+
54
+ node.dispatchEvent(event);
55
+
56
+ event = new MouseEvent('mousemove', {
57
+ relatedTarget: null,
58
+ bubbles: true,
59
+ screenX: 8,
60
+ screenY: 8,
61
+ });
62
+
63
+ node.dispatchEvent(event);
64
+
65
+ // Now trigger a mousedown event to see if movementX has changed back to 0
66
+ event = new MouseEvent('mousedown', {
67
+ relatedTarget: null,
68
+ bubbles: true,
69
+ screenX: 25,
70
+ screenY: 65,
71
+ });
72
+
73
+ node.dispatchEvent(event);
74
+
75
+ expect(events.length).toBe(3);
76
+ expect(events[0]).toBe(0);
77
+ expect(events[1]).toBe(6);
78
+ expect(events[2]).toBe(0); // mousedown event should have movementX at 0
79
+ });
80
+});