Skip to content

Commit

Permalink
feat(remix): add playwright option for e2eTestRunner
Browse files Browse the repository at this point in the history
  • Loading branch information
Coly010 committed Feb 5, 2024
1 parent 7ca576b commit ddc90a8
Show file tree
Hide file tree
Showing 8 changed files with 354 additions and 54 deletions.
2 changes: 1 addition & 1 deletion docs/generated/packages/remix/generators/application.json
Expand Up @@ -45,7 +45,7 @@
},
"e2eTestRunner": {
"type": "string",
"enum": ["cypress", "none"],
"enum": ["cypress", "playwright", "none"],
"default": "cypress",
"description": "Test runner to use for e2e tests"
},
Expand Down
Expand Up @@ -144,7 +144,7 @@ export default function Index() {
"
`;

exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --e2eTestRunner should generate an e2e application for the app 1`] = `
exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --e2eTestRunner should generate a cypress e2e application for the app 1`] = `
"import { nxE2EPreset } from '@nx/cypress/plugins/cypress-preset';
import { defineConfig } from 'cypress';
Expand All @@ -158,6 +158,79 @@ export default defineConfig({
"
`;

exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --e2eTestRunner should generate a playwright e2e application for the app 1`] = `
"import { defineConfig, devices } from '@playwright/test';
import { nxE2EPreset } from '@nx/playwright/preset';
import { workspaceRoot } from '@nx/devkit';
// For CI, you may want to set BASE_URL to the deployed application.
const baseURL = process.env['BASE_URL'] || 'http://localhost:4200';
/**
* 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: './src' }),
/* 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 */
webServer: {
command: 'pnpm exec nx serve test',
url: 'http://localhost:4200',
reuseExistingServer: !process.env.CI,
cwd: workspaceRoot,
},
projects: [
{
name: 'chromium',
use: { ...devices['Desktop Chrome'] },
},
{
name: 'firefox',
use: { ...devices['Desktop Firefox'] },
},
{
name: 'webkit',
use: { ...devices['Desktop Safari'] },
},
// Uncomment for mobile browsers support
/* {
name: 'Mobile Chrome',
use: { ...devices['Pixel 5'] },
},
{
name: 'Mobile Safari',
use: { ...devices['iPhone 12'] },
}, */
// Uncomment for branded browsers
/* {
name: 'Microsoft Edge',
use: { ...devices['Desktop Edge'], channel: 'msedge' },
},
{
name: 'Google Chrome',
use: { ...devices['Desktop Chrome'], channel: 'chrome' },
} */
],
});
"
`;

exports[`Remix Application Integrated Repo --projectNameAndRootFormat=as-provided --js should create the application correctly 1`] = `
"import { createWatchPaths } from '@nx/remix';
import { dirname } from 'path';
Expand Down Expand Up @@ -549,7 +622,7 @@ export default function Index() {
"
`;

exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --e2eTestRunner should generate an e2e application for the app 1`] = `
exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --e2eTestRunner should generate a cypress e2e application for the app 1`] = `
"import { nxE2EPreset } from '@nx/cypress/plugins/cypress-preset';
import { defineConfig } from 'cypress';
Expand All @@ -563,6 +636,79 @@ export default defineConfig({
"
`;

exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --e2eTestRunner should generate a playwright e2e application for the app 1`] = `
"import { defineConfig, devices } from '@playwright/test';
import { nxE2EPreset } from '@nx/playwright/preset';
import { workspaceRoot } from '@nx/devkit';
// For CI, you may want to set BASE_URL to the deployed application.
const baseURL = process.env['BASE_URL'] || 'http://localhost:4200';
/**
* 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: './src' }),
/* 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 */
webServer: {
command: 'pnpm exec nx serve test',
url: 'http://localhost:4200',
reuseExistingServer: !process.env.CI,
cwd: workspaceRoot,
},
projects: [
{
name: 'chromium',
use: { ...devices['Desktop Chrome'] },
},
{
name: 'firefox',
use: { ...devices['Desktop Firefox'] },
},
{
name: 'webkit',
use: { ...devices['Desktop Safari'] },
},
// Uncomment for mobile browsers support
/* {
name: 'Mobile Chrome',
use: { ...devices['Pixel 5'] },
},
{
name: 'Mobile Safari',
use: { ...devices['iPhone 12'] },
}, */
// Uncomment for branded browsers
/* {
name: 'Microsoft Edge',
use: { ...devices['Desktop Edge'], channel: 'msedge' },
},
{
name: 'Google Chrome',
use: { ...devices['Desktop Chrome'], channel: 'chrome' },
} */
],
});
"
`;

exports[`Remix Application Integrated Repo --projectNameAndRootFormat=derived --js should create the application correctly 1`] = `
"import { createWatchPaths } from '@nx/remix';
import { dirname } from 'path';
Expand Down Expand Up @@ -810,7 +956,7 @@ export default function Index() {
"
`;

exports[`Remix Application Standalone Project Repo --e2eTestRunner should generate an e2e application for the app 1`] = `
exports[`Remix Application Standalone Project Repo --e2eTestRunner should generate a cypress e2e application for the app 1`] = `
"import { nxE2EPreset } from '@nx/cypress/plugins/cypress-preset';
import { defineConfig } from 'cypress';
Expand Down Expand Up @@ -1157,3 +1303,76 @@ exports[`Remix Application Standalone Project Repo should create the application
}
"
`;

exports[`Remix Application Standalone Project Repo should generate a playwright e2e application for the app 1`] = `
"import { defineConfig, devices } from '@playwright/test';
import { nxE2EPreset } from '@nx/playwright/preset';
import { workspaceRoot } from '@nx/devkit';
// For CI, you may want to set BASE_URL to the deployed application.
const baseURL = process.env['BASE_URL'] || 'http://localhost:4200';
/**
* 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: './src' }),
/* 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 */
webServer: {
command: 'pnpm exec nx serve test',
url: 'http://localhost:4200',
reuseExistingServer: !process.env.CI,
cwd: workspaceRoot,
},
projects: [
{
name: 'chromium',
use: { ...devices['Desktop Chrome'] },
},
{
name: 'firefox',
use: { ...devices['Desktop Firefox'] },
},
{
name: 'webkit',
use: { ...devices['Desktop Safari'] },
},
// Uncomment for mobile browsers support
/* {
name: 'Mobile Chrome',
use: { ...devices['Pixel 5'] },
},
{
name: 'Mobile Safari',
use: { ...devices['iPhone 12'] },
}, */
// Uncomment for branded browsers
/* {
name: 'Microsoft Edge',
use: { ...devices['Desktop Edge'], channel: 'msedge' },
},
{
name: 'Google Chrome',
use: { ...devices['Desktop Chrome'], channel: 'chrome' },
} */
],
});
"
`;
42 changes: 40 additions & 2 deletions packages/remix/src/generators/application/application.impl.spec.ts
Expand Up @@ -103,7 +103,7 @@ describe('Remix Application', () => {
});

describe('--e2eTestRunner', () => {
it('should generate an e2e application for the app', async () => {
it('should generate a cypress e2e application for the app', async () => {
// ARRANGE
const tree = createTreeWithEmptyWorkspace();

Expand All @@ -121,6 +121,24 @@ describe('Remix Application', () => {
expect(tree.read('e2e/cypress.config.ts', 'utf-8')).toMatchSnapshot();
});
});

it('should generate a playwright e2e application for the app', async () => {
// ARRANGE
const tree = createTreeWithEmptyWorkspace();

// ACT
await applicationGenerator(tree, {
name: 'test',
e2eTestRunner: 'playwright',
rootProject: true,
addPlugin: true,
});

// ASSERT
expectTargetsToBeCorrect(tree, '.');

expect(tree.read('e2e/playwright.config.ts', 'utf-8')).toMatchSnapshot();
});
});

describe.each([
Expand Down Expand Up @@ -294,7 +312,7 @@ describe('Remix Application', () => {
});

describe('--e2eTestRunner', () => {
it('should generate an e2e application for the app', async () => {
it('should generate a cypress e2e application for the app', async () => {
// ARRANGE
const tree = createTreeWithEmptyWorkspace({ layout: 'apps-libs' });

Expand All @@ -313,6 +331,26 @@ describe('Remix Application', () => {
tree.read(`${appDir}-e2e/cypress.config.ts`, 'utf-8')
).toMatchSnapshot();
});

it('should generate a playwright e2e application for the app', async () => {
// ARRANGE
const tree = createTreeWithEmptyWorkspace({ layout: 'apps-libs' });

// ACT
await applicationGenerator(tree, {
name: 'test',
e2eTestRunner: 'playwright',
projectNameAndRootFormat,
addPlugin: true,
});

// ASSERT
expectTargetsToBeCorrect(tree, appDir);

expect(
tree.read(`${appDir}-e2e/playwright.config.ts`, 'utf-8')
).toMatchSnapshot();
});
});
}
);
Expand Down

0 comments on commit ddc90a8

Please sign in to comment.