feat: add x & y options for mouseDown and moustUp events (#486)

* Update mouseDown.ts

Add X & Y coordinates to mouseDown

* Update src/commands/mouseDown.ts

* Update mouseUp as well

---------

Co-authored-by: Dmitriy Kovalenko <[email protected]>

Author: adamistheanswer

src/commands/mouseDown.ts

@@ -25,6 +25,19 @@ export interface realMouseDownOptions {
    * @default "left"
    */
   button?: keyof typeof mouseButtonNumbers;
+
+  /**  X coordinate to click, relative to the Element. Overrides `position`.
+   * @example
+   * cy.get("canvas").realMouseDown({ x: 100, y: 115 })
+   * cy.get("body").realMouseDown({ x: 11, y: 12 }) // global click by coordinates
+   */
+  x?: number;
+  /**  Y coordinate to click, relative to the Element. Overrides `position`.
+   * @example
+   * cy.get("canvas").realMouseDown({ x: 100, y: 115 })
+   * cy.get("body").realMouseDown({ x: 11, y: 12 }) // global click by coordinates
+   */
+  y?: number;
   /**
    * Indicates whether the shift key was pressed or not when an event occurred
    * @example cy.realMouseDown({ shiftKey: true });
@@ -37,7 +50,14 @@ export async function realMouseDown(
   subject: JQuery,
   options: realMouseDownOptions = {}
 ) {
-  const { x, y } = getCypressElementCoordinates(subject, options.position, options.scrollBehavior);
+  const position =
+    options.x && options.y ? { x: options.x, y: options.y } : options.position;
+
+  const { x, y } = getCypressElementCoordinates(
+    subject,
+    position,
+    options.scrollBehavior
+  );
 
   const log = Cypress.log({
     $el: subject,

src/commands/mouseUp.ts

@@ -24,6 +24,18 @@ export interface realMouseUpOptions {
    * @default "left"
    */
   button?: keyof typeof mouseButtonNumbers;
+  /**  X coordinate to click, relative to the Element. Overrides `position`.
+   * @example
+   * cy.get("canvas").realMouseUp({ x: 100, y: 115 })
+   * cy.get("body").realMouseUp({ x: 11, y: 12 }) // global click by coordinates
+   */
+  x?: number;
+  /**  Y coordinate to click, relative to the Element. Overrides `position`.
+   * @example
+   * cy.get("canvas").realMouseUp({ x: 100, y: 115 })
+   * cy.get("body").realMouseUp({ x: 11, y: 12 }) // global click by coordinates
+   */
+  y?: number;
   /**
    * Indicates whether the shift key was pressed or not when an event occurred
    * @example cy.realMouseUp({ shiftKey: true });
@@ -36,7 +48,14 @@ export async function realMouseUp(
   subject: JQuery,
   options: realMouseUpOptions = {}
 ) {
-  const { x, y } = getCypressElementCoordinates(subject, options.position, options.scrollBehavior);
+  const position =
+    options.x && options.y ? { x: options.x, y: options.y } : options.position;
+
+  const { x, y } = getCypressElementCoordinates(
+    subject,
+    position,
+    options.scrollBehavior
+  );
 
   const log = Cypress.log({
     $el: subject,

src/commands/realClick.ts

@@ -51,10 +51,8 @@ export async function realClick(
   subject: JQuery,
   options: RealClickOptions = {}
 ) {
-  // prettier-ignore
-  const position = options.x && options.y
-    ? { x: options.x, y: options.y }
-    : options.position;
+  const position =
+    options.x && options.y ? { x: options.x, y: options.y } : options.position;
 
   const { x, y } = getCypressElementCoordinates(
     subject,
@@ -73,7 +71,7 @@ export async function realClick(
 
   log.snapshot("before");
 
-  const { clickCount = 1 } = options
+  const { clickCount = 1 } = options;
 
   for (let currentClick = 1; currentClick <= clickCount; currentClick++) {
     await fireCdpCommand("Input.dispatchMouseEvent", {