@samitouri / QOS-React / commits / 3f736c360e

Test: create TapEventPlugin-test (#11727)

* Test: create TapEventPlugin-test * move TapEventPlugin to TapEventPlugin-test.internal.js from ReactBrowserEventEmitter-test.internal.js * Prittier: run prittier * run prittier * Fix: fix CI test error fix CI test error by lint * Test: remove TapEventPlugin test code * remove TapEventPlugin test code from ReactBrowserEventEmitter-test.internal.js

Whien committed Dec 1, 2017 at 05:22 UTC 3f736c360efdb83edc323bc0b8bd197805828b9b
2 files changed +172 -81
packages/react-dom/src/__tests__/ReactBrowserEventEmitter-test.internal.js
-81
@@ -16,9 +16,7 @@ var ReactDOM;
16 var ReactDOMComponentTree;
17 var ReactBrowserEventEmitter;
18 var ReactTestUtils;
19 -var TapEventPlugin;
19
21 -var tapMoveThreshold;
20 var idCallOrder;
21 var recordID = function(id) {
22 idCallOrder.push(id);
@@ -33,7 +31,6 @@ var recordIDAndReturnFalse = function(id, event) {
31 };
32 var LISTENER = jest.fn();
33 var ON_CLICK_KEY = 'onClick';
36 -var ON_TOUCH_TAP_KEY = 'onTouchTap';
34 var ON_CHANGE_KEY = 'onChange';
35 var ON_MOUSE_ENTER_KEY = 'onMouseEnter';
36
@@ -65,7 +62,6 @@ describe('ReactBrowserEventEmitter', () => {
62 ReactDOMComponentTree = require('../client/ReactDOMComponentTree');
63 ReactBrowserEventEmitter = require('../events/ReactBrowserEventEmitter');
64 ReactTestUtils = require('react-dom/test-utils');
68 - TapEventPlugin = require('../events/TapEventPlugin').default;
65
66 var container = document.createElement('div');
67
@@ -131,20 +127,6 @@ describe('ReactBrowserEventEmitter', () => {
127 };
128
129 idCallOrder = [];
134 - tapMoveThreshold = TapEventPlugin.tapMoveThreshold;
135 - spyOnDev(console, 'warn');
136 - EventPluginHub.injection.injectEventPluginsByName({
137 - TapEventPlugin: TapEventPlugin,
138 - });
139 - });
140 -
141 - afterEach(() => {
142 - if (__DEV__) {
143 - expect(console.warn.calls.count()).toBe(1);
144 - expect(console.warn.calls.argsFor(0)[0]).toContain(
145 - 'Injecting custom event plugins (TapEventPlugin) is deprecated',
146 - );
147 - }
130 });
131
132 it('should store a listener correctly', () => {
@@ -343,47 +325,6 @@ describe('ReactBrowserEventEmitter', () => {
325 expect(idCallOrder[0]).toBe(CHILD);
326 });
327
346 - it('should infer onTouchTap from a touchStart/End', () => {
347 - putListener(CHILD, ON_TOUCH_TAP_KEY, recordID.bind(null, CHILD));
348 - ReactTestUtils.SimulateNative.touchStart(
349 - CHILD,
350 - ReactTestUtils.nativeTouchData(0, 0),
351 - );
352 - ReactTestUtils.SimulateNative.touchEnd(
353 - CHILD,
354 - ReactTestUtils.nativeTouchData(0, 0),
355 - );
356 - expect(idCallOrder.length).toBe(1);
357 - expect(idCallOrder[0]).toBe(CHILD);
358 - });
359 -
360 - it('should infer onTouchTap from when dragging below threshold', () => {
361 - putListener(CHILD, ON_TOUCH_TAP_KEY, recordID.bind(null, CHILD));
362 - ReactTestUtils.SimulateNative.touchStart(
363 - CHILD,
364 - ReactTestUtils.nativeTouchData(0, 0),
365 - );
366 - ReactTestUtils.SimulateNative.touchEnd(
367 - CHILD,
368 - ReactTestUtils.nativeTouchData(0, tapMoveThreshold - 1),
369 - );
370 - expect(idCallOrder.length).toBe(1);
371 - expect(idCallOrder[0]).toBe(CHILD);
372 - });
373 -
374 - it('should not onTouchTap from when dragging beyond threshold', () => {
375 - putListener(CHILD, ON_TOUCH_TAP_KEY, recordID.bind(null, CHILD));
376 - ReactTestUtils.SimulateNative.touchStart(
377 - CHILD,
378 - ReactTestUtils.nativeTouchData(0, 0),
379 - );
380 - ReactTestUtils.SimulateNative.touchEnd(
381 - CHILD,
382 - ReactTestUtils.nativeTouchData(0, tapMoveThreshold + 1),
383 - );
384 - expect(idCallOrder.length).toBe(0);
385 - });
386 -
328 it('should listen to events only once', () => {
329 spyOnDevAndProd(EventTarget.prototype, 'addEventListener');
330 ReactBrowserEventEmitter.listenTo(ON_CLICK_KEY, document);
@@ -420,26 +361,4 @@ describe('ReactBrowserEventEmitter', () => {
361 expect(dependencies.indexOf(setEventListeners[i])).toBeTruthy();
362 }
363 });
423 -
424 - it('should bubble onTouchTap', () => {
425 - putListener(CHILD, ON_TOUCH_TAP_KEY, recordID.bind(null, CHILD));
426 - putListener(PARENT, ON_TOUCH_TAP_KEY, recordID.bind(null, PARENT));
427 - putListener(
428 - GRANDPARENT,
429 - ON_TOUCH_TAP_KEY,
430 - recordID.bind(null, GRANDPARENT),
431 - );
432 - ReactTestUtils.SimulateNative.touchStart(
433 - CHILD,
434 - ReactTestUtils.nativeTouchData(0, 0),
435 - );
436 - ReactTestUtils.SimulateNative.touchEnd(
437 - CHILD,
438 - ReactTestUtils.nativeTouchData(0, 0),
439 - );
440 - expect(idCallOrder.length).toBe(3);
441 - expect(idCallOrder[0] === CHILD).toBe(true);
442 - expect(idCallOrder[1] === PARENT).toBe(true);
443 - expect(idCallOrder[2] === GRANDPARENT).toBe(true);
444 - });
364 });
packages/react-dom/src/__tests__/TapEventPlugin-test.internal.js new
+172
@@ -0,0 +1,172 @@
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 +var EventPluginHub;
13 +var React;
14 +var ReactDOM;
15 +var ReactTestUtils;
16 +var TapEventPlugin;
17 +
18 +var tapMoveThreshold;
19 +var idCallOrder;
20 +var recordID = function(id) {
21 + idCallOrder.push(id);
22 +};
23 +var LISTENER = jest.fn();
24 +var ON_TOUCH_TAP_KEY = 'onTouchTap';
25 +
26 +var GRANDPARENT;
27 +var PARENT;
28 +var CHILD;
29 +
30 +var putListener;
31 +
32 +describe('TapEventPlugin', () => {
33 + beforeEach(() => {
34 + jest.resetModules();
35 + LISTENER.mockClear();
36 +
37 + EventPluginHub = require('events/EventPluginHub');
38 + React = require('react');
39 + ReactDOM = require('react-dom');
40 + ReactTestUtils = require('react-dom/test-utils');
41 + TapEventPlugin = require('react-dom/src/events/TapEventPlugin').default;
42 +
43 + var container = document.createElement('div');
44 +
45 + var GRANDPARENT_PROPS = {};
46 + var PARENT_PROPS = {};
47 + var CHILD_PROPS = {};
48 +
49 + function Child(props) {
50 + return <div ref={c => (CHILD = c)} {...props} />;
51 + }
52 +
53 + class ChildWrapper extends React.PureComponent {
54 + render() {
55 + return <Child {...this.props} />;
56 + }
57 + }
58 +
59 + function renderTree() {
60 + ReactDOM.render(
61 + <div ref={c => (GRANDPARENT = c)} {...GRANDPARENT_PROPS}>
62 + <div ref={c => (PARENT = c)} {...PARENT_PROPS}>
63 + <ChildWrapper {...CHILD_PROPS} />
64 + </div>
65 + </div>,
66 + container,
67 + );
68 + }
69 +
70 + renderTree();
71 +
72 + putListener = function(node, eventName, listener) {
73 + switch (node) {
74 + case CHILD:
75 + CHILD_PROPS[eventName] = listener;
76 + break;
77 + case PARENT:
78 + PARENT_PROPS[eventName] = listener;
79 + break;
80 + case GRANDPARENT:
81 + GRANDPARENT_PROPS[eventName] = listener;
82 + break;
83 + }
84 + renderTree();
85 + };
86 +
87 + idCallOrder = [];
88 + tapMoveThreshold = TapEventPlugin.tapMoveThreshold;
89 + spyOnDev(console, 'warn');
90 + EventPluginHub.injection.injectEventPluginsByName({
91 + TapEventPlugin: TapEventPlugin,
92 + });
93 + });
94 +
95 + afterEach(() => {
96 + if (__DEV__) {
97 + expect(console.warn.calls.count()).toBe(1);
98 + expect(console.warn.calls.argsFor(0)[0]).toContain(
99 + 'Injecting custom event plugins (TapEventPlugin) is deprecated',
100 + );
101 + }
102 + });
103 +
104 + /**
105 + * The onTouchTap inject is ignore future,
106 + * we should always test the deprecated message correct.
107 + * See https://github.com/facebook/react/issues/11689
108 + */
109 +
110 + it('should infer onTouchTap from a touchStart/End', () => {
111 + putListener(CHILD, ON_TOUCH_TAP_KEY, recordID.bind(null, CHILD));
112 + ReactTestUtils.SimulateNative.touchStart(
113 + CHILD,
114 + ReactTestUtils.nativeTouchData(0, 0),
115 + );
116 + ReactTestUtils.SimulateNative.touchEnd(
117 + CHILD,
118 + ReactTestUtils.nativeTouchData(0, 0),
119 + );
120 + expect(idCallOrder.length).toBe(1);
121 + expect(idCallOrder[0]).toBe(CHILD);
122 + });
123 +
124 + it('should infer onTouchTap from when dragging below threshold', () => {
125 + putListener(CHILD, ON_TOUCH_TAP_KEY, recordID.bind(null, CHILD));
126 + ReactTestUtils.SimulateNative.touchStart(
127 + CHILD,
128 + ReactTestUtils.nativeTouchData(0, 0),
129 + );
130 + ReactTestUtils.SimulateNative.touchEnd(
131 + CHILD,
132 + ReactTestUtils.nativeTouchData(0, tapMoveThreshold - 1),
133 + );
134 + expect(idCallOrder.length).toBe(1);
135 + expect(idCallOrder[0]).toBe(CHILD);
136 + });
137 +
138 + it('should not onTouchTap from when dragging beyond threshold', () => {
139 + putListener(CHILD, ON_TOUCH_TAP_KEY, recordID.bind(null, CHILD));
140 + ReactTestUtils.SimulateNative.touchStart(
141 + CHILD,
142 + ReactTestUtils.nativeTouchData(0, 0),
143 + );
144 + ReactTestUtils.SimulateNative.touchEnd(
145 + CHILD,
146 + ReactTestUtils.nativeTouchData(0, tapMoveThreshold + 1),
147 + );
148 + expect(idCallOrder.length).toBe(0);
149 + });
150 +
151 + it('should bubble onTouchTap', () => {
152 + putListener(CHILD, ON_TOUCH_TAP_KEY, recordID.bind(null, CHILD));
153 + putListener(PARENT, ON_TOUCH_TAP_KEY, recordID.bind(null, PARENT));
154 + putListener(
155 + GRANDPARENT,
156 + ON_TOUCH_TAP_KEY,
157 + recordID.bind(null, GRANDPARENT),
158 + );
159 + ReactTestUtils.SimulateNative.touchStart(
160 + CHILD,
161 + ReactTestUtils.nativeTouchData(0, 0),
162 + );
163 + ReactTestUtils.SimulateNative.touchEnd(
164 + CHILD,
165 + ReactTestUtils.nativeTouchData(0, 0),
166 + );
167 + expect(idCallOrder.length).toBe(3);
168 + expect(idCallOrder[0] === CHILD).toBe(true);
169 + expect(idCallOrder[1] === PARENT).toBe(true);
170 + expect(idCallOrder[2] === GRANDPARENT).toBe(true);
171 + });
172 +});