Remove not needed async and wait for the server listen event before test run (#2209)

* Remove no needed async and wait for the server listen event before test run
* Listen to console errors in tests
* Use node 18
* Add incognito option for browser
* Clear user directory before test start
---------
Co-authored-by: Farhad Alizada <falizada@microsoft.com>

Author: f-alizada

.github/workflows/test.yml

@@ -25,7 +25,10 @@ jobs:
     steps:      
       - name: Checkout code
         uses: actions/checkout@v3
-
+      - name: Setup Node.js 18
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18
       - name: Install
         run: npm install
 

src/config.validate.runtime.json

@@ -1,5 +1,5 @@
 {
     "environment": "runtime",
-    "managementApiUrl": "http://localhost:8181/subscriptions/sid/resourceGroups/rgid/providers/Microsoft.ApiManagement/service/sid",
-    "backendUrl": "http://localhost:8080/"
+    "managementApiUrl": "http://127.0.0.1:8181/subscriptions/sid/resourceGroups/rgid/providers/Microsoft.ApiManagement/service/sid",
+    "backendUrl": "http://127.0.0.1:8080/"
 }

tests/constants.ts

@@ -6,4 +6,5 @@ export const BrowserLaunchOptions: LaunchOptions & BrowserLaunchArgumentOptions
     product: "chrome",
     devtools: true,
     userDataDir: "/puppeteer-data-dir", // necessary for persistent user preferences
+    args: [ '--incognito' ]
 };

tests/e2e/runtime/apis.spec.ts

@@ -17,22 +17,27 @@ describe("Apis page", async () => {
         browser = await puppeteer.launch(BrowserLaunchOptions);
     });
     after(async () => {
-        browser.close();
+        await browser.close();
         Utils.closeServer(server);
     });
 
-    it("User can see apis on the page", async () => {
+    it("User can see apis on the page", async () =>{
         var apis = new Apis();
         apis.addApi(Api.getRandomApi());
         apis.addApi(Api.getRandomApi());
-        server = await Utils.createMockServer([apis.getApisListResponse()]);
-
-        const page = await browser.newPage();
-        await page.goto(config.urls.apis);
-
-        const apiWidget = new ApisWidget(page);
-        await apiWidget.apis();
-
-        expect(await apiWidget.getApisCount()).to.equal(apis.apiList.length);
+        server = Utils.createMockServer([apis.getApisListResponse()]);
+        
+        async function validate(){            
+            const page = await Utils.getBrowserNewPage(browser);
+            
+            await page.goto(config.urls.apis);
+            
+            const apiWidget = new ApisWidget(page);
+            await apiWidget.apis();
+            
+            expect(await apiWidget.getApisCount()).to.equal(apis.apiList.length);
+        }
+        
+        await Utils.startTest(server, validate);
     });
 });

tests/e2e/runtime/products.spec.ts

@@ -17,7 +17,7 @@ describe("Products page", async () => {
         browser = await puppeteer.launch(BrowserLaunchOptions);
     });
     after(async () => {
-        browser.close();
+        await browser.close();
         Utils.closeServer(server);
     });
 
@@ -26,14 +26,17 @@ describe("Products page", async () => {
         products.addProduct(Product.getStartedProduct());
         products.addProduct(Product.getUnlimitedProduct());
 
-        server = await Utils.createMockServer([products.getProductListResponse()]);
+        server = Utils.createMockServer([products.getProductListResponse()]);
 
-        const page = await browser.newPage();
-        await page.goto(config.urls.products);
+        async function validate(){            
+            const page = await Utils.getBrowserNewPage(browser);
+            await page.goto(config.urls.products);
 
-        const productWidget = new ProductseWidget(page);
-        await productWidget.products();
+            const productWidget = new ProductseWidget(page);
+            await productWidget.products();
 
-        expect(await productWidget.getProductsCount()).to.equal(products.productList.length);
+            expect(await productWidget.getProductsCount()).to.equal(products.productList.length);
+        }
+        await Utils.startTest(server, validate);
     });
 });

tests/e2e/runtime/profile.spec.ts

@@ -17,23 +17,27 @@ describe("User profile", async () => {
         browser = await puppeteer.launch(BrowserLaunchOptions);
     });
     after(async () => {
-        browser.close();
+        await browser.close();
         Utils.closeServer(server);
     });
 
     it("User can visit his profile page", async () => {
         var userInfo = new UserMockData();
-        server = await Utils.createMockServer([await userInfo.getSignInResponse(), userInfo.getUserInfoResponse()]);
-        const page = await browser.newPage();
+        server = Utils.createMockServer([ userInfo.getSignInResponse(), userInfo.getUserInfoResponse()]);
 
-        await signIn(page, config);
-        expect(page.url()).to.equal(config.urls.home);
+        async function validate(){
+            const page = await Utils.getBrowserNewPage(browser);
 
-        await page.goto(config.urls.profile);
+            await signIn(page, config);
+            expect(page.url()).to.equal(config.urls.home);
 
-        const profileWidget = new ProfileWidget(page);
-        await profileWidget.profile();
+            await page.goto(config.urls.profile);
 
-        expect(await profileWidget.getUserEmail()).to.equal(userInfo.email);
+            const profileWidget = new ProfileWidget(page);
+            await profileWidget.profile();
+
+            expect(await profileWidget.getUserEmail()).to.equal(userInfo.email);
+        }
+        await Utils.startTest(server, validate);
     });
 });

tests/e2e/runtime/signin.spec.ts

@@ -29,9 +29,13 @@ describe("User sign-in flow", async () => {
 
     it("User can sign-in with basic credentials", async () => {
         var userInfo = new UserMockData();
-        server = await Utils.createMockServer([await userInfo.getSignInResponse()]);
-        const page = await browser.newPage();
-        await signIn(page, config);
-        expect(page.url()).to.equal(config.urls.home);
+        server = Utils.createMockServer([userInfo.getSignInResponse()]);
+        async function validate(){
+            const page = await Utils.getBrowserNewPage(browser);
+            await signIn(page, config);
+            expect(page.url()).to.equal(config.urls.home);
+        }
+
+        await Utils.startTest(server, validate);
     });
 });

tests/e2e/runtime/signup.spec.ts

@@ -16,21 +16,26 @@ describe("User sign-up flow", async () => {
         browser = await puppeteer.launch(BrowserLaunchOptions);
     });
     after(async () => {
-        browser.close();
+        await browser.close();
         Utils.closeServer(server);
     });
 
     it("User can sign-up with basic credentials", async () => {
         var userInfo = new UserMockData();
-        server = await Utils.createMockServer([await userInfo.getUserRegisterResponse("email", "name", "lastname")]);
-        const page = await browser.newPage();
-        await page.goto(config.urls.signup);
+        server = Utils.createMockServer([userInfo.getUserRegisterResponse("email", "name", "lastname")]);
 
-        const signUpWidget = new SignupBasicWidget(page);
-        await signUpWidget.signUpWithBasic();
+        async function validate(){
+            const page = await Utils.getBrowserNewPage(browser);
+            await page.goto(config.urls.signup);
 
-        expect(await signUpWidget.getConfirmationMessageValue())
+            const signUpWidget = new SignupBasicWidget(page);
+            await signUpWidget.signUpWithBasic();
+
+            expect(await signUpWidget.getConfirmationMessageValue())
             .to.equal("Follow the instructions from the email to verify your account.");
+        }
+
+        await Utils.startTest(server, validate);
     });
 
 });

tests/mocks/collection/user.ts

@@ -8,7 +8,7 @@ export class UserMockData{
         this.publicId = "example-example-example";
     }
 
-    public async getSignInResponse(){
+    public getSignInResponse(){
         return {
             "/subscriptions/sid/resourceGroups/rgid/providers/Microsoft.ApiManagement/service/sid/identity":{
                 "headers": [
@@ -18,7 +18,7 @@ export class UserMockData{
                 },
                 {
                     "name": "ocp-apim-sas-token",
-                    "value": await Utils.getSharedAccessToken(this.publicId, "accesskey", 1)
+                    "value": Utils.getSharedAccessToken(this.publicId, "accesskey", 1)
                 }
                 ],
                 "statusCode": 200,

tests/utils.ts

@@ -1,7 +1,7 @@
 import * as fs from "fs";
 import * as crypto from "crypto";
-import { User } from "./mocks";
 import * as http from "http";
+import { ConsoleMessage, Page } from 'puppeteer';
 
 export class Utils {
     public static async getConfig(): Promise<any> {
@@ -14,7 +14,7 @@ export class Utils {
         return validationConfig;
     }
 
-    public static async getSharedAccessToken(apimUid: string, apimAccessKey: string, validDays: number): Promise<string> {
+    public static getSharedAccessToken(apimUid: string, apimAccessKey: string, validDays: number): string {
         const expiryDate = new Date();
         expiryDate.setDate(expiryDate.getDate() + validDays);
 
@@ -38,7 +38,7 @@ export class Utils {
         return result;
     }
 
-    public static async createMockServer(responses?: Object[]) {
+    public static createMockServer(responses?: Object[]) {
         var obj = {};
         if (responses?.length){
             for (let responseObj of responses) {
@@ -72,10 +72,40 @@ export class Utils {
                 }
             });
 
-        server.listen(8181);
         return server;
     }
     public static closeServer(server){
-        server.close();
+        if (server != null){
+            server.close();
+        }
+    }
+
+    public static startTest(server, validate): Promise<void>{
+        return new Promise((resolve, reject) => {
+            server.on("ready", () => {
+                validate().then(() => {
+                    resolve();
+                }).catch((err) => {
+                    reject(err);
+                });
+            });
+
+            server.listen(8181,"127.0.0.1", function(){
+                server.emit("ready");
+            });
+       });
     }
+
+    public static async  getBrowserNewPage(browser): Promise<Page>{
+        const page = await browser.newPage();
+            
+        page.on('console', async (message: ConsoleMessage) => {
+            if (message.type() === 'error') {
+                console.error(message.text());
+            }
+        });
+
+        return page;
+    }
+
 }