expect-playwright - npm Package Compare versions

Comparing version 0.3.4 to 0.4.0

global.d.ts

@@ -12,3 +12,3 @@ // copied into our codebase for autocompletion purposes
    */
-  state?: "attached" | "detached" | "visible" | "hidden";
+  state?: "attached" | "detached" | "visible" | "hidden"
 
@@ -22,3 +22,3 @@ /**
    */
-  timeout?: number;
+  timeout?: number
 }
@@ -28,25 +28,39 @@
   /**
-  * Will check if the element's textContent on the page determined by the selector includes the given text.
-  */
-  toHaveText(selector: string, value: string, options?: PageWaitForSelectorOptions): Promise<R>;
+   * Will check if the element's textContent on the page determined by the selector includes the given text.
+   */
+  toHaveText(
+    selector: string,
+    value: string,
+    options?: PageWaitForSelectorOptions
+  ): Promise<R>
   /**
-  * Will check if the element's value includes the given text.
-  */
-  toHaveText(value: string): Promise<R>;
+   * Will check if the element's value includes the given text.
+   */
+  toHaveText(value: string, options?: PageWaitForSelectorOptions): Promise<R>
   /**
-  * Will compare the element's textContent on the page determined by the selector with the given text.
-  */
-  toEqualText(selector: string, value: string, options?: PageWaitForSelectorOptions): Promise<R>;
+   * Will compare the element's textContent on the page determined by the selector with the given text.
+   */
+  toEqualText(
+    selector: string,
+    value: string,
+    options?: PageWaitForSelectorOptions
+  ): Promise<R>
   /**
-  * Will compare the element's textContent by the given text.
-  */
-  toEqualText(value: string, options?: PageWaitForSelectorOptions): Promise<R>;
+   * Will compare the element's textContent by the given text.
+   */
+  toEqualText(value: string, options?: PageWaitForSelectorOptions): Promise<R>
   /**
-  * Will ensure that the element is on the page.
-  */
-  toHaveSelector(selector: string, options?: PageWaitForSelectorOptions): Promise<R>;
+   * Will ensure that the element is on the page.
+   */
+  toHaveSelector(
+    selector: string,
+    options?: PageWaitForSelectorOptions
+  ): Promise<R>
   /**
    * Will ensure that the element has focus.
    */
-  toHaveFocus(selector: string, options?: PageWaitForSelectorOptions): Promise<R>;
+  toHaveFocus(
+    selector: string,
+    options?: PageWaitForSelectorOptions
+  ): Promise<R>
   /**
@@ -56,15 +70,23 @@ * Will assert that N elements with the given selector are on the page and wait for it by default.
    */
-  toHaveSelectorCount(selector: string, count: number, options?: PageWaitForSelectorOptions): Promise<R>;
+  toHaveSelectorCount(
+    selector: string,
+    count: number,
+    options?: PageWaitForSelectorOptions
+  ): Promise<R>
   /**
-  * Will compare the element's value on the page determined by the selector with the given value.
-  */
-  toEqualValue(selector: string, value: string, options?: PageWaitForSelectorOptions): Promise<R>;
+   * Will compare the element's value on the page determined by the selector with the given value.
+   */
+  toEqualValue(
+    selector: string,
+    value: string,
+    options?: PageWaitForSelectorOptions
+  ): Promise<R>
   /**
-  * Will compare element's value with the given value.
-  */
-  toEqualValue(value: string, options?: PageWaitForSelectorOptions): Promise<R>;
+   * Will compare element's value with the given value.
+   */
+  toEqualValue(value: string, options?: PageWaitForSelectorOptions): Promise<R>
   /**
-  * Will assert the given URL with the page's URL
-  */
-  toEqualUrl(value: string): Promise<R>;
+   * Will assert the given URL with the page's URL
+   */
+  toEqualUrl(value: string): Promise<R>
 }
@@ -74,4 +96,4 @@
   namespace jest {
-    interface Matchers<R> extends PlaywrightMatchers<R> { }
+    interface Matchers<R> extends PlaywrightMatchers<R> {}
   }
 }

lib/index.js

@@ -5,19 +5,10 @@ "use strict";
 };
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.matchers = void 0;
 const matchers_1 = __importDefault(require("./matchers"));
+exports.matchers = matchers_1.default;
 // @ts-ignore
-if (typeof global.expect !== 'undefined') {
+if (typeof global.expect !== "undefined") {
     // @ts-ignore
     global.expect.extend(matchers_1.default);
 }
-const expectWrapper = (pageOrElement) => Object.entries(matchers_1.default).reduce((acc, [name, matcher]) => ({
-    ...acc,
-    [name]: async (...args) => {
-        // @ts-ignore
-        const result = await matcher(pageOrElement, ...args);
-        if (!result.pass) {
-            throw new Error(result.message());
-        }
-        return true;
-    }
-}), {});
-module.exports = expectWrapper;

lib/matchers/tests/utils.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.testWrapper = void 0;
-const testWrapper = (result) => {
-    if (result.pass) {
-        return true;
-    }
-    return () => {
-        throw new Error(result.message());
-    };
+exports.assertSnapshot = void 0;
+const assertSnapshot = async (fn) => {
+    await expect(fn).rejects.toThrowErrorMatchingSnapshot();
 };
-exports.testWrapper = testWrapper;
+exports.assertSnapshot = assertSnapshot;

lib/matchers/toEqualText/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const utils_1 = require("../utils");
-const toEqualText = async (...args) => {
+const toEqualText = async function (...args) {
     try {
-        const { elementHandle, selector, expectedValue } = await utils_1.getElementText(...args);
+        const { elementHandle, expectedValue } = await utils_1.getElementText(...args);
         /* istanbul ignore next */
         const actualTextContent = await elementHandle.evaluate((el) => el.textContent);
-        if (actualTextContent === expectedValue) {
-            return {
-                pass: true,
-                message: () => `${utils_1.quote(expectedValue)} does equal ${utils_1.quote(actualTextContent)}.`
-            };
-        }
         return {
-            pass: false,
-            message: () => `${utils_1.quote(expectedValue)} does not equal ${utils_1.quote(actualTextContent)}${selector ? ' of ' + utils_1.quote(selector) + "." : '.'}`
+            pass: actualTextContent === expectedValue,
+            message: () => utils_1.getMessage(this, "toEqualText", expectedValue, actualTextContent),
         };
@@ -23,3 +17,3 @@ }
             pass: false,
-            message: () => err.toString()
+            message: () => err.toString(),
         };
@@ -26,0 +20,0 @@ }

lib/matchers/toEqualUrl/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const utils_1 = require("../utils");
-const toEqualUrl = async (page, expectedUrl) => {
+const toEqualUrl = async function (page, expectedUrl) {
     const actualUrl = page.url();
-    if (actualUrl === expectedUrl) {
-        return {
-            pass: true,
-            message: () => `${utils_1.quote(expectedUrl)} matches the given Url.`
-        };
-    }
     return {
-        pass: false,
-        message: () => `${utils_1.quote(expectedUrl)} expects not the current Url: ${utils_1.quote(actualUrl)}`
+        pass: actualUrl === expectedUrl,
+        message: () => utils_1.getMessage(this, "toEqualUrl", expectedUrl, actualUrl),
     };
 };
 exports.default = toEqualUrl;

lib/matchers/toEqualValue/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const utils_1 = require("../utils");
-const toEqualValue = async (...args) => {
+const toEqualValue = async function (...args) {
     try {
-        const { elementHandle, selector, expectedValue } = await utils_1.getElementText(...args);
+        const { elementHandle, expectedValue } = await utils_1.getElementText(...args);
         /* istanbul ignore next */
         const actualTextContent = await elementHandle.evaluate((el) => el.value);
-        if (actualTextContent === null || actualTextContent === void 0 ? void 0 : actualTextContent.includes(expectedValue)) {
-            return {
-                pass: true,
-                message: () => `${utils_1.quote(expectedValue)} does equal ${utils_1.quote(actualTextContent)}.`
-            };
-        }
         return {
-            pass: false,
-            message: () => `${utils_1.quote(expectedValue)} does not equal ${utils_1.quote(actualTextContent)}${selector ? ' of ' + utils_1.quote(selector) + "." : '.'}`
+            pass: actualTextContent === null || actualTextContent === void 0 ? void 0 : actualTextContent.includes(expectedValue),
+            message: () => utils_1.getMessage(this, "toEqualValue", expectedValue, actualTextContent),
         };
@@ -23,3 +17,3 @@ }
             pass: false,
-            message: () => err.toString()
+            message: () => err.toString(),
         };
@@ -26,0 +20,0 @@ }

lib/matchers/toHaveFocus/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const utils_1 = require("../utils");
-const toHaveFocus = async (page, selector, options = {}) => {
+async function isFocused(page, selector, options = {}) {
     try {
@@ -9,20 +8,26 @@ await page.waitForSelector(selector, options);
         const isFocused = await page.$eval(selector, (el) => el === document.activeElement);
-        if (isFocused) {
-            return {
-                pass: true,
-                message: () => `${utils_1.quote(selector)} has focus on it.`
-            };
-        }
-        return {
-            pass: false,
-            message: () => `${utils_1.quote(selector)} has no focus on it.`
-        };
+        return { pass: isFocused, reason: 1 /* NotFocused */ };
     }
-    catch (err) {
-        return {
-            pass: false,
-            message: () => `${utils_1.quote(selector)} could not be found on the page.`
-        };
+    catch (e) {
+        return { pass: false, reason: 0 /* NotFound */ };
     }
+}
+const toHaveFocus = async function (page, selector, options = {}) {
+    const result = await isFocused(page, selector, options);
+    return {
+        pass: result.pass,
+        message: () => {
+            const not = this.isNot ? " not" : "";
+            const hint = this.utils.matcherHint("toHaveFocus", undefined, undefined, {
+                isNot: this.isNot,
+                promise: this.promise,
+            });
+            const message = result.reason === 0 /* NotFound */
+                ? `Expected: element to${not} have focus\n` +
+                    "Received: element was not found"
+                : `Expected: element to${not} have focus`;
+            return hint + "\n\n" + message;
+        },
+    };
 };
 exports.default = toHaveFocus;

lib/matchers/toHaveSelector/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const utils_1 = require("../utils");
-const toHaveSelector = async (page, selector, options = {}) => {
-    try {
-        await page.waitForSelector(selector, options);
-        return {
-            pass: true,
-            message: () => `${utils_1.quote(selector)} was found on the page.`
-        };
-    }
-    catch (err) {
-        return {
-            pass: false,
-            message: () => `${utils_1.quote(selector)} could not be found on the page.`
-        };
-    }
+const toHaveSelector = async function (page, selector, options = {}) {
+    const pass = await page
+        .waitForSelector(selector, options)
+        .then(() => true)
+        .catch(() => false);
+    return {
+        pass: pass,
+        message: () => {
+            const not = this.isNot ? " not" : "";
+            const hint = this.utils.matcherHint("toHaveSelector", undefined, undefined, { isNot: this.isNot, promise: this.promise });
+            return (hint +
+                "\n\n" +
+                `Expected: page to${not} have selector ${this.utils.printExpected(selector)}`);
+        },
+    };
 };
 exports.default = toHaveSelector;

lib/matchers/toHaveSelectorCount/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const utils_1 = require("../utils");
-const toHaveSelectorCount = async (page, selector, expectedValue, options = {}) => {
+const toHaveSelectorCount = async function (page, selector, expectedValue, options = {}) {
     try {
-        await page.waitForSelector(selector, { state: 'attached', ...options });
+        await page.waitForSelector(selector, { state: "attached", ...options });
         /* istanbul ignore next */
-        const actualCount = await page.$$eval(selector, el => el.length);
-        if (actualCount === expectedValue) {
-            return {
-                pass: true,
-                message: () => `${utils_1.quote(`${expectedValue}`)} does equal ${utils_1.quote(`${actualCount}`)}.`
-            };
-        }
+        const actualCount = await page.$$eval(selector, (el) => el.length);
         return {
-            pass: false,
-            message: () => `${utils_1.quote(`${expectedValue}`)} does not equal ${utils_1.quote(`${actualCount}`)}${selector ? ' of ' + utils_1.quote(selector) + "." : '.'}`
+            pass: actualCount === expectedValue,
+            message: () => utils_1.getMessage(this, "toHaveSelectorCount", expectedValue, actualCount),
         };
@@ -23,3 +17,3 @@ }
             pass: false,
-            message: () => `${utils_1.quote(selector)} could not be found on the page.`
+            message: () => `${utils_1.quote(selector)} could not be found on the page.`,
         };
@@ -26,0 +20,0 @@ }

lib/matchers/toHaveText/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const utils_1 = require("../utils");
-const toHaveText = async (...args) => {
+const toHaveText = async function (...args) {
     try {
-        const { elementHandle, selector, expectedValue } = await utils_1.getElementText(...args);
+        const { elementHandle, expectedValue } = await utils_1.getElementText(...args);
         /* istanbul ignore next */
         const actualTextContent = await elementHandle.evaluate((el) => el.textContent);
-        if (actualTextContent === null || actualTextContent === void 0 ? void 0 : actualTextContent.includes(expectedValue)) {
-            return {
-                pass: true,
-                message: () => `${utils_1.quote(expectedValue)} is included in ${utils_1.quote(actualTextContent)}.`
-            };
-        }
         return {
-            pass: false,
-            message: () => `${utils_1.quote(expectedValue)} is not included in ${utils_1.quote(actualTextContent)}${selector ? ' of ' + utils_1.quote(selector) + "." : '.'}`
+            pass: !!(actualTextContent === null || actualTextContent === void 0 ? void 0 : actualTextContent.includes(expectedValue)),
+            message: () => utils_1.getMessage(this, "toHaveText", expectedValue, actualTextContent),
         };
@@ -23,3 +17,3 @@ }
             pass: false,
-            message: () => err.toString()
+            message: () => err.toString(),
         };
@@ -26,0 +20,0 @@ }

lib/matchers/utils.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.quote = exports.getElementText = exports.detectExpectType = void 0;
+exports.getMessage = exports.quote = exports.getElementText = exports.detectExpectType = void 0;
 const ExpectTypePage = "Page";
@@ -43,3 +43,3 @@ const ExpectTypeElementHandle = "ElementHandle";
                     elementHandle: elem,
-                    expectedValue: args[1]
+                    expectedValue: args[1],
                 };
@@ -49,4 +49,4 @@ }
             return {
-                elementHandle: await page.$("body"),
-                expectedValue: args[1]
+                elementHandle: (await page.$("body")),
+                expectedValue: args[1],
             };
@@ -69,5 +69,4 @@ }
             return {
-                elementHandle: await page.$(selector),
+                elementHandle: (await page.$(selector)),
                 expectedValue: args[2],
-                selector
             };
@@ -86,5 +85,4 @@ }
             return {
-                elementHandle: await elem.$(selector),
+                elementHandle: (await elem.$(selector)),
                 expectedValue: args[2],
-                selector
             };
@@ -96,3 +94,13 @@ }
 exports.getElementText = getElementText;
-const quote = (val) => `'${val}'`;
+const quote = (val) => (val === null ? "" : `'${val}'`);
 exports.quote = quote;
+const getMessage = ({ isNot, promise, utils }, matcher, expected, received) => {
+    const message = isNot
+        ? `Expected: not ${utils.printExpected(expected)}`
+        : `Expected: ${utils.printExpected(expected)}\n` +
+            `Received: ${utils.printReceived(received)}`;
+    return (utils.matcherHint(matcher, undefined, undefined, { isNot, promise }) +
+        "\n\n" +
+        message);
+};
+exports.getMessage = getMessage;

package.json

 {
   "name": "expect-playwright",
-  "version": "0.3.4",
+  "version": "0.4.0",
   "main": "lib/index.js",
@@ -15,14 +15,15 @@ "types": "./global.d.ts",
   "peerDependencies": {
-    "playwright-core": "^1.10.0"
+    "playwright-core": "^1.11.0"
   },
   "devDependencies": {
-    "@types/jest": "^26.0.22",
-    "@types/node": "^14.14.41",
+    "@types/jest": "^26.0.23",
+    "@types/node": "^15.0.2",
     "jest": "^26.6.3",
     "jest-playwright-preset": "^1.5.1",
-    "playwright-chromium": "^1.10.0",
-    "playwright-core": "^1.10.0",
-    "ts-jest": "^26.5.5",
+    "playwright-chromium": "^1.11.0",
+    "playwright-core": "^1.11.0",
+    "prettier": "^2.3.0",
+    "ts-jest": "^26.5.6",
     "typescript": "^4.2.4"
   }
 }

README.md

@@ -21,12 +21,16 @@ # expect-playwright
 {
-    "setupFilesAfterEnv": ["expect-playwright"]
+  "setupFilesAfterEnv": ["expect-playwright"]
 }
 ```
 
-### Without Jest
+### With Playwright test runner
 
-```javascript
-import expect from "expect-playwright"
+To activate with the Playwright test runner, use `expect.extend` to add the `expect-playwright` matchers.
 
-await expect(page).toHaveText("#foo", "my text")
+```js
+// folio.config.ts
+import { expect } from "@playwright/test"
+import { matchers } from "expect-playwright"
+
+expect.extend(matchers)
 ```
@@ -43,3 +47,3 @@
 await page.waitForSelector("#foo")
-const textContent = await page.$eval("#foo", el => el.textContent)
+const textContent = await page.$eval("#foo", (el) => el.textContent)
 expect(textContent).stringContaining("my text")
@@ -73,3 +77,3 @@
 await expect(page).not.toHaveSelector("#foobar", {
-  timeout: 1 * 1000
+  timeout: 1 * 1000,
 })
@@ -88,3 +92,3 @@ ```
 await expect(page).not.toHaveFocus("#foobar", {
-  timeout: 1 * 1000
+  timeout: 1 * 1000,
 })
@@ -138,3 +142,3 @@ ```
 ```javascript
-const element = await page.$('#my-element');
+const element = await page.$("#my-element")
 await expect(element).toHaveText("Playwright")
@@ -168,3 +172,3 @@ ```
 ```javascript
-const element = await page.$('#my-element');
+const element = await page.$("#my-element")
 await expect(element).toEqualText("Playwright")
@@ -190,3 +194,3 @@ ```
 ```javascript
-const element = await page.$('#my-element');
+const element = await page.$("#my-element")
 await expect(element).toEqualValue("Playwright")
@@ -198,3 +202,3 @@ ```
 ```typescript
-import playwright from 'playwright-chromium'
+import playwright from "playwright-chromium"
 
@@ -208,3 +212,5 @@ describe("GitHub Playwright project", () => {
     // or also all of them via the not property
-    await expect(page).not.toHaveText("this-is-no-anywhere", { timeout: 1 * 1000 })
+    await expect(page).not.toHaveText("this-is-no-anywhere", {
+      timeout: 1 * 1000,
+    })
     await browser.close()
@@ -229,4 +235,4 @@ })
 
-[ElementHandle]: https://github.com/microsoft/playwright/blob/master/docs/api.md#class-elementhandle
-[Page]: https://github.com/microsoft/playwright/blob/master/docs/api.md#class-page
-[Playwright]: https://github.com/microsoft/Playwright
+[elementhandle]: https://github.com/microsoft/playwright/blob/master/docs/api.md#class-elementhandle
+[page]: https://github.com/microsoft/playwright/blob/master/docs/api.md#class-page
+[playwright]: https://github.com/microsoft/Playwright

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

229

increased by2.69%

Worsened metrics

Total package byte prevSize

23414

decreased by-27.38%

Dev dependency count

9

increased by12.5%

Number of package files

17

decreased by-15%

Lines of code

379

decreased by-2.32%

No dependency changes