Merge pull request #90 from devbridge/85-playwright-fix-jasmine

85 playwright fix jasmine

.eslintrc.js

@@ -9,7 +9,11 @@ module.exports = {
     "extends": "eslint:recommended",
     "globals": {
         "Atomics": "readonly",
-        "SharedArrayBuffer": "readonly"
+        "SharedArrayBuffer": "readonly",
+        "document": "readonly",
+        "page": true,
+        "browser": "readonly",
+        "window": "readonly"
     },
     "parserOptions": {
         "ecmaVersion": 2018,
@@ -45,8 +49,9 @@ module.exports = {
             "always"
         ],
         "space-infix-ops": [
-            "error", 
+            "error",
             { "int32Hint": false }
-        ]
+        ],
+        "no-trailing-spaces": 2
     }
 };

README.md

@@ -44,7 +44,7 @@
 ### Waiting for full page load ###
 
 * Helpers.goToUrlAndLoad() waits for page to be fully loaded. 
-* It uses parameter 'waitUntil: "networkidle0"' to consider navigation to be finished when there are no more than 0 network connections for at least 500 ms.
+* It uses parameter 'waitUntil: "networkidle"' to consider navigation to be finished when there are no more than 0 network connections for at least 500 ms.
 
 ### Intercept requests ###
 
@@ -97,6 +97,75 @@ That should be enough to trick Jest into running your tests always in parallel.
 ### Running tests sequentially ###
 * Use --runInBand cli command if tests need to be executed serially ([Official Jest documentation](https://jestjs.io/docs/en/cli.html))
 
+### Run tests in different projects ###
+There is possibility to add several Jest projects ([Official Jest documentation](https://jestjs.io/docs/en/configuration#projects-arraystring--projectconfig)). In case there is need to have E2E tests and Unit tests in one solution, or one project to run tests sequentially and another project to run tests in parallel. This can be helpful for setuping CI/CD.
+
+Example of parallel and sequential projects run:
+```jest.config.js``` example:
+```javascript
+module.exports = {
+    projects: [
+        {
+            displayName: "default-tests",
+            globalSetup: "./test-environment/setup.js",
+            globalTeardown: "./test-environment/teardown.js",
+            testEnvironment: "./test-environment/environment.js",
+            setupFilesAfterEnv: ["./test-environment/jest.setup.js"],
+            transformIgnorePatterns: ["node_modules/(?!(test-juggler)/)"],
+            verbose: true,
+            testTimeout: 60000
+        },
+        {
+            displayName: "serial-tests",
+            testMatch: ["**/?(*.)+(serial-test).[jt]s?(x)"],
+            globalSetup: "./test-environment/setup.js",
+            globalTeardown: "./test-environment/teardown.js",
+            testEnvironment: "./test-environment/environment.js",
+            setupFilesAfterEnv: ["./test-environment/jest.setup.js"],
+            transformIgnorePatterns: ["node_modules/(?!(test-juggler)/)"],
+            verbose: true,
+            testTimeout: 60000
+        }
+    ],
+    reporters: ["default", ["jest-junit", { outputDirectory: "junit-report" }]]
+};
+```
+
+Add several scripts in ```package.json``` file under "scripts":
+```javascript
+...
+"default-tests": "jest --selectProjects default-tests",
+"serial-tests": "jest --selectProjects serial-tests --runInBand",
+"all-tests": "npm run default-tests && npm run serial-tests",
+...
+```
+Then:
+* Type and run ```npm run default-tests``` to run all default tests
+* Type and run ```npm run serial-tests``` to run all serial tests
+* Type and run ```npm run all-tests``` to run all projects in one batch (serial tests will run sequentially)
+* Type and run ```npm run test``` to run all projects in one batch (all tests in parallel)
+
+__Note 1__: 
+Parallel and sequantial run can be implemented without projects. Add test files matchers in jest scripts.
+Example:
+```javascript
+...
+ "serial-tests": "jest --testRegex '.*serial-test*' --runInBand",
+ "all-tests": "npm run test && npm run serial-tests",
+...
+```
+ or
+ ```javascript
+...
+ "all-tests": "jest && jest --testRegex '.*serial-test*' --runInBand",
+...
+```
+
+__Note 2__: When running two scripts at once then latest test run overrides junit report. So user is unable to find information about first run. To resolve this problem and generate unique report after each test run add setting ```uniqueOutputName``` to jest-junit configuration in ```jest.config.js``` file:
+```javascript
+reporters: ["default", ["jest-junit", { outputDirectory: "junit-report", uniqueOutputName: "true" }]]
+```
+
 ### Contribution guidelines ###
 
 * Contribution should be done and tested in feature branch

example/pages/HomePage.js

@@ -1,4 +1,3 @@
-/*global page*/
 import { Element } from "test-juggler";
 import TopBar from "../components/TopBar";
 

example/tests/VisualRegression.test.js

@@ -1,4 +1,3 @@
-/*global page document*/
 import HomePage from "../pages/HomePage";
 import FeedbackPage from "../pages/FeedbackPage";
 const { toMatchImageSnapshot } = require("jest-image-snapshot");

example/tests/apiHelpers.test.js

@@ -58,7 +58,7 @@ describe("Helpers", () => {
         //Assert
         expect(response.status).toEqual(204);
     });
-    
+
     it("should issue arbitrary request", async () => {
         //Arrange, Act
         const response = await apiHelpers.request({
@@ -73,7 +73,7 @@ describe("Helpers", () => {
         //Assert
         expect(response.status).toEqual(200);
     });
-    
+
     it("should handle bad response", async () => {
         //Arrange, Act
         const response = await apiHelpers.get("/api/users/23");
@@ -103,7 +103,7 @@ describe("Helpers", () => {
 
     it("should issue request with basic auth", async () => {
         //Arrange
-        const authedApiHelpers = new ApiHelpers({ 
+        const authedApiHelpers = new ApiHelpers({
             baseURL: "https://postman-echo.com",
             auth: {
                 username: "postman",

example/tests/elementActions.test.js

@@ -1,4 +1,3 @@
-/*global page*/
 import { Element } from "test-juggler";
 
 describe("Element Actions", () => {
@@ -192,12 +191,12 @@ describe("Element Actions", () => {
 
     it("should hover on an element", async () => {
         //Arrange
-        await page.goto("http://demo.guru99.com/test/tooltip.html");
-        const downloadButton = new Element("#download_now");
-        const tooltip = new Element("div.tooltip");
+        await page.goto("https://demoqa.com/tool-tips" );
+        const button = new Element("#toolTipButton");
+        const tooltip = new Element("#buttonToolTip");
 
         //Act
-        await downloadButton.hover();
+        await button.hover();
 
         //Assert
         await expect(tooltip.isVisible()).resolves.toBeTruthy();

example/tests/helpers.test.js

@@ -1,4 +1,3 @@
-/*global page:true browser*/
 import { Element, Helpers } from "test-juggler";
 const fs = require("fs");
 
@@ -78,12 +77,12 @@ describe("Helpers", () => {
         //Arrange
         const config = require(process.cwd() + "/framework.config");
         const newPage = await browser.newPage();
-        
+
         //Act
         await Helpers.pageSetup(newPage);
 
         //Assert
-        expect(newPage._timeoutSettings.timeout()).toEqual(config.defaultTimeout);
+        expect(newPage._timeoutSettings.timeout({})).toEqual(config.defaultTimeout);
     });
 
     it("should generate random text with no characters specified", async () => {
@@ -103,7 +102,7 @@ describe("Helpers", () => {
 
         //Act
         const text = await Helpers.generateRandomText(8, chars);
-        
+
         //Assert
         expect(regex.test(text)).toBeTruthy();
         expect(text.length).toEqual(8);

example/tests/interceptor.test.js

@@ -1,4 +1,3 @@
-/*global page:true browser*/
 import { Element, Helpers, Interceptor } from "test-juggler";
 
 const DemoGuruSite = "http://demo.guru99.com/test/radio.html";

example/tests/pageObjectModel.test.js

@@ -6,17 +6,17 @@ describe("Example", () => {
         await HomePage.visit();
         console.log("Running test: " + jasmine["currentTest"].fullName);
     });
-    
+
     it("should access methods defined in pages and components", async () => {
         await expect(HomePage.isNavbarDisplayed()).resolves.toBeTruthy();
         await expect(HomePage.TopBar.isTopBarDisplayed()).resolves.toBeTruthy();
     });
-    
+
     it("should access an element defined in component defined in page", async () => {
-        await HomePage.TopBar.LogoButton.waitUntilVisible(); 
+        await HomePage.TopBar.LogoButton.waitUntilVisible();
         await expect(HomePage.TopBar.LogoButton.exists()).resolves.toBeTruthy();
     });
-    
+
     it("should access an element defined directly in page", async () => {
         await HomePage.FeedBackLink.click();
         console.log("Clicked on feedback link");

framework/Element.js

@@ -1,4 +1,3 @@
-/*global page document window*/
 import Helpers from "./helpers";
 
 const config = require(process.cwd() + "/framework.config");
@@ -29,7 +28,7 @@ export default class Element {
 
     async waitUntilVisible(timeout = defaultTimeout) {
         console.log(`Waiting for ${this.selector} to be visible...`);
-        const elementHandle = await page.waitForSelector(this.selector, { visible: true, timeout: timeout });
+        const elementHandle = await page.waitForSelector(this.selector, { state: "visible", timeout: timeout });
         if (config.captureScreenshots) {
             await Helpers.takeScreenshot();
         }
@@ -38,7 +37,7 @@ export default class Element {
 
     async waitUntilInvisible(timeout = defaultTimeout) {
         console.log(`Waiting for ${this.selector} to be invisible...`);
-        await page.waitForSelector(this.selector, { hidden: true, timeout: timeout });
+        await page.waitForSelector(this.selector, { state: "hidden", timeout: timeout });
         if (config.captureScreenshots) {
             await Helpers.takeScreenshot();
         }

framework/helpers.js

@@ -1,4 +1,3 @@
-/*global page*/
 const fs = require("fs");
 const retry = require("async-retry");
 const config = require(process.cwd() + "/framework.config");
@@ -29,7 +28,7 @@ class Helpers {
 
     async goToUrlAndLoad(url, timeout = defaultTimeout) {
         await page.goto(url, {
-            waitUntil: "networkidle0", timeout: timeout,
+            waitUntil: "networkidle", timeout: timeout,
         });
     }
 

framework/interceptor.js

@@ -1,4 +1,3 @@
-/*global page*/
 const fs = require("fs");
 
 class Interceptor {

jest.config.js

@@ -3,12 +3,13 @@ module.exports = {
     //globalTeardown: "./test-environment/teardown.js",
     testEnvironment: "./test-environment/environment.js",
     preset: "jest-playwright-preset",
-    //setupFilesAfterEnv: ["./test-environment/jest.setup.js"],
+    setupFilesAfterEnv: ["./test-environment/jest.setup.js"],
     transformIgnorePatterns: ["node_modules/(?!(test-juggler)/)"],
     verbose: true,
-    "reporters": [
+    reporters: [
         "default",
         ["jest-junit", { outputDirectory: "junit-report" }]
     ],
+    testRunner: "jasmine2",
     testTimeout: 60000
-};
+};