From 51e86a2368c75eba57f9a47f45100bd91f0ee7aa Mon Sep 17 00:00:00 2001 From: "alexey.kamaev" Date: Mon, 9 Apr 2018 12:31:21 +0300 Subject: [PATCH 1/2] [WIP]textInput event should be supported correctly --- src/client/sandbox/event/simulator.js | 21 +++++++++++++++++ src/client/sandbox/native-methods.js | 1 + .../sandbox/event/event-simulator-test.js | 23 +++++++++++++++++++ 3 files changed, 45 insertions(+) diff --git a/src/client/sandbox/event/simulator.js b/src/client/sandbox/event/simulator.js index dac1081d9..b00b410ac 100644 --- a/src/client/sandbox/event/simulator.js +++ b/src/client/sandbox/event/simulator.js @@ -600,6 +600,23 @@ export default class EventSimulator { return null; } + _dispatchTextEvent (el, text) { + const name = browserUtils.isIE ? 'textinput' : 'textInput'; + + let event = null; + + if (nativeMethods.WindowTextEvent && nativeMethods.documentCreateEvent) { + event = nativeMethods.documentCreateEvent.call(document, 'TextEvent'); + + event.initTextEvent(name, true, true, null, text, 0, ''); + } + + if (event) + return this._raiseDispatchEvent(el, event); + + return null; + } + _dispatchEvent (el, name, shouldBubble, flag) { let ev = null; @@ -775,6 +792,10 @@ export default class EventSimulator { return this._dispatchEvent(el, 'change', true, this.DISPATCHED_EVENT_FLAG); } + textInput (el, text) { + return this._dispatchTextEvent(el, text); + } + input (el) { return this._dispatchEvent(el, 'input', true); } diff --git a/src/client/sandbox/native-methods.js b/src/client/sandbox/native-methods.js index dbfefe4b8..6c6694c95 100644 --- a/src/client/sandbox/native-methods.js +++ b/src/client/sandbox/native-methods.js @@ -203,6 +203,7 @@ class NativeMethods { this.WindowTouchEvent = win.TouchEvent || winProto.TouchEvent; this.WindowKeyboardEvent = win.KeyboardEvent || winProto.KeyboardEvent; this.WindowFocusEvent = win.FocusEvent || winProto.FocusEvent; + this.WindowTextEvent = win.TextEvent || winProto.TextEvent; this.canvasContextDrawImage = win.CanvasRenderingContext2D.prototype.drawImage; diff --git a/test/client/fixtures/sandbox/event/event-simulator-test.js b/test/client/fixtures/sandbox/event/event-simulator-test.js index d6bde5920..cf3e01bc3 100644 --- a/test/client/fixtures/sandbox/event/event-simulator-test.js +++ b/test/client/fixtures/sandbox/event/event-simulator-test.js @@ -674,3 +674,26 @@ test('wrong type of the blur event (GH-947)', function () { eventSimulator.blur(domElement); ok(raised); }); + +if (!browserUtils.isFirefox) { + test('Should handle textInput event and pass e.data property (GH-1956)', function () { + + var handler = function (e) { + var ev = e || window.event; + + if (ev instanceof Event && ev instanceof TextEvent && e.data === 'Hello') + raised = true; + }; + + document.addEventListener('textInput', handler); // Chrome way + document.addEventListener('textinput', handler); // IE way + + eventSimulator.textInput(domElement, 'Hello'); + + document.removeEventListener('textInput', handler); // Chrome way + document.removeEventListener('textinput', handler); // IE way + + ok(raised); + }); +} + From 5ab292324dd5370906fd335a2d49a4da39b3530a Mon Sep 17 00:00:00 2001 From: "alexey.kamaev" Date: Wed, 11 Apr 2018 17:59:55 +0300 Subject: [PATCH 2/2] fixes after review --- src/client/sandbox/event/simulator.js | 24 ++++++---- .../sandbox/event/event-simulator-test.js | 45 +++++++++---------- 2 files changed, 38 insertions(+), 31 deletions(-) diff --git a/src/client/sandbox/event/simulator.js b/src/client/sandbox/event/simulator.js index b00b410ac..04fe4188e 100644 --- a/src/client/sandbox/event/simulator.js +++ b/src/client/sandbox/event/simulator.js @@ -30,6 +30,9 @@ const MOUSE_EVENT_NAME_RE = /^((mouse\w+)|((dbl)?click)|(contextmenu)|(dr const TOUCH_EVENT_NAME_RE = /^touch\w+$/; const FOCUS_IN_OUT_EVENT_NAME_RE = /^focus(in|out)$/; +// NOTE: initTextEvent method required INPUT_METHOD param in IE +const DOM_INPUT_METHOD_KEYBOARD = 1; + export default class EventSimulator { constructor () { this.DISPATCHED_EVENT_FLAG = 'hammerhead|dispatched-event'; @@ -601,18 +604,23 @@ export default class EventSimulator { } _dispatchTextEvent (el, text) { - const name = browserUtils.isIE ? 'textinput' : 'textInput'; - - let event = null; - if (nativeMethods.WindowTextEvent && nativeMethods.documentCreateEvent) { - event = nativeMethods.documentCreateEvent.call(document, 'TextEvent'); + const event = nativeMethods.documentCreateEvent.call(document, 'TextEvent'); + + const args = { + eventType: browserUtils.isIE ? 'textinput' : 'textInput', + bubbles: true, + cancelable: true, + view: window, + data: text, + inputMethod: DOM_INPUT_METHOD_KEYBOARD, + locale: navigator.language + }; - event.initTextEvent(name, true, true, null, text, 0, ''); - } + event.initTextEvent(args.eventType, args.bubbles, args.cancelable, args.view, args.data, args.inputMethod, args.locale); - if (event) return this._raiseDispatchEvent(el, event); + } return null; } diff --git a/test/client/fixtures/sandbox/event/event-simulator-test.js b/test/client/fixtures/sandbox/event/event-simulator-test.js index cf3e01bc3..98cfde187 100644 --- a/test/client/fixtures/sandbox/event/event-simulator-test.js +++ b/test/client/fixtures/sandbox/event/event-simulator-test.js @@ -453,6 +453,28 @@ test('drag and drop events', function () { document.body.removeChild(input); }); +// NOTE: Firefox does not support textInput event +if (!browserUtils.isFirefox) { + test('text input', function () { + + var handler = function (e) { + var ev = e || window.event; + + if (ev instanceof Event && ev instanceof TextEvent && e.data === 'Hello') + raised = true; + }; + + document.addEventListener('textInput', handler); // Chrome way + document.addEventListener('textinput', handler); // IE way + + eventSimulator.textInput(domElement, 'Hello'); + + document.removeEventListener('textInput', handler); // Chrome way + document.removeEventListener('textinput', handler); // IE way + + ok(raised); + }); +} module('regression'); @@ -674,26 +696,3 @@ test('wrong type of the blur event (GH-947)', function () { eventSimulator.blur(domElement); ok(raised); }); - -if (!browserUtils.isFirefox) { - test('Should handle textInput event and pass e.data property (GH-1956)', function () { - - var handler = function (e) { - var ev = e || window.event; - - if (ev instanceof Event && ev instanceof TextEvent && e.data === 'Hello') - raised = true; - }; - - document.addEventListener('textInput', handler); // Chrome way - document.addEventListener('textinput', handler); // IE way - - eventSimulator.textInput(domElement, 'Hello'); - - document.removeEventListener('textInput', handler); // Chrome way - document.removeEventListener('textinput', handler); // IE way - - ok(raised); - }); -} -