add support of event.screenX and event.screenY properties (closes Dev…

…Express#2325) (DevExpress#2353)

* [WIP]add support of event.screenX and event.screenY properties

* fix ugly code

* rewrite tests

* skip in mobile browsers

* fix obj is null problem

* remove functional test

src/client/automation/playback/click/index.js

@@ -214,14 +214,16 @@ export default class ClickAutomation extends VisibleElementAutomation {
 
         return this
             ._ensureElement(useStrictElementCheck)
-            .then(({ element, clientPoint, screenPoint }) => {
+            .then(({ element, clientPoint, screenPoint, devicePoint }) => {
                 eventArgs = {
                     point:       clientPoint,
                     screenPoint: screenPoint,
                     element:     element,
                     options:     extend({
                         clientX: clientPoint.x,
-                        clientY: clientPoint.y
+                        clientY: clientPoint.y,
+                        screenX: devicePoint.x,
+                        screenY: devicePoint.y
                     }, this.modifiers)
                 };
 

src/client/automation/playback/move/index.js

@@ -7,6 +7,7 @@ import cursor from '../../cursor';
 import { underCursor as getElementUnderCursor } from '../../get-element';
 import getAutomationPoint from '../../utils/get-automation-point';
 import getLineRectIntersection from '../../utils/get-line-rect-intersection';
+import getDevicePoint from '../../utils/get-device-point';
 import nextTick from '../../utils/next-tick';
 import AutomationSettings from '../../settings';
 
@@ -271,10 +272,13 @@ export default class MoveAutomation {
     _emulateEvents (currentElement) {
         var whichButton = this.holdLeftButton ? eventUtils.WHICH_PARAMETER.leftButton : eventUtils.WHICH_PARAMETER.noButton;
         var button      = this.holdLeftButton ? eventUtils.BUTTONS_PARAMETER.leftButton : eventUtils.BUTTONS_PARAMETER.noButton;
+        var devicePoint = getDevicePoint({ x: this.x, y: this.y });
 
         var eventOptions = {
             clientX:      this.x,
             clientY:      this.y,
+            screenX:      devicePoint.x,
+            screenY:      devicePoint.y,
             button:       0,
             which:        browserUtils.isWebKit ? whichButton : 1,
             buttons:      button,

src/client/automation/playback/rclick.js

@@ -78,13 +78,15 @@ export default class RClickAutomation extends VisibleElementAutomation {
 
         return this
             ._ensureElement(useStrictElementCheck)
-            .then(({ element, clientPoint }) => {
+            .then(({ element, clientPoint, devicePoint }) => {
                 eventArgs = {
                     point:   clientPoint,
                     element: element,
                     options: extend({
                         clientX: clientPoint.x,
                         clientY: clientPoint.y,
+                        screenX: devicePoint.x,
+                        screenY: devicePoint.y,
                         button:  eventUtils.BUTTON.right,
                         which:   eventUtils.WHICH_PARAMETER.rightButton,
                         buttons: eventUtils.BUTTONS_PARAMETER.rightButton

src/client/automation/playback/visible-element-automation.js

@@ -2,6 +2,7 @@ import hammerhead from '../deps/hammerhead';
 import { delay, positionUtils, domUtils, arrayUtils, serviceUtils } from '../deps/testcafe-core';
 import getAutomationPoint from '../utils/get-automation-point';
 import screenPointToClient from '../utils/screen-point-to-client';
+import getDevicePoint from '../utils/get-device-point';
 import { fromPoint as getElementFromPoint } from '../get-element';
 import AUTOMATION_ERROR_TYPES from '../errors';
 import AutomationSettings from '../settings';
@@ -18,6 +19,7 @@ class ElementState {
         this.screenPoint = screenPoint;
         this.isTarget    = isTarget;
         this.inMoving    = inMoving;
+        this.devicePoint = getDevicePoint(clientPoint);
     }
 }
 
@@ -130,7 +132,8 @@ export default class VisibleElementAutomation extends serviceUtils.EventEmitter
                 return {
                     element:     state.element,
                     clientPoint: state.clientPoint,
-                    screenPoint: state.screenPoint
+                    screenPoint: state.screenPoint,
+                    devicePoint: state.devicePoint
                 };
             });
     }

src/client/automation/utils/get-device-point.js

@@ -0,0 +1,11 @@
+export default function getDevicePoint (clientPoint) {
+    if (!clientPoint)
+        return null;
+
+    const screenLeft = window.screenLeft || window.screenX;
+    const screenTop  = window.screenTop || window.screenY;
+    const x          = screenLeft + clientPoint.x;
+    const y          = screenTop + clientPoint.y;
+
+    return { x, y };
+}

test/client/fixtures/automation/regression-test.js

@@ -2,6 +2,7 @@ var hammerhead       = window.getTestCafeModule('hammerhead');
 var browserUtils     = hammerhead.utils.browser;
 var featureDetection = hammerhead.utils.featureDetection;
 var nativeMethods    = hammerhead.nativeMethods;
+var Promise          = hammerhead.Promise;
 
 var testCafeCore     = window.getTestCafeModule('testCafeCore');
 var eventUtils       = testCafeCore.get('./utils/event');
@@ -16,6 +17,7 @@ var TypeOptions  = testCafeAutomation.get('../../test-run/commands/options').Typ
 var MouseOptions = testCafeAutomation.get('../../test-run/commands/options').MouseOptions;
 
 var ClickAutomation      = testCafeAutomation.Click;
+var RClickAutomation     = testCafeAutomation.RClick;
 var DblClickAutomation   = testCafeAutomation.DblClick;
 var HoverAutomation      = testCafeAutomation.Hover;
 var TypeAutomation       = testCafeAutomation.Type;
@@ -611,6 +613,80 @@ $(document).ready(function () {
             });
     });
 
+    if (!browserUtils.isIOS && !browserUtils.isAndroid) {
+        asyncTest('GH-2325 - mouse events should have e.screenX and e.screenY properties', function () {
+            var promises   = [];
+            var screenLeft = window.screenLeft || window.screenX;
+            var screenTop  = window.screenTop || window.screenY;
+            var el         = document.createElement('div');
+            var mouseOutEl = document.createElement('div');
+
+            el.innerHTML         = 'Click me';
+            el.className         = TEST_ELEMENT_CLASS;
+            mouseOutEl.innerHTML = 'Hover me';
+            mouseOutEl.className = TEST_ELEMENT_CLASS;
+
+            document.body.appendChild(el);
+            document.body.appendChild(mouseOutEl);
+
+            var checkEventScreenXYOptions = function (eventName) {
+                var resolveFn;
+
+                promises.push(new Promise(function (resolve) {
+                    resolveFn = resolve;
+                }));
+
+                var handler = function (e) {
+                    ok(e.screenX > 0);
+                    ok(e.screenY > 0);
+                    equal(e.screenX, e.clientX + screenLeft);
+                    equal(e.screenY, e.clientY + screenTop);
+
+                    resolveFn();
+                    el.removeEventListener(eventName, handler);
+                };
+
+                return handler;
+            };
+
+            var addEventListener = function (eventName) {
+                el.addEventListener(eventName, checkEventScreenXYOptions(eventName));
+            };
+
+            addEventListener('mousemove');
+            addEventListener('mouseenter');
+            addEventListener('mouseover');
+            addEventListener('mousedown');
+            addEventListener('mouseup');
+            addEventListener('click');
+            addEventListener('mouseout');
+            addEventListener('mouseleave');
+            addEventListener('contextmenu');
+            addEventListener('dblclick');
+
+            var click    = new ClickAutomation(el, { offsetX: 5, offsetY: 5 });
+            var rClick   = new RClickAutomation(el, { offsetX: 5, offsetY: 5 });
+            var dblClick = new DblClickAutomation(el, { offsetX: 5, offsetY: 5 });
+            var mouseOut = new ClickAutomation(mouseOutEl, { offsetX: 5, offsetY: 5 });
+
+            click.run()
+                .then(function () {
+                    return mouseOut.run();
+                })
+                .then(function () {
+                    return rClick.run();
+                })
+                .then(function () {
+                    return dblClick.run();
+                })
+                .then(function () {
+                    Promise.all(promises).then(function () {
+                        startNext();
+                    });
+                });
+        });
+    }
+
     if (browserUtils.isIE) {
         //TODO: fix it for other browsers
         asyncTest('Unexpected focus events are raised during click', function () {