feat: QA-126 Add playwright tests + upgrade playwright to 0.12

package.json

@@ -20,15 +20,15 @@
         "@types/debug": "^4.1.3",
         "@types/jest": "^24.0.11",
         "@types/lodash.isequal": "^4.5.5",
-        "@types/puppeteer": "^1.12.3",
+        "@types/puppeteer": "^2.0.1",
         "factory.ts": "^0.5.1",
         "husky": "^1.3.1",
         "jest": "^24.5.0",
         "jest-junit": "^6.3.0",
-        "playwright": "0.11",
+        "playwright-chromium": "0.12.1",
         "prettier": "^1.16.4",
         "pretty-quick": "^1.10.0",
-        "puppeteer": "1.13",
+        "puppeteer": "2.1.0",
         "semantic-release": "^15.13.3",
         "ts-jest": "^24.0.1",
         "typescript": "^3.8.3"

src/controllers/BrowserController.ts

@@ -1,5 +1,5 @@
 /**
- * Interface through with Mocketeer communicates with different browser automation libraries
+ * Interface used by Mocketeer to communicate with browser automation libraries
  */
 export interface BrowserController {
     startInterception(onRequest: BrowserRequestHandler): Promise<void>;
@@ -15,7 +15,7 @@ export type BrowserRequestHandler = (
 ) => void;
 
 /**
- * Data of intercepted browser request
+ * Represents data of intercepted browser request
  */
 export interface BrowserRequest {
     type: BrowserRequestType;
@@ -29,6 +29,9 @@ export interface BrowserRequest {
     sourceOrigin: string;
 }
 
+/**
+ * Content of response
+ */
 export interface ResponseData {
     status: number;
     body?: Buffer | string;

src/controllers/BrowserControllerFactory.ts

@@ -1,17 +1,19 @@
 import * as puppeteer from 'puppeteer';
-import playwright from 'playwright';
+import playwright from 'playwright-core';
 import { PlaywrightController } from './PlaywrightController';
 import { PuppeteerController } from './PuppeteerController';
 import { BrowserController } from './BrowserController';
 
+/**
+ * Type of supported page objects
+ */
 export type BrowserPage = puppeteer.Page | playwright.Page;
 
 export class BrowserControllerFactory {
     /**
-     * Return instantiated Playwright or Puppeteer controller
-     * corresponding to provided page object
+     * Returns instance of BrowserController corresponding to provided page
      */
-    public static getForPage(page: BrowserPage): BrowserController {
+    public static createForPage(page: BrowserPage): BrowserController {
         if (this.isPlaywrightPage(page)) {
             return new PlaywrightController(page);
         } else if (this.isPuppeteerPage(page)) {

src/controllers/PlaywrightController.ts

@@ -1,4 +1,4 @@
-import playwright from 'playwright';
+import playwright from 'playwright-core';
 import {
     BrowserController,
     BrowserRequestHandler,
@@ -13,11 +13,11 @@ export class PlaywrightController implements BrowserController {
     constructor(private readonly page: playwright.Page) {}
 
     async startInterception(onRequest: BrowserRequestHandler) {
-        this.page.route('**/*', (request: playwright.Request) => {
+        this.page.route('**/*', (route: playwright.Route) => {
             onRequest(
-                this.toBrowserRequest(request),
-                data => this.respond(request, data),
-                () => request.continue()
+                this.toBrowserRequest(route.request()),
+                data => this.respond(route, data),
+                () => this.skip(route)
             );
         });
     }
@@ -34,16 +34,16 @@ export class PlaywrightController implements BrowserController {
             url: request.url(),
             body: tryJsonParse(request.postData()),
             method: request.method(),
-            headers: request.headers() || {},
+            headers: (request.headers() as Record<string, string>) || {},
             path: pathname,
             hostname: `${protocol}//${host}`,
             query: query,
             sourceOrigin: this.getRequestOrigin(request),
         };
     }
 
-    private async respond(request: playwright.Request, response: ResponseData) {
-        await request.fulfill({
+    private async respond(route: playwright.Route, response: ResponseData) {
+        await route.fulfill({
             headers: response.headers || {},
             status: response.status,
             body: response.body ? response.body : '',
@@ -53,6 +53,10 @@ export class PlaywrightController implements BrowserController {
         });
     }
 
+    private async skip(route: playwright.Route) {
+        await route.continue();
+    }
+
     /**
      * Obtain request origin url from originating frame url
      */

src/controllers/PuppeteerController.ts

@@ -14,14 +14,14 @@ export class PuppeteerController implements BrowserController {
         await this.page.setRequestInterception(true);
         this.page.on('request', request => {
             onRequest(
-                this.getRequestData(request),
+                this.toBrowserRequest(request),
                 response => request.respond(response),
                 () => request.continue()
             );
         });
     }
 
-    private getRequestData(request: Request): BrowserRequest {
+    private toBrowserRequest(request: Request): BrowserRequest {
         // TODO find a better alternative for url.parse
         const { pathname = '', query, protocol, host } = parse(
             request.url(),

src/mocketeer.ts

@@ -47,7 +47,7 @@ export class Mocketeer {
         options: Partial<MocketeerOptions> = {}
     ): Promise<Mocketeer> {
         const mocketeer = new Mocketeer(options);
-        const controller = BrowserControllerFactory.getForPage(page);
+        const controller = BrowserControllerFactory.createForPage(page);
         await mocketeer.activate(controller);
         return mocketeer;
     }

src/utils.ts

@@ -1,4 +1,4 @@
-import { HttpMethod, RequestMatcher } from './types';
+import { HttpMethod, RequestMatcher, ShorthandRequestMatcher } from './types';
 import { BrowserRequest } from './controllers/BrowserController';
 
 export function tryJsonParse(data: any): any | undefined {