Skip to content
This repository was archived by the owner on Feb 3, 2023. It is now read-only.

Add offset support to click and hover #57

Merged
ernestas-zekas merged 4 commits into from
Oct 13, 2020
Merged

Add offset support to click and hover #57

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
15c66f6
- Added new method getCoordinates in Elements class;
ernestaszekas Jul 2, 2020
5afeada
Merge branch 'master' into add-offset-support-to-click-and-hover
Sep 28, 2020
bcede79
Merge branch 'master' into add-offset-support-to-click-and-hover
ernestaszekas Oct 13, 2020
20a3c9e
Addressed PR comments.
ernestaszekas Oct 13, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
43 changes: 42 additions & 1 deletion example/tests/elementActions.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,8 @@
import { Element } from "test-juggler";

describe("Element Actions", () => {
const sliceToClick = new Element("[seriesName='seriesx2'] path");

beforeEach(async () => {
console.log("Running test: " + jasmine["currentTest"].fullName);
});
Expand Down Expand Up @@ -88,7 +90,9 @@ describe("Element Actions", () => {
await page.goto("http://demo.guru99.com/test/simple_context_menu.html");
const doubleClickButton = new Element("#authentication > button");
var alertIsShown = false;
var alertMessage = null;
page.on("dialog", async dialog => {
alertMessage = dialog.message();
alertIsShown = true;
await dialog.dismiss();
});
Expand All @@ -98,6 +102,7 @@ describe("Element Actions", () => {

//Assert
expect(alertIsShown).toBeTruthy();
expect(alertMessage).toEqual("You double clicked me.. Thank You..");
});

it("should right click an element", async () => {
Expand Down Expand Up @@ -233,6 +238,27 @@ describe("Element Actions", () => {
expect(await formElement.getAttributeValue(attributeName)).toEqual("/authenticate");
});

it.each`
action | selectedAttr | pieClickedAttr | description
${async () => { sliceToClick.hover(150); }} | ${null} | ${null} | ${"hover"}
${async () => { sliceToClick.click(150); }} | ${"true"} | ${"true"} | ${"left-click"}
${async () => { sliceToClick.rightClick(null, 100); }} | ${"true"} | ${null} | ${"right-click"}
`("should $description element with offset", async ({ action, selectedAttr, pieClickedAttr }) => {
//Arrange
const toolTip = new Element(".apexcharts-tooltip.apexcharts-active");
await page.goto("https://apexcharts.com/samples/react/pie/simple-donut.html");
await page.waitForSelector(`${sliceToClick.selector}[stroke-width='2']`);

//Act
await action();

//Assert
expect(await sliceToClick.getAttributeValue("selected")).toEqual(selectedAttr);
expect(await sliceToClick.getAttributeValue("data:pieClicked")).toEqual(pieClickedAttr);
expect(await toolTip.isVisible()).toBe(true);
expect(await toolTip.text()).toEqual("series-2: 55");
});

it("should type element's text value", async () => {
//Arrange
await page.goto("http://the-internet.herokuapp.com/inputs");
Expand All @@ -249,4 +275,19 @@ describe("Element Actions", () => {
xit("should cover element", async () => {
//TODO: Test should be added and unxit`ed when DTAF-78 is implemented.
});
});

it("should get coordinates of element", async () => {
//Arrange
const expectedXCoordinate = 108; //width (200px) / 2 + left margin (8px)
const expectedYCoordinate = 179.875; //height (200px) / 2 + top heading (~79.88px)
const rectangleCanvas = new Element("#canvas");
await page.goto("http://www.cs.sjsu.edu/~mak/archive/CMPE280/code/canvas/rectangles.html");

//Act
const coordinates = await rectangleCanvas.getCoordinates();

//Assert
expect(coordinates.x).toEqual(expectedXCoordinate);
expect(coordinates.y).toEqual(expectedYCoordinate);
});
});
15 changes: 9 additions & 6 deletions example/tests/interceptor.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,11 +53,11 @@ describe("Interceptor", () => {
await expect(navBar.exists()).resolves.toBeFalsy();
});

it("should block request by any url fragment during action", async () => {
it("should block request by any url fragment after action", async () => {
//Arrange
const navBar = new Element(".navbar");
const requestUrlFragment = "topmenu";
await Interceptor.abortRequestsDuringAction(page.goto(DemoGuruSite), requestUrlFragment);
await Interceptor.abortRequestsAfterAction(page.goto(DemoGuruSite), requestUrlFragment);

//Assert
await expect(navBar.exists()).resolves.toBeFalsy();
Expand All @@ -69,19 +69,22 @@ describe("Interceptor", () => {
await expect(navBar.exists()).resolves.toBeTruthy();
});

it("should block any request during action", async () => {
it("should block any request after action", async () => {
//Arrange
await Helpers.goToUrlAndLoad(DemoOpenCartSite);
var alertMessage = null;
page.on("dialog", dialog => {
console.log(`Alert was detected: '${dialog.message()}'`);
alertMessage = dialog.message();
dialog.dismiss();
});

//Act
await Interceptor.abortRequestsDuringAction(() => { addToCartButton.click(); });
await Interceptor.abortRequestsAfterAction(addToCartButton.click());

//Assert
await expect(successMessage.isVisible()).resolves.toBeFalsy();
expect(alertMessage).toEqual("\nerror\nundefined");
});

it("should count all requests", async () => {
Expand All @@ -95,11 +98,11 @@ describe("Interceptor", () => {

it("should detect specific response after action", async () => {
//Arrange
const responsetUrlFragment = "cart/info";
const responseUrlFragment = "cart/info";
await Helpers.goToUrlAndLoad(DemoOpenCartSite);

//Act
var responseAfterAction = await Interceptor.waitForResponseAfterAction(addToCartButton.click(), responsetUrlFragment);
var responseAfterAction = await Interceptor.waitForResponseAfterAction(addToCartButton.click(), responseUrlFragment);

//Assert
await expect(successMessage.isVisible()).resolves.toBeTruthy();
Expand Down
43 changes: 28 additions & 15 deletions framework/Element.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,22 +44,41 @@ export default class Element {
}
}

async click() {
console.log(`Clicking ${this.selector} ...`);
async getCoordinates(xOffset = null, yOffset = null) {
const elementHandle = await this.wait();
await elementHandle.click();
await elementHandle.focus();
const rect = await elementHandle.boundingBox();
const x = xOffset !== null ? xOffset : rect.width / 2;
const y = yOffset !== null ? yOffset : rect.height / 2;
const xCoordinate = rect.x + x;
const yCoordinate = rect.y + y;
console.log(`Action on page at position x: ${xCoordinate}, y: ${yCoordinate}`);
console.log(`Action on element rectangle at position x: ${x}, y: ${y}`);
return { x: xCoordinate, y: yCoordinate };
}

async click(xOffset = null, yOffset = null) {
console.log(`Clicking ${this.selector} ...`);
const coordinates = await this.getCoordinates(xOffset, yOffset);
await page.mouse.click(coordinates.x, coordinates.y);
}

async doubleClick() {
async doubleClick(xOffset = null, yOffset = null) {
console.log(`Double clicking ${this.selector} ...`);
const elementHandle = await this.wait();
await elementHandle.click({ clickCount: 2 });
const coordinates = await this.getCoordinates(xOffset, yOffset);
await page.mouse.click(coordinates.x, coordinates.y, { clickCount: 2 });
}

async rightClick() {
async rightClick(xOffset = null, yOffset = null) {
console.log(`Right clicking ${this.selector} ...`);
const elementHandle = await this.wait();
await elementHandle.click({ button: "right" });
const coordinates = await this.getCoordinates(xOffset, yOffset);
await page.mouse.click(coordinates.x, coordinates.y, { button: "right" });
}

async hover(xOffset = null, yOffset = null) {
console.log(`Hovering mouse on to ${this.selector} ...`);
const coordinates = await this.getCoordinates(xOffset, yOffset);
await page.mouse.move(coordinates.x, coordinates.y);
}

async exists() {
Expand Down Expand Up @@ -136,12 +155,6 @@ export default class Element {
return attributeValue;
}

async hover() {
console.log(`Hovering mouse on to ${this.selector} ...`);
const elementHandle = await this.wait();
await elementHandle.hover();
}

async cover() {
const elementHandle = await this.wait();
await elementHandle.evaluate((element) => {
Expand Down
3 changes: 2 additions & 1 deletion framework/interceptor.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,9 +22,10 @@ class Interceptor {
return requestStopper;
}

async abortRequestsDuringAction(action, requestUrlFragment = "") {
async abortRequestsAfterAction(action, requestUrlFragment = "", waitDuration = 500) {
Copy link
Collaborator

@vaidasmaciulis vaidasmaciulis Sep 28, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just a note: this is breaking change, due to rename and next release will need to have major version updated. (We have merged some breaking changes already, so it will be anyways)

let requestStopper = await this.abortRequests(requestUrlFragment);
await action;
await page.waitFor(waitDuration);
page.removeListener("request", requestStopper);
await page.setRequestInterception(false);
}
Expand Down