@playwright/test - npm Package Compare versions

Comparing version 0.1112.0-alpha1 to 0.1112.0-alpha2

out/index.js

@@ -44,3 +44,10 @@ "use strict";
 const util = __importStar(require("util"));
-const headedOption = folio.registerCLIOption('headed', 'Run tests in headed browsers (default: headless)', { type: 'boolean' });
+let headedOption;
+try {
+    headedOption = folio.registerCLIOption('headed', 'Run tests in headed browsers (default: headless)', { type: 'boolean' });
+}
+catch (e) {
+    if (!e.message.includes('must be called from a configuration file'))
+        throw e;
+}
 /**
@@ -65,3 +72,3 @@ * These tests are executed in Playwright environment that launches the browser
                 options.channel = channel;
-            if (headedOption.value)
+            if (headedOption && headedOption.value)
                 options.headless = false;
@@ -68,0 +75,0 @@ const browser = await playwright[browserName].launch(options);

package.json

 {
   "name": "@playwright/test",
-  "version": "0.1112.0-alpha1",
+  "version": "0.1112.0-alpha2",
   "license": "Apache-2.0",
@@ -23,3 +23,3 @@ "author": {
   "dependencies": {
-    "folio": "=0.4.0-alpha17",
+    "folio": "=0.4.0-alpha18",
     "playwright": "=1.11.1",
@@ -26,0 +26,0 @@ "rimraf": "^3.0.2"

README.md

@@ -20,6 +20,8 @@ # ⚠️ This project is not ready for production. Stay tuned! ⚠️
   - [Visual comparisons](#visual-comparisons)
+  - [Page object model](#page-object-model)
 - [Configuration](#configuration)
   - [Modify options](#modify-options)
   - [Skip tests with annotations](#skip-tests-with-annotations)
-  - [Export JUnit report](#export-junit-report)
+  - [Run tests in parallel](#run-tests-in-parallel)
+  - [Reporters](#reporters)
 
@@ -48,4 +50,6 @@ ## Get started
 
-The test runner provides browser primitives as arguments to your test functions. Test functions can use one or more of these arguments.
+Playwright test runner is based on the [Folio] framework, and includes all the features available in Folio. For example, Playwright test runner provides test fixtures for browser primitives.
 
+These browser primitives are available as arguments to your test functions, and can be used one by one or together.
+
 - `page`: Instance of [Page][page]. Each test gets a new isolated page to run the test.
@@ -71,4 +75,4 @@ - `context`: Instance of [BrowserContext][browser-context]. Each test gets a new isolated context to run the test. The `page` object belongs to this context. Learn [how to configure](#modify-options) context creation.
 
-```js
-const { test, expect } = require("@playwright/test");
+```ts
+import { test, expect } from "@playwright/test";
 
@@ -93,37 +97,38 @@ test.describe("feature foo", () => {
 ```ts
-import { PlaywrightTestProject } from "@playwright/test";
+import { PlaywrightTestConfig } from "@playwright/test";
 
-const projects: PlaywrightTestProject[] = [
-  {
-    name: 'chromium',
-    use: {
-      browserName: 'chromium',
-      headless: true,
-      viewport: { width: 1280, height: 720 },
-    },
-  },
+const config: PlaywrightTestConfig = {
+  timeout: 30000,  // Each test is given 30 seconds.
 
-  {
-    name: 'webkit',
-    use: {
-      browserName: 'webkit',
-      headless: true,
-      viewport: { width: 1280, height: 720 },
+  // A project per browser, each running all the tests.
+  projects: [
+    {
+      name: 'chromium',
+      use: {
+        browserName: 'chromium',
+        headless: true,
+        viewport: { width: 1280, height: 720 },
+      },
     },
-  },
 
-  {
-    name: 'firefox',
-    use: {
-      browserName: 'firefox',
-      headless: true,
-      viewport: { width: 1280, height: 720 },
+    {
+      name: 'webkit',
+      use: {
+        browserName: 'webkit',
+        headless: true,
+        viewport: { width: 1280, height: 720 },
+      },
     },
-  }
-];
 
-module.exports = {
-  timeout: 30000,  // Each test is given 30 seconds.
-  projects,
+    {
+      name: 'firefox',
+      use: {
+        browserName: 'firefox',
+        headless: true,
+        viewport: { width: 1280, height: 720 },
+      },
+    }
+  ],
 };
+export default config;
 ```
@@ -142,5 +147,2 @@
 
-# Run tests in parallel
-$ npx folio --config=config.ts --workers=5
-
 # Run tests sequentially
@@ -178,3 +180,3 @@ $ npx folio --config=config.ts --workers=1
 
-```js
+```ts
 import { test } from "@playwright/test";
@@ -193,42 +195,21 @@
 
-```diff
+```ts
 // config.ts
-import { PlaywrightTestProject } from "@playwright/test";
-+ import { devices } from "playwright";
+import { PlaywrightTestConfig } from "@playwright/test";
+import { devices } from "playwright";
 
-const projects: PlaywrightTestProject[] = [
-  {
-    name: 'chromium',
-    use: {
-      browserName: 'chromium',
-      headless: true,
--     viewport: { width: 1280, height: 720 },
-+     ...devices["Pixel 2"],
+const config: PlaywrightTestConfig = {
+  timeout: 30000,
+  projects: [
+    {
+      name: 'chromium',
+      use: {
+        browserName: 'chromium',
+        headless: true,
+        ...devices["Pixel 2"],
+      },
     },
-  },
-
-  {
-    name: 'webkit',
-    use: {
-      browserName: 'webkit',
-      headless: true,
--     viewport: { width: 1280, height: 720 },
-+     ...devices["iPhone 11"],
-    },
-  },
-
-  {
-    name: 'firefox',
-    use: {
-      browserName: 'firefox',
-      headless: true,
-      viewport: { width: 1280, height: 720 },
-    },
-  }
-];
-
-module.exports = {
-  timeout: 30000,  // Each test is given 30 seconds.
-  projects,
+  ],
 };
+export default config;
 ```
@@ -240,3 +221,3 @@
 
-```js
+```ts
 // In foo.spec.ts
@@ -263,3 +244,3 @@ import { test, expect } from "@playwright/test";
 
-```js
+```ts
 import { test, expect } from "@playwright/test";
@@ -281,2 +262,43 @@
 
+### Page object model
+
+To introduce a Page Object for a particular page, create a class that will use the `page` object.
+
+Create a `LoginPage` helper class to encapsulate common operations on the login page.
+```ts
+// login-page.ts
+export class LoginPage {
+  constructor(page) {
+    this.page = page;
+  }
+
+  async goto() {
+    await this.page.goto("https://example.com/login");
+  }
+
+  async login() {
+    await this.page.fill("#username", TEST_USERNAME);
+    await this.page.fill("#password", TEST_PASSWORD);
+    await this.page.click("text=Login");
+  }
+}
+```
+
+Use the `LoginPage` class in the tests.
+```ts
+// my.spec.ts
+import { test, expect } from "@playwright/test";
+import { LoginPage } from "./login-page";
+
+test('login works', async ({ page }) => {
+  // Create the login page and perform operations.
+  const loginPage = new LoginPage(page);
+  await loginPage.goto();
+  await loginPage.login();
+
+  // Verify it worked.
+  expect(await page.textContent("#user-info")).toBe("Welcome, Test User!");
+});
+```
+
 -----------
@@ -296,51 +318,32 @@
 
-```diff
+```ts
 // config.ts
-import { PlaywrightTestProject } from "@playwright/test";
+import { PlaywrightTestConfig } from "@playwright/test";
 
-const projects: PlaywrightTestProject[] = [
-  {
-    name: 'chromium',
-    use: {
-      browserName: 'chromium',
--     headless: true,
--     viewport: { width: 1280, height: 720 },
-+
-+     // Launch options:
-+     headless: false,
-+     slowMo: 50,
-+
-+     // Context options:
-+     viewport: { width: 800, height: 600 },
-+     ignoreHTTPSErrors: true,
-+
-+     // Testing options:
-+     video: 'retain-on-failure',    },
-  },
+const config: PlaywrightTestConfig = {
+  // Each test is given 90 seconds.
+  timeout: 90000,
+  // Failing tests will be retried at most two times.
+  retries: 2,
+  projects: [
+    {
+      name: 'chromium',
+      use: {
+        browserName: 'chromium',
 
-  {
-    name: 'webkit',
-    use: {
-      browserName: 'webkit',
-      headless: true,
-      viewport: { width: 1280, height: 720 },
-    },
-  },
+        // Launch options
+        headless: false,
+        slowMo: 50,
 
-  {
-    name: 'firefox',
-    use: {
-      browserName: 'firefox',
-      headless: true,
-      viewport: { width: 1280, height: 720 },
+        // Context options
+        viewport: { width: 800, height: 600 },
+        ignoreHTTPSErrors: true,
+
+        // Testing options
+        video: 'retain-on-failure',
+      },
     },
-  }
-];
-
-module.exports = {
-- timeout: 30000,  // Each test is given 30 seconds.
-+ timeout: 90000,  // Each test is given 90 seconds.
-+ retries: 2,  // Failing tests will be retried at most two times.
-  projects,
+  ],
 };
+export default config;
 ```
@@ -382,2 +385,3 @@
 Most notable testing options from [Folio documentation][folio]:
+- `reporter: 'dot' | 'line' | 'list'` - Choose a reporter: minimalist `dot`, concise `line` or detailed `list`. See [Folio reporters][folio-reporters] for more details.
 - `retries: number` - Each failing test will be retried up to the certain number of times.
@@ -392,3 +396,3 @@ - `testDir: string` - Directory where test runner should search for test files.
 
-```js
+```ts
 test("should be skipped on firefox", async ({ page, browserName }) => {
@@ -400,49 +404,79 @@ test.skip(browserName === "firefox", "optional description for the skip");
 
-### Export JUnit report
+### Run tests in parallel
 
-The Playwright test runner supports various reporters, including exporting as a JUnit compatible XML file.
+Tests are run in parallel by default, using multiple worker processes. You can control the parallelism with the `workers` option in the configuration file or from the command line.
 
-```diff
+```sh
+# Run just a single test at a time - no parallelization
+npx folio --workers=1
+
+# Run up to 10 tests in parallel
+npx folio --workers=10
+```
+
+```ts
 // config.ts
-import { PlaywrightTestProject } from "@playwright/test";
+import { PlaywrightTestConfig } from "@playwright/test";
 
-const projects: PlaywrightTestProject[] = [
-  {
-    name: 'chromium',
-    use: {
-      browserName: 'chromium',
-      headless: true,
-      viewport: { width: 1280, height: 720 },
-    },
-  },
+const config: PlaywrightTestConfig = {
+  // No parallelization on CI, default value locally.
+  worker: process.env.CI ? 1 : undefined,
+  projects: [
+    // Your projects go here
+  ],
+};
+export default config;
+```
 
-  {
-    name: 'webkit',
-    use: {
-      browserName: 'webkit',
-      headless: true,
-      viewport: { width: 1280, height: 720 },
-    },
-  },
+By default, test runner chooses the number of workers based on available CPUs.
 
-  {
-    name: 'firefox',
-    use: {
-      browserName: 'firefox',
-      headless: true,
-      viewport: { width: 1280, height: 720 },
-    },
-  }
-];
+### Reporters
 
-module.exports = {
-  timeout: 30000,  // Each test is given 30 seconds.
-+ reporter: [
-+  'list',  // Terminal output
-+  { name: 'junit', outputFile: 'report.xml' },  // And junit report
-+ ],
-  projects,
+Playwright test runner comes with a few built-in reporters for different needs and ability to provide custom reporters. The easiest way to try out built-in reporters is to pass `--reporter` [command line option](#command-line). Built-in terminal reporters are minimalist `dot`, concise `line` and detailed `list`.
+
+```sh
+npx folio --reporter=line
+npx folio --reporter=dot
+npx folio --reporter=list
+```
+
+Alternatively, you can specify the reporter in the configuration file.
+```ts
+// config.ts
+import { PlaywrightTestConfig } from "@playwright/test";
+
+const config: PlaywrightTestConfig = {
+  // Concise 'dot' on CI, more interactive 'list' when running locally
+  reporter: process.env.CI ? 'dot' : 'line',
+  projects: [
+    // Your projects go here
+  ],
 };
+export default config;
 ```
 
+#### Export JUnit or JSON report
+
+The Playwright test runner includes reporters that produce a JUnit compatible XML file or a JSON file with test results.
+
+```ts
+// config.ts
+import { PlaywrightTestConfig } from "@playwright/test";
+
+const config: PlaywrightTestConfig = {
+  reporter: [
+    // Live output to the terminal
+    'list',
+    // JUnit compatible xml report
+    { name: 'junit', outputFile: 'report.xml' },
+    // JSON file with test results
+    { name: 'json', outputFile: 'report.json' },
+  ]
+  projects: [
+    // Your projects go here
+  ],
+};
+export default config;
+```
+
 [multi-page]: https://playwright.dev/docs/multi-pages
@@ -455,1 +489,2 @@ [browser]: https://playwright.dev/docs/api/class-browser
 [folio-cli]: https://github.com/microsoft/folio#command-line
+[folio-reporters]: https://github.com/microsoft/folio#reporters

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

43739

increased by5.01%

Lines of code

423

increased by1.68%

Number of lines in readme file

476

increased by7.94%

Number of medium supply chain risk alerts

0

decreased by-100%

Dependency changes

• Updatedfolio@=0.4.0-alpha18