@nx/playwright 16.7.0-beta.1

package/CHANGELOG.md

@@ -0,0 +1,8 @@
+# Change Log
+
+All notable changes to this project will be documented in this file.
+See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+
+
+**Note:** Version bump only for package @nx/playwright

package/LICENSE

@@ -0,0 +1,22 @@
+(The MIT License)
+
+Copyright (c) 2017-2023 Narwhal Technologies Inc.
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+'Software'), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
+IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY
+CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
+TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
+SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/README.md

@@ -0,0 +1,61 @@
+<p style="text-align: center;"><img src="https://raw.githubusercontent.com/nrwl/nx/master/images/nx.png" width="600" alt="Nx - Smart, Fast and Extensible Build System"></p>
+
+<div style="text-align: center;">
+
+[![CircleCI](https://circleci.com/gh/nrwl/nx.svg?style=svg)](https://circleci.com/gh/nrwl/nx)
+[![License](https://img.shields.io/npm/l/@nx/workspace.svg?style=flat-square)]()
+[![NPM Version](https://badge.fury.io/js/%40nrwl%2Fworkspace.svg)](https://www.npmjs.com/@nx/workspace)
+[![Semantic Release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg?style=flat-square)]()
+[![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/)
+[![Join the chat at https://gitter.im/nrwl-nx/community](https://badges.gitter.im/nrwl-nx/community.svg)](https://gitter.im/nrwl-nx/community?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
+[![Join us @nx/community on slack](https://img.shields.io/badge/slack-%40nrwl%2Fcommunity-brightgreen)](https://join.slack.com/t/nrwlcommunity/shared_invite/enQtNzU5MTE4OTQwOTk0LTgxY2E0ZWYzMWE0YzA5ZDA2MWM1NDVhNmI2ZWMyYmZhNWJiODk3MjkxZjY3MzU5ZjRmM2NmNWU1OTgyZmE4Mzc)
+
+</div>
+
+
+<hr>
+
+# Nx: Smart, Fast and Extensible Build System
+
+Nx is a next generation build system with first class monorepo support and powerful integrations.
+
+## Getting Started
+
+### Creating an Nx Workspace
+
+**Using `npx`**
+
+```bash
+npx create-nx-workspace
+```
+
+**Using `npm init`**
+
+```bash
+npm init nx-workspace
+```
+
+**Using `yarn create`**
+
+```bash
+yarn create nx-workspace
+```
+
+### Adding Nx to an Existing Repository
+
+Run:
+
+```bash
+npx nx@latest init
+```
+
+## Documentation & Resources
+
+- [Nx.Dev: Documentation, Guides, Tutorials](https://nx.dev)
+- [Intro to Nx](https://nx.dev/getting-started/intro)
+- [Official Nx YouTube Channel](https://www.youtube.com/@NxDevtools)
+- [Blog Posts About Nx](https://blog.nrwl.io/nx/home)
+
+<p style="text-align: center;"><a href="https://nx.dev/#learning-materials" target="_blank" rel="noreferrer"><img src="https://raw.githubusercontent.com/nrwl/nx/master/images/nx-courses-and-videos.svg" 
+width="100%" alt="Nx - Smart, Fast and Extensible Build System"></a></p>
+

package/executors.json

@@ -0,0 +1,16 @@
+{
+  "builders": {
+    "playwright": {
+      "implementation": "./src/executors/playwright/compat",
+      "schema": "./src/executors/playwright/schema.json",
+      "description": "Run Playwright tests."
+    }
+  },
+  "executors": {
+    "playwright": {
+      "implementation": "./src/executors/playwright/playwright",
+      "schema": "./src/executors/playwright/schema.json",
+      "description": "Run Playwright tests."
+    }
+  }
+}

package/generators.json

@@ -0,0 +1,28 @@
+{
+  "name": "Nx Playwright",
+  "version": "0.1",
+  "schematics": {
+    "configuration": {
+      "factory": "./src/generators/configuration/configuration#configurationSchematic",
+      "schema": "./src/generators/configuration/schema.json",
+      "description": "Add Nx Playwright configuration to your project"
+    },
+    "init": {
+      "factory": "./src/generators/init/init#initSchematic",
+      "schema": "./src/generators/init/schema.json",
+      "description": "Initializes a Playwright project in the current workspace"
+    }
+  },
+  "generators": {
+    "configuration": {
+      "factory": "./src/generators/configuration/configuration",
+      "schema": "./src/generators/configuration/schema.json",
+      "description": "Add Nx Playwright configuration to your project"
+    },
+    "init": {
+      "factory": "./src/generators/init/init",
+      "schema": "./src/generators/init/schema.json",
+      "description": "Initializes a Playwright project in the current workspace"
+    }
+  }
+}

package/index.d.ts

@@ -0,0 +1,3 @@
+export { playwrightExecutor, PlaywrightExecutorSchema, } from './src/executors/playwright/playwright';
+export { initGenerator } from './src/generators/init/init';
+export { configurationGenerator } from './src/generators/configuration/configuration';

package/index.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.configurationGenerator = exports.initGenerator = exports.playwrightExecutor = void 0;
+var playwright_1 = require("./src/executors/playwright/playwright");
+Object.defineProperty(exports, "playwrightExecutor", { enumerable: true, get: function () { return playwright_1.playwrightExecutor; } });
+var init_1 = require("./src/generators/init/init");
+Object.defineProperty(exports, "initGenerator", { enumerable: true, get: function () { return init_1.initGenerator; } });
+var configuration_1 = require("./src/generators/configuration/configuration");
+Object.defineProperty(exports, "configurationGenerator", { enumerable: true, get: function () { return configuration_1.configurationGenerator; } });

package/package.json

@@ -0,0 +1,61 @@
+{
+  "name": "@nx/playwright",
+  "version": "16.7.0-beta.1",
+  "type": "commonjs",
+  "homepage": "https://nx.dev",
+  "private": false,
+  "publishConfig": {
+    "access": "public"
+  },
+  "description": "The Nx Plugin for Playwright contains executors and generators allowing your workspace to use the powerful Playwright integration testing capabilities.",
+  "keywords": [
+    "Monorepo",
+    "Angular",
+    "React",
+    "Web",
+    "Node",
+    "Nest",
+    "Jest",
+    "Playwright",
+    "CLI"
+  ],
+  "main": "./index.js",
+  "typings": "./index.d.ts",
+  "author": "Victor Savkin",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/nrwl/nx/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/nrwl/nx.git",
+    "directory": "packages/playwright"
+  },
+  "dependencies": {
+    "@nx/devkit": "16.7.0-beta.1",
+    "@nx/linter": "16.7.0-beta.1",
+    "tslib": "^2.3.0"
+  },
+  "peerDependencies": {
+    "@playwright/test": "^1.36.0"
+  },
+  "peerDependenciesMeta": {
+    "@playwright/test": {
+      "optional": true
+    }
+  },
+  "executors": "./executors.json",
+  "generators": "./generators.json",
+  "exports": {
+    ".": "./index.js",
+    "./package.json": "./package.json",
+    "./migrations.json": "./migrations.json",
+    "./generators.json": "./generators.json",
+    "./generators/*/schema.json": "./src/generators/*/schema.json",
+    "./executors.json": "./executors.json",
+    "./executors/*/schema.json": "./src/executors/*/schema.json",
+    "./preset": "./src/utils/preset.js"
+  },
+  "types": "./index.d.ts",
+  "gitHead": "50a145bb64edcf76985184a9a83d1449dcd4f3d9"
+}

package/preset.d.ts

@@ -0,0 +1 @@
+export * from './src/utils/preset';

package/preset.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./src/utils/preset"), exports);

package/src/executors/playwright/compat.d.ts

@@ -0,0 +1,2 @@
+declare const _default: any;
+export default _default;

package/src/executors/playwright/compat.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const devkit_1 = require("@nx/devkit");
+const playwright_1 = require("./playwright");
+exports.default = (0, devkit_1.convertNxExecutor)(playwright_1.playwrightExecutor);

package/src/executors/playwright/playwright.d.ts

@@ -0,0 +1,36 @@
+import { ExecutorContext } from '@nx/devkit';
+export interface PlaywrightExecutorSchema {
+    browser?: 'all' | 'chromium' | 'firefox' | 'webkit' | string;
+    config?: string;
+    debug?: boolean;
+    forbidOnly?: boolean;
+    fullyParallel?: boolean;
+    grep?: string;
+    globalTimeout?: number;
+    grepInvert?: string;
+    headed?: boolean;
+    ignoreSnapshots?: boolean;
+    workers?: string;
+    list?: boolean;
+    maxFailures?: number | boolean;
+    noDeps?: boolean;
+    output?: string;
+    passWithNoTests?: boolean;
+    project?: string[];
+    quiet?: boolean;
+    repeatEach?: number;
+    reporter?: 'list' | 'line' | 'dot' | 'json' | 'junit' | 'null' | 'github' | 'html' | 'blob';
+    retries?: number;
+    shard?: string;
+    timeout?: number;
+    trace?: 'on' | 'off' | 'on-first-retry' | 'on-all-retries' | 'retain-on-failure';
+    updateSnapshots?: boolean;
+    ui?: boolean;
+    uiHost?: string;
+    uiPort?: string;
+    skipInstall?: boolean;
+}
+export declare function playwrightExecutor(options: PlaywrightExecutorSchema, context: ExecutorContext): Promise<{
+    success: boolean;
+}>;
+export default playwrightExecutor;

package/src/executors/playwright/playwright.js

@@ -0,0 +1,66 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.playwrightExecutor = void 0;
+const tslib_1 = require("tslib");
+const child_process_1 = require("child_process");
+const devkit_1 = require("@nx/devkit");
+function playwrightExecutor(options, context) {
+    var _a, _b, _c, _d;
+    return tslib_1.__awaiter(this, void 0, void 0, function* () {
+        const projectRoot = (_d = (_c = (_b = (_a = context.projectGraph) === null || _a === void 0 ? void 0 : _a.nodes) === null || _b === void 0 ? void 0 : _b[context === null || context === void 0 ? void 0 : context.projectName]) === null || _c === void 0 ? void 0 : _c.data) === null || _d === void 0 ? void 0 : _d.root;
+        if (!projectRoot) {
+            throw new Error(`Unable to find the Project Root for ${context.projectName}. Is it set in the project.json?`);
+        }
+        if (!options.skipInstall) {
+            devkit_1.output.log({
+                title: 'Ensuring Playwright is installed.',
+                bodyLines: ['use --skipInstall to skip installation.'],
+            });
+            const pmc = (0, devkit_1.getPackageManagerCommand)();
+            (0, child_process_1.execSync)(`${pmc.exec} playwright install`, { cwd: devkit_1.workspaceRoot });
+        }
+        const args = createArgs(options);
+        const p = runPlaywright(args, context.root);
+        return new Promise((resolve) => {
+            p.on('close', (code) => {
+                resolve({ success: code === 0 });
+            });
+        });
+    });
+}
+exports.playwrightExecutor = playwrightExecutor;
+function createArgs(opts) {
+    const args = [];
+    for (const key in opts) {
+        const value = opts[key];
+        // NOTE: playwright doesn't accept pascalCase args, only kebab-case
+        const arg = (0, devkit_1.names)(key).fileName;
+        if (Array.isArray(value)) {
+            args.push(`--${arg}=${value.map((v) => v.trim()).join(',')}`);
+        }
+        else if (typeof value === 'boolean') {
+            // NOTE: playwright don't accept --arg=false, instead just don't pass the arg.
+            if (value) {
+                args.push(`--${arg}`);
+            }
+        }
+        else {
+            args.push(`--${arg}=${value}`);
+        }
+    }
+    return args;
+}
+function runPlaywright(args, cwd) {
+    try {
+        const cli = require.resolve('@playwright/test/cli');
+        return (0, child_process_1.fork)(cli, ['test', ...args], {
+            stdio: 'inherit',
+            cwd,
+        });
+    }
+    catch (e) {
+        console.error(e);
+        throw new Error('Unable to run playwright. Is @playwright/test installed?');
+    }
+}
+exports.default = playwrightExecutor;

package/src/executors/playwright/schema.json

@@ -0,0 +1,160 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "version": 2,
+  "title": "Playwright executor",
+  "description": "Run Playwright tests.",
+  "type": "object",
+  "properties": {
+    "browser": {
+      "type": "string",
+      "description": "Browser to use for tests, one of 'all', 'chromium', 'firefox' or 'webkit'. If a playwright config is provided/discovered then the browserName value is expected from the configured 'projects'",
+      "x-priority": "important"
+    },
+    "config": {
+      "type": "string",
+      "description": "Configuration file, or a test directory with optional",
+      "x-completion-type": "file",
+      "x-completion-glob": "playwright?(*)@(.js|.cjs|.mjs|.ts|.cts|.mtx)",
+      "x-priority": "important"
+    },
+    "debug": {
+      "type": "boolean",
+      "description": "Run tests with Playwright Inspector. Shortcut for 'PWDEBUG=1' environment variable and '--timeout=0',--max-failures=1 --headed --workers=1' options"
+    },
+    "forbidOnly": {
+      "type": "boolean",
+      "description": "Fail if test.only is called"
+    },
+    "fullyParallel": {
+      "type": "boolean",
+      "description": "Run all tests in parallel"
+    },
+    "grep": {
+      "alias": "g",
+      "type": "string",
+      "description": "Only run tests matching this regular expression"
+    },
+    "globalTimeout": {
+      "type": "number",
+      "description": "Maximum time this test suite can run in milliseconds"
+    },
+    "grepInvert": {
+      "alias": "gv",
+      "type": "string",
+      "description": "Only run tests that do not match this regular expression"
+    },
+    "headed": {
+      "type": "boolean",
+      "description": "Run tests in headed browsers",
+      "x-priority": "important"
+    },
+    "ignoreSnapshots": {
+      "type": "boolean",
+      "description": "Ignore screenshot and snapshot expectations"
+    },
+    "workers": {
+      "alias": "j",
+      "type": "string",
+      "description": "Number of concurrent workers or percentage of logical CPU cores, use 1 to run in a single worker"
+    },
+    "list": {
+      "type": "boolean",
+      "description": "Collect all the tests and report them, but do not run"
+    },
+    "maxFailures": {
+      "alias": "x",
+      "oneOf": [{ "type": "number" }, { "type": "boolean" }],
+      "description": "Stop after the first N failures"
+    },
+    "noDeps": {
+      "type": "boolean",
+      "description": "Do not run project dependencies"
+    },
+    "output": {
+      "type": "string",
+      "description": "Folder for output artifacts"
+    },
+    "passWithNoTests": {
+      "type": "boolean",
+      "description": "Makes test run succeed even if no tests were found",
+      "default": true
+    },
+    "project": {
+      "description": "Only run tests from the specified list of projects",
+      "type": "array",
+      "items": {
+        "type": "string"
+      }
+    },
+    "quiet": {
+      "alias": "q",
+      "type": "boolean",
+      "description": "Suppress stdio"
+    },
+    "repeatEach": {
+      "type": "number",
+      "description": "Run each test N times"
+    },
+    "reporter": {
+      "type": "string",
+      "enum": [
+        "list",
+        "line",
+        "dot",
+        "json",
+        "junit",
+        "null",
+        "github",
+        "html",
+        "blob"
+      ],
+      "description": "Reporter to use, comma-separated, can be 'list', 'line', 'dot', 'json', 'junit', 'null', 'github', 'html', 'blob'. To configure reporter options, use the playwright configuration."
+    },
+    "retries": {
+      "type": "number",
+      "description": "Maximum retry count for flaky tests, zero for no retries"
+    },
+    "shard": {
+      "type": "string",
+      "description": "Shard tests and execute only the selected shard, specify in the form 'current/all', 1-based, for example '3/5'"
+    },
+    "timeout": {
+      "type": "number",
+      "description": "Specify test timeout threshold in milliseconds, zero for unlimited"
+    },
+    "trace": {
+      "type": "string",
+      "enum": [
+        "on",
+        "off",
+        "on-first-retry",
+        "on-all-retries",
+        "retain-on-failure"
+      ],
+      "description": "Force tracing mode, can be 'on', 'off', 'on-first-retry', 'on-all-retries', 'retain-on-failure'"
+    },
+    "updateSnapshots": {
+      "alias": "u",
+      "type": "boolean",
+      "description": "Update snapshots with actual results. Snapshots will be created if missing."
+    },
+    "ui": {
+      "type": "boolean",
+      "description": "Run tests in interactive UI mode"
+    },
+    "uiHost": {
+      "type": "string",
+      "description": "Host to serve UI on; specifying this option opens UI in a browser tab"
+    },
+    "uiPort": {
+      "type": "string",
+      "description": "Port to serve UI on, 0 for any free port; specifying this option opens UI in a browser tab"
+    },
+    "skipInstall": {
+      "type": "boolean",
+      "description": "Skip running playwright install before running playwright tests. This is to ensure that playwright browsers are installed before running tests.",
+      "default": false
+    }
+  },
+  "required": []
+}

package/src/generators/configuration/configuration.d.ts

@@ -0,0 +1,5 @@
+import { GeneratorCallback, Tree } from '@nx/devkit';
+import { ConfigurationGeneratorSchema } from './schema';
+export declare function configurationGenerator(tree: Tree, options: ConfigurationGeneratorSchema): Promise<GeneratorCallback>;
+export default configurationGenerator;
+export declare const configurationSchematic: (generatorOptions: ConfigurationGeneratorSchema) => (tree: any, context: any) => Promise<any>;

package/src/generators/configuration/configuration.js

@@ -0,0 +1,75 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.configurationSchematic = exports.configurationGenerator = void 0;
+const tslib_1 = require("tslib");
+const devkit_1 = require("@nx/devkit");
+const path = require("path");
+const init_1 = require("../init/init");
+const add_linter_1 = require("../../utils/add-linter");
+function configurationGenerator(tree, options) {
+    var _a, _b;
+    return tslib_1.__awaiter(this, void 0, void 0, function* () {
+        const tasks = [];
+        tasks.push(yield (0, init_1.default)(tree, {
+            skipFormat: true,
+            skipPackageJson: options.skipPackageJson,
+        }));
+        const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, options.project);
+        (0, devkit_1.generateFiles)(tree, path.join(__dirname, 'files'), projectConfig.root, Object.assign({ offsetFromRoot: (0, devkit_1.offsetFromRoot)(projectConfig.root), projectRoot: projectConfig.root, webServerCommand: (_a = options.webServerCommand) !== null && _a !== void 0 ? _a : null, webServerAddress: (_b = options.webServerAddress) !== null && _b !== void 0 ? _b : null }, options));
+        addE2eTarget(tree, options);
+        setupE2ETargetDefaults(tree);
+        tasks.push(yield (0, add_linter_1.addLinterToPlaywrightProject)(tree, {
+            project: options.project,
+            linter: options.linter,
+            skipPackageJson: options.skipPackageJson,
+            js: options.js,
+            directory: options.directory,
+            setParserOptionsProject: options.setParserOptionsProject,
+            rootProject: projectConfig.root === '.',
+        }));
+        if (options.js) {
+            (0, devkit_1.toJS)(tree);
+        }
+        if (!options.skipFormat) {
+            yield (0, devkit_1.formatFiles)(tree);
+        }
+        return (0, devkit_1.runTasksInSerial)(...tasks);
+    });
+}
+exports.configurationGenerator = configurationGenerator;
+function setupE2ETargetDefaults(tree) {
+    var _a, _b, _c, _d;
+    var _e, _f;
+    const nxJson = (0, devkit_1.readNxJson)(tree);
+    if (!nxJson.namedInputs) {
+        return;
+    }
+    // E2e targets depend on all their project's sources + production sources of dependencies
+    (_a = nxJson.targetDefaults) !== null && _a !== void 0 ? _a : (nxJson.targetDefaults = {});
+    const productionFileSet = !!((_b = nxJson.namedInputs) === null || _b === void 0 ? void 0 : _b.production);
+    (_c = (_e = nxJson.targetDefaults).e2e) !== null && _c !== void 0 ? _c : (_e.e2e = {});
+    (_d = (_f = nxJson.targetDefaults.e2e).inputs) !== null && _d !== void 0 ? _d : (_f.inputs = [
+        'default',
+        productionFileSet ? '^production' : '^default',
+    ]);
+    (0, devkit_1.updateNxJson)(tree, nxJson);
+}
+function addE2eTarget(tree, options) {
+    var _a, _b;
+    const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, options.project);
+    if ((_a = projectConfig === null || projectConfig === void 0 ? void 0 : projectConfig.targets) === null || _a === void 0 ? void 0 : _a.e2e) {
+        throw new Error(`Project ${options.project} already has an e2e target.
+Rename or remove the existing e2e target.`);
+    }
+    (_b = projectConfig.targets) !== null && _b !== void 0 ? _b : (projectConfig.targets = {});
+    projectConfig.targets.e2e = {
+        executor: '@nx/playwright:playwright',
+        outputs: [`dist/.playwright/${projectConfig.root}`],
+        options: {
+            config: `${projectConfig.root}/playwright.config.${options.js ? 'js' : 'ts'}`,
+        },
+    };
+    (0, devkit_1.updateProjectConfiguration)(tree, options.project, projectConfig);
+}
+exports.default = configurationGenerator;
+exports.configurationSchematic = (0, devkit_1.convertNxGenerator)(configurationGenerator);

package/src/generators/configuration/files/__directory__/example.spec.ts.template

@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test';
+
+test('has title', async ({ page }) => {
+  await page.goto('/');
+
+  // Expect a title "to contain" a substring.
+  await expect(page).toHaveTitle(/Welcome/);
+});

package/src/generators/configuration/files/playwright.config.ts.template

@@ -0,0 +1,38 @@
+import { defineConfig } from '@playwright/test';
+import { nxE2EPreset } from '@nx/playwright/preset';
+<% if(!webServerCommand || !webServerAddress) { %>// eslint-disable-next-line @typescript-eslint/no-unused-vars <% } %>
+import { workspaceRoot } from '@nx/devkit';
+
+// For CI, you may want to set BASE_URL to the deployed application.
+const baseURL = process.env['BASE_URL'] || '<% if(webServerAddress) {%><%= webServerAddress %><% } else {%>http://localhost:3000<% } %>';
+
+/**
+ * Read environment variables from file.
+ * https://github.com/motdotla/dotenv
+ */
+// require('dotenv').config();
+
+/**
+ * See https://playwright.dev/docs/test-configuration.
+ */
+export default defineConfig({
+  ...nxE2EPreset(__filename, { testDir: './<>' }),
+  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
+  use: {
+    baseURL,
+    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
+    trace: 'on-first-retry',
+  },
+  /* Run your local dev server before starting the tests */<% if(webServerCommand && webServerAddress) {%>
+  webServer: {
+    command: '<%= webServerCommand %>',
+    url: '<%= webServerAddress %>',
+    reuseExistingServer: !process.env.CI,
+    cwd: workspaceRoot
+  },<% } else {%>// webServer: {
+  //   command: 'npm run start',
+  //   url: 'http://127.0.0.1:3000',
+  //   reuseExistingServer: !process.env.CI,
+  //   cwd: workspaceRoot,
+  // },<% } %>
+});

package/src/generators/configuration/schema.d.ts

@@ -0,0 +1,21 @@
+import type { Linter } from '@nx/linter';
+
+export interface ConfigurationGeneratorSchema {
+  project: string;
+  directory: string;
+  js: boolean; // default is false
+  skipFormat: boolean;
+  skipPackageJson: boolean;
+  linter: Linter;
+  setParserOptionsProject: boolean; // default is false
+  /**
+   * command to give playwright to run the web server
+   * @example: "npx nx serve my-fe-app"
+   **/
+  webServerCommand?: string;
+  /**
+   * address
+   * @example: "http://localhost:4200"
+   **/
+  webServerAddress?: string;
+}

package/src/generators/configuration/schema.json

@@ -0,0 +1,61 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "$id": "NxPlaywrightConfiguration",
+  "description": "Add a Playwright configuration.",
+  "title": "Add a Playwright configuration",
+  "type": "object",
+  "properties": {
+    "project": {
+      "type": "string",
+      "description": "The project to add a Playwright configuration to",
+      "$default": {
+        "$source": "projectName"
+      },
+      "x-priority": "important",
+      "x-prompt": "What is the name of the project to set up Playwright for?"
+    },
+    "directory": {
+      "type": "string",
+      "description": "A directory where the project is placed relative from the project root",
+      "x-priority": "important",
+      "default": "playwright"
+    },
+    "js": {
+      "type": "boolean",
+      "description": "Generate JavaScript files rather than TypeScript files.",
+      "default": false
+    },
+    "webServerCommand": {
+      "type": "string",
+      "description": "The command to start the web server."
+    },
+    "webServerAddress": {
+      "type": "string",
+      "description": "The address of the web server."
+    },
+    "linter": {
+      "description": "The tool to use for running lint checks.",
+      "type": "string",
+      "enum": ["eslint", "none"],
+      "default": "eslint"
+    },
+    "setParserOptionsProject": {
+      "type": "boolean",
+      "description": "Whether or not to configure the ESLint `parserOptions.project` option. We do not do this by default for lint performance reasons.",
+      "default": false
+    },
+    "skipFormat": {
+      "description": "Skip formatting files.",
+      "type": "boolean",
+      "default": false,
+      "x-priority": "internal"
+    },
+    "skipPackageJson": {
+      "type": "boolean",
+      "default": false,
+      "description": "Do not add dependencies to `package.json`.",
+      "x-priority": "internal"
+    }
+  },
+  "required": ["project"]
+}

package/src/generators/init/init.d.ts

@@ -0,0 +1,5 @@
+import { GeneratorCallback, Tree } from '@nx/devkit';
+import { InitGeneratorSchema } from './schema';
+export declare function initGenerator(tree: Tree, options: InitGeneratorSchema): Promise<GeneratorCallback>;
+export default initGenerator;
+export declare const initSchematic: (generatorOptions: InitGeneratorSchema) => (tree: any, context: any) => Promise<any>;

package/src/generators/init/init.js

@@ -0,0 +1,50 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initSchematic = exports.initGenerator = void 0;
+const tslib_1 = require("tslib");
+const devkit_1 = require("@nx/devkit");
+const versions_1 = require("../../utils/versions");
+const child_process_1 = require("child_process");
+function initGenerator(tree, options) {
+    return tslib_1.__awaiter(this, void 0, void 0, function* () {
+        const tasks = [];
+        if (!options.skipPackageJson) {
+            tasks.push((0, devkit_1.addDependenciesToPackageJson)(tree, {}, {
+                '@nx/playwright': versions_1.nxVersion,
+                '@playwright/test': versions_1.playwrightVersion,
+            }));
+        }
+        if (!options.skipFormat) {
+            yield (0, devkit_1.formatFiles)(tree);
+        }
+        if (tree.exists('.vscode/extensions.json')) {
+            (0, devkit_1.updateJson)(tree, '.vscode/extensions.json', (json) => {
+                var _a;
+                (_a = json.recommendations) !== null && _a !== void 0 ? _a : (json.recommendations = []);
+                const recs = new Set(json.recommendations);
+                recs.add('ms-playwright.playwright');
+                json.recommendations = Array.from(recs);
+                return json;
+            });
+        }
+        else {
+            tree.write('.vscode/extensions.json', JSON.stringify({
+                recommendations: ['ms-playwright.playwright'],
+            }, null, 2));
+        }
+        if (!options.skipInstall) {
+            tasks.push(() => {
+                devkit_1.output.log({
+                    title: 'Ensuring Playwright is installed.',
+                    bodyLines: ['use --skipInstall to skip installation.'],
+                });
+                const pmc = (0, devkit_1.getPackageManagerCommand)();
+                (0, child_process_1.execSync)(`${pmc.exec} playwright install`, { cwd: devkit_1.workspaceRoot });
+            });
+        }
+        return (0, devkit_1.runTasksInSerial)(...tasks);
+    });
+}
+exports.initGenerator = initGenerator;
+exports.default = initGenerator;
+exports.initSchematic = (0, devkit_1.convertNxGenerator)(initGenerator);

package/src/generators/init/schema.d.ts

@@ -0,0 +1,5 @@
+export interface InitGeneratorSchema {
+  skipFormat: boolean;
+  skipPackageJson: boolean;
+  skipInstall?: boolean;
+}

package/src/generators/init/schema.json

@@ -0,0 +1,27 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "$id": "NxPlaywrightInit",
+  "title": "Playwright Init Generator",
+  "description": "Initializes a Playwright project in the current workspace.",
+  "type": "object",
+  "properties": {
+    "skipFormat": {
+      "description": "Skip formatting files.",
+      "type": "boolean",
+      "default": false,
+      "x-priority": "internal"
+    },
+    "skipPackageJson": {
+      "type": "boolean",
+      "default": false,
+      "description": "Do not add dependencies to `package.json`.",
+      "x-priority": "internal"
+    },
+    "skipInstall": {
+      "type": "boolean",
+      "description": "Skip running `playwright install`. This is to ensure that playwright browsers are installed.",
+      "default": false
+    }
+  },
+  "required": []
+}

package/src/utils/add-linter.d.ts

@@ -0,0 +1,15 @@
+import { GeneratorCallback, Tree } from '@nx/devkit';
+import { Linter } from '@nx/linter';
+export interface PlaywrightLinterOptions {
+    project: string;
+    linter: Linter;
+    setParserOptionsProject: boolean;
+    skipPackageJson: boolean;
+    rootProject: boolean;
+    js?: boolean;
+    /**
+     * Directory from the project root, where the playwright files will be located.
+     **/
+    directory: string;
+}
+export declare function addLinterToPlaywrightProject(tree: Tree, options: PlaywrightLinterOptions): Promise<GeneratorCallback>;

package/src/utils/add-linter.js

@@ -0,0 +1,66 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.addLinterToPlaywrightProject = void 0;
+const tslib_1 = require("tslib");
+const devkit_1 = require("@nx/devkit");
+const linter_1 = require("@nx/linter");
+const global_eslint_config_1 = require("@nx/linter/src/generators/init/global-eslint-config");
+const versions_1 = require("./versions");
+function addLinterToPlaywrightProject(tree, options) {
+    return tslib_1.__awaiter(this, void 0, void 0, function* () {
+        if (options.linter === linter_1.Linter.None) {
+            return () => { };
+        }
+        const tasks = [];
+        const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, options.project);
+        if (!tree.exists((0, devkit_1.joinPathFragments)(projectConfig.root, '.eslintrc.json'))) {
+            tasks.push(yield (0, linter_1.lintProjectGenerator)(tree, {
+                project: options.project,
+                linter: options.linter,
+                skipFormat: true,
+                tsConfigPaths: [(0, devkit_1.joinPathFragments)(projectConfig.root, 'tsconfig.json')],
+                eslintFilePatterns: [
+                    `${projectConfig.root}/**/*.${options.js ? 'js' : '{js,ts}'}`,
+                ],
+                setParserOptionsProject: options.setParserOptionsProject,
+                skipPackageJson: options.skipPackageJson,
+                rootProject: options.rootProject,
+            }));
+        }
+        if (!options.linter || options.linter !== linter_1.Linter.EsLint) {
+            return (0, devkit_1.runTasksInSerial)(...tasks);
+        }
+        tasks.push(!options.skipPackageJson
+            ? (0, devkit_1.addDependenciesToPackageJson)(tree, {}, { 'eslint-plugin-playwright': versions_1.eslintPluginPlaywrightVersion })
+            : () => { });
+        (0, devkit_1.updateJson)(tree, (0, devkit_1.joinPathFragments)(projectConfig.root, '.eslintrc.json'), (json) => {
+            var _a;
+            if (options.rootProject) {
+                json.plugins = ['@nx'];
+                json.extends = ['plugin:playwright/recommended'];
+            }
+            else {
+                json.extends = ['plugin:playwright/recommended', ...json.extends];
+            }
+            (_a = json.overrides) !== null && _a !== void 0 ? _a : (json.overrides = []);
+            const globals = options.rootProject ? [global_eslint_config_1.globalJavaScriptOverrides] : [];
+            const override = {
+                files: ['*.ts', '*.tsx', '*.js', '*.jsx'],
+                parserOptions: !options.setParserOptionsProject
+                    ? undefined
+                    : {
+                        project: `${projectConfig.root}/tsconfig.*?.json`,
+                    },
+                rules: {},
+            };
+            const palywrightFiles = [
+                Object.assign(Object.assign({}, override), { files: [`${options.directory}/**/*.{ts,js,tsx,jsx}`] }),
+            ];
+            json.overrides.push(...globals);
+            json.overrides.push(...palywrightFiles);
+            return json;
+        });
+        return (0, devkit_1.runTasksInSerial)(...tasks);
+    });
+}
+exports.addLinterToPlaywrightProject = addLinterToPlaywrightProject;

package/src/utils/preset.d.ts

@@ -0,0 +1,39 @@
+export interface NxPlaywrightOptions {
+    /**
+     * The directory where the e2e tests are located.
+     * @default './src'
+     **/
+    testDir?: string;
+    /**
+     * Include Mobile Chome and Mobile Safari browsers in test projects
+     * @default false
+     **/
+    includeMobileBrowsers?: boolean;
+    /**
+     * Include Microsoft Edge and Google Chrome browsers in test projects
+     * @default false
+     **/
+    includeBrandedBrowsers?: boolean;
+}
+/**
+ * nx E2E Preset for Playwright
+ * @description
+ * this preset contains the base configuration
+ * for your e2e tests that nx recommends.
+ * By default html reporter is configured
+ * along with the following browsers:
+ * - chromium
+ * - firefox
+ * - webkit
+ *
+ * you can easily extend this within your playwright config via spreading the preset
+ * @example
+ * export default defineConfig({
+ *   ...nxE2EPreset(__filename, options)
+ *   // add your own config here
+ * })
+ *
+ * @param pathToConfig will be used to construct the output paths for reporters and test results
+ * @param options optional configuration options
+ */
+export declare function nxE2EPreset(pathToConfig: string, options?: NxPlaywrightOptions): import("@playwright/test").PlaywrightTestConfig<{}, {}>;

package/src/utils/preset.js

@@ -0,0 +1,99 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.nxE2EPreset = void 0;
+const devkit_1 = require("@nx/devkit");
+const node_fs_1 = require("node:fs");
+const node_path_1 = require("node:path");
+const test_1 = require("@playwright/test");
+/**
+ * nx E2E Preset for Playwright
+ * @description
+ * this preset contains the base configuration
+ * for your e2e tests that nx recommends.
+ * By default html reporter is configured
+ * along with the following browsers:
+ * - chromium
+ * - firefox
+ * - webkit
+ *
+ * you can easily extend this within your playwright config via spreading the preset
+ * @example
+ * export default defineConfig({
+ *   ...nxE2EPreset(__filename, options)
+ *   // add your own config here
+ * })
+ *
+ * @param pathToConfig will be used to construct the output paths for reporters and test results
+ * @param options optional configuration options
+ */
+function nxE2EPreset(pathToConfig, options) {
+    var _a;
+    const normalizedPath = (0, node_fs_1.lstatSync)(pathToConfig).isDirectory()
+        ? pathToConfig
+        : (0, node_path_1.dirname)(pathToConfig);
+    const projectPath = (0, node_path_1.relative)(devkit_1.workspaceRoot, normalizedPath);
+    const offset = (0, node_path_1.relative)(normalizedPath, devkit_1.workspaceRoot);
+    const testResultOuputDir = (0, node_path_1.join)(offset, 'dist', '.playwright', projectPath, 'test-output');
+    const reporterOutputDir = (0, node_path_1.join)(offset, 'dist', '.playwright', projectPath, 'playwright-report');
+    const projects = [
+        {
+            name: 'chromium',
+            use: Object.assign({}, test_1.devices['Desktop Chrome']),
+        },
+        {
+            name: 'firefox',
+            use: Object.assign({}, test_1.devices['Desktop Firefox']),
+        },
+        {
+            name: 'webkit',
+            use: Object.assign({}, test_1.devices['Desktop Safari']),
+        },
+    ];
+    if (options === null || options === void 0 ? void 0 : options.includeMobileBrowsers) {
+        projects.push(...[
+            {
+                name: 'Mobile Chrome',
+                use: Object.assign({}, test_1.devices['Pixel 5']),
+            },
+            {
+                name: 'Mobile Safari',
+                use: Object.assign({}, test_1.devices['iPhone 12']),
+            },
+        ]);
+    }
+    if (options === null || options === void 0 ? void 0 : options.includeBrandedBrowsers) {
+        projects.push(...[
+            {
+                name: 'Microsoft Edge',
+                use: Object.assign(Object.assign({}, test_1.devices['Desktop Edge']), { channel: 'msedge' }),
+            },
+            {
+                name: 'Google Chrome',
+                use: Object.assign(Object.assign({}, test_1.devices['Desktop Chrome']), { channel: 'chrome' }),
+            },
+        ]);
+    }
+    return (0, test_1.defineConfig)({
+        testDir: (_a = options.testDir) !== null && _a !== void 0 ? _a : './src',
+        outputDir: testResultOuputDir,
+        /* Run tests in files in parallel */
+        fullyParallel: true,
+        /* Fail the build on CI if you accidentally left test.only in the source code. */
+        forbidOnly: !!process.env.CI,
+        /* Retry on CI only */
+        retries: process.env.CI ? 2 : 0,
+        /* Opt out of parallel tests on CI. */
+        workers: process.env.CI ? 1 : undefined,
+        /* Reporter to use. See https://playwright.dev/docs/test-reporters */
+        reporter: [
+            [
+                'html',
+                {
+                    outputFolder: reporterOutputDir,
+                },
+            ],
+        ],
+        projects,
+    });
+}
+exports.nxE2EPreset = nxE2EPreset;

package/src/utils/versions.d.ts

@@ -0,0 +1,3 @@
+export declare const nxVersion: any;
+export declare const playwrightVersion = "^1.36.0";
+export declare const eslintPluginPlaywrightVersion = "^0.15.3";

package/src/utils/versions.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.eslintPluginPlaywrightVersion = exports.playwrightVersion = exports.nxVersion = void 0;
+exports.nxVersion = require('../../package.json').version;
+exports.playwrightVersion = '^1.36.0';
+exports.eslintPluginPlaywrightVersion = '^0.15.3';