Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(testing): fix issues in static server target migrations #27547

Merged
merged 1 commit into from
Aug 21, 2024
Merged

fix(testing): fix issues in static server target migrations #27547

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
187 changes: 125 additions & 62 deletions packages/cypress/src/migrations/update-19-6-0/update-ci-webserver-for-static-serve.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,7 @@ describe('update-ci-webserver-for-static-serve migration', () => {
ciTargetName: 'e2e-ci',
appName: 'app',
noVite: true,
ciWebServerCommand: 'nx run app:serve',
});

await expect(updateCiWebserverForStaticServe(tree)).resolves.not.toThrow();
Expand Down Expand Up @@ -75,6 +76,7 @@ describe('update-ci-webserver-for-static-serve migration', () => {
ciTargetName: 'e2e-ci',
appName: 'app',
noVite: true,
ciWebServerCommand: 'nx run app:serve',
});

// ACT
Expand Down Expand Up @@ -103,7 +105,7 @@ describe('update-ci-webserver-for-static-serve migration', () => {
`);
});

it('should not update the full command to serve-static target for webpack', async () => {
it('should update ciWebServerCommand to preview for vite app', async () => {
// ARRANGE
const nxJson = readNxJson(tree);
nxJson.plugins = [
Expand All @@ -115,41 +117,16 @@ describe('update-ci-webserver-for-static-serve migration', () => {
},
},
{
plugin: '@nx/webpack/plugin',
plugin: '@nx/vite/plugin',
options: {
serveStaticTargetName: 'webpack:serve-static',
buildTargetName: 'build',
previewTargetName: 'preview',
},
},
];
updateNxJson(tree, nxJson);

addProject(tree, tempFs, {
buildTargetName: 'build',
ciTargetName: 'e2e-ci',
appName: 'app',
noVite: true,
});

tree.write(
'app-e2e/cypress.config.ts',
`import { nxE2EPreset } from '@nx/cypress/plugins/cypress-preset';
import { defineConfig } from 'cypress';
export default defineConfig({
e2e: {
...nxE2EPreset(__filename, {
cypressDir: 'src',
bundler: 'vite',
webServerCommands: {
default: 'nx run app:serve',
production: 'nx run app:preview',
},
ciWebServerCommand: 'echo "start" && nx run app:serve',
}),
baseUrl: 'http://localhost:4200',
},
});
`
);
addProject(tree, tempFs);

// ACT
await updateCiWebserverForStaticServe(tree);
Expand All @@ -168,7 +145,8 @@ export default defineConfig({
default: 'nx run app:serve',
production: 'nx run app:preview',
},
ciWebServerCommand: 'echo "start" && nx run app:webpack:serve-static',
ciWebServerCommand: 'nx run app:preview',
ciBaseUrl: 'http://localhost:4300',
}),
baseUrl: 'http://localhost:4200',
},
Expand All @@ -177,35 +155,113 @@ export default defineConfig({
`);
});

it('should update ciWebServerCommand to preview for vite app', async () => {
// ARRANGE
const nxJson = readNxJson(tree);
nxJson.plugins = [
{
plugin: '@nx/cypress/plugin',
options: {
targetName: 'e2e',
ciTargetName: 'e2e-ci',
it.each`
ciWebServerCommand | expectedCommand
${'echo "start" && nx run app:serve'} | ${'echo "start" && nx run app:static-serve'}
${'echo "start" && nx run app:serve:prod'} | ${'echo "start" && nx run app:static-serve'}
${'echo "start" && nx run app:serve --configuration=prod'} | ${'echo "start" && nx run app:static-serve'}
${'echo "start" && nx run app:serve --port 4200'} | ${'echo "start" && nx run app:static-serve --port=4200'}
${'echo "start" && nx run app:serve --port=4200'} | ${'echo "start" && nx run app:static-serve --port=4200'}
${'echo "start" && nx serve app'} | ${'echo "start" && nx run app:static-serve'}
${'echo "start" && nx serve app --configuration=prod'} | ${'echo "start" && nx run app:static-serve'}
${'echo "start" && nx serve app --port 4200'} | ${'echo "start" && nx run app:static-serve --port=4200'}
${'echo "start" && nx serve app --port=4200'} | ${'echo "start" && nx run app:static-serve --port=4200'}
`(
'should replace "$ciWebServerCommand" with "$expectedCommand" when using webpack',
async ({ ciWebServerCommand, expectedCommand }) => {
const nxJson = readNxJson(tree);
nxJson.plugins = [
{
plugin: '@nx/cypress/plugin',
options: {
targetName: 'e2e',
ciTargetName: 'e2e-ci',
},
},
},
{
plugin: '@nx/vite/plugin',
options: {
buildTargetName: 'build',
previewTargetName: 'preview',
{
plugin: '@nx/webpack/plugin',
options: {
serveStaticTargetName: 'static-serve',
},
},
},
];
updateNxJson(tree, nxJson);
];
updateNxJson(tree, nxJson);
addProject(tree, tempFs, {
buildTargetName: 'build',
ciTargetName: 'e2e-ci',
appName: 'app',
noVite: true,
ciWebServerCommand,
});

addProject(tree, tempFs);
await updateCiWebserverForStaticServe(tree);

// ACT
await updateCiWebserverForStaticServe(tree);
expect(tree.read('app-e2e/cypress.config.ts', 'utf-8'))
.toMatchInlineSnapshot(`
"import { nxE2EPreset } from '@nx/cypress/plugins/cypress-preset';
import { defineConfig } from 'cypress';
export default defineConfig({
e2e: {
...nxE2EPreset(__filename, {
cypressDir: 'src',
bundler: 'vite',
webServerCommands: {
default: 'nx run app:serve',
production: 'nx run app:preview',
},
ciWebServerCommand: '${expectedCommand}',
}),
baseUrl: 'http://localhost:4200',
},
});
"
`);
}
);

// ASSERT
expect(tree.read('app-e2e/cypress.config.ts', 'utf-8'))
.toMatchInlineSnapshot(`
it.each`
ciWebServerCommand | expectedCommand | expectedUrl
${'echo "start" && nx run app:serve'} | ${'echo "start" && nx run app:preview'} | ${'http://localhost:4300'}
${'echo "start" && nx run app:serve:prod'} | ${'echo "start" && nx run app:preview'} | ${'http://localhost:4300'}
${'echo "start" && nx run app:serve --configuration=prod'} | ${'echo "start" && nx run app:preview'} | ${'http://localhost:4300'}
${'echo "start" && nx run app:serve --port 4200'} | ${'echo "start" && nx run app:preview --port=4200'} | ${'http://localhost:4200'}
${'echo "start" && nx run app:serve --port=4200'} | ${'echo "start" && nx run app:preview --port=4200'} | ${'http://localhost:4200'}
${'echo "start" && nx serve app'} | ${'echo "start" && nx run app:preview'} | ${'http://localhost:4300'}
${'echo "start" && nx serve app --configuration=prod'} | ${'echo "start" && nx run app:preview'} | ${'http://localhost:4300'}
${'echo "start" && nx serve app --port 4200'} | ${'echo "start" && nx run app:preview --port=4200'} | ${'http://localhost:4200'}
${'echo "start" && nx serve app --port=4200'} | ${'echo "start" && nx run app:preview --port=4200'} | ${'http://localhost:4200'}
`(
'should replace "$ciWebServerCommand" with "$expectedCommand" when using vite',
async ({ ciWebServerCommand, expectedCommand, expectedUrl }) => {
const nxJson = readNxJson(tree);
nxJson.plugins = [
{
plugin: '@nx/cypress/plugin',
options: {
targetName: 'e2e',
ciTargetName: 'e2e-ci',
},
},
{
plugin: '@nx/vite/plugin',
options: {
buildTargetName: 'build',
previewTargetName: 'preview',
},
},
];
updateNxJson(tree, nxJson);
addProject(tree, tempFs, {
buildTargetName: 'build',
ciTargetName: 'e2e-ci',
appName: 'app',
ciWebServerCommand,
});

await updateCiWebserverForStaticServe(tree);

expect(tree.read('app-e2e/cypress.config.ts', 'utf-8'))
.toMatchInlineSnapshot(`
"import { nxE2EPreset } from '@nx/cypress/plugins/cypress-preset';
import { defineConfig } from 'cypress';
export default defineConfig({
Expand All @@ -217,15 +273,16 @@ export default defineConfig({
default: 'nx run app:serve',
production: 'nx run app:preview',
},
ciWebServerCommand: 'nx run app:preview',
ciBaseUrl: 'http://localhost:4300',
ciWebServerCommand: '${expectedCommand}',
ciBaseUrl: '${expectedUrl}',
}),
baseUrl: 'http://localhost:4200',
},
});
"
`);
});
}
);

it('should use @nx/vite:preview-server executor target value if it exists when no plugins are found', async () => {
// ARRANGE
Expand All @@ -246,6 +303,7 @@ export default defineConfig({
ciTargetName: 'e2e-ci',
buildTargetName: 'build',
usesExecutors: true,
ciWebServerCommand: 'nx run app:serve',
});

// ACT
Expand Down Expand Up @@ -283,10 +341,15 @@ function addProject(
ciTargetName: string;
buildTargetName: string;
appName: string;
noCi?: boolean;
ciWebServerCommand: string;
noVite?: boolean;
usesExecutors?: boolean;
} = { ciTargetName: 'e2e-ci', buildTargetName: 'build', appName: 'app' }
} = {
ciTargetName: 'e2e-ci',
buildTargetName: 'build',
appName: 'app',
ciWebServerCommand: 'nx run app:serve',
}
) {
const appProjectConfig = {
name: overrides.appName,
Expand Down Expand Up @@ -354,8 +417,8 @@ export default defineConfig({
production: 'nx run ${overrides.appName}:preview',
},
${
!overrides.noCi
? `ciWebServerCommand: 'nx run ${overrides.appName}:serve',`
overrides.ciWebServerCommand
? `ciWebServerCommand: '${overrides.ciWebServerCommand}',`
: ''
}
}),
Expand Down
46 changes: 33 additions & 13 deletions packages/cypress/src/migrations/update-19-6-0/update-ci-webserver-for-static-serve.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -75,16 +75,32 @@ export default async function (tree: Tree) {
continue;
}
const ciWebServerCommand = nodes[0].getText();
const NX_TARGET_REGEX = "(?<=nx run )[^']+";
const matches = ciWebServerCommand.match(NX_TARGET_REGEX);
if (!matches) {
let project: string;
let portFlagValue: string | undefined;
if (ciWebServerCommand.includes('nx run')) {
const NX_TARGET_REGEX =
/(?<=nx run )([^' ]+)(?: [^']*--port[= ](\d+))?/;
const matches = ciWebServerCommand.match(NX_TARGET_REGEX);
if (!matches) {
continue;
}
const targetString = matches[1];
project = parseTargetString(targetString, graph).project;
portFlagValue = matches[2];
} else {
const NX_PROJECT_REGEX =
/(?<=nx [^ ]+ )([^' ]+)(?: [^']*--port[= ](\d+))?/;
const matches = ciWebServerCommand.match(NX_PROJECT_REGEX);
if (!matches) {
continue;
}
project = matches[1];
portFlagValue = matches[2];
}

if (!project || !graph.nodes[project]) {
continue;
}
const targetString = matches[0];
const { project, target, configuration } = parseTargetString(
targetString,
graph
);

const pathToViteConfig = [
joinPathFragments(graph.nodes[project].data.root, 'vite.config.ts'),
Expand Down Expand Up @@ -124,7 +140,9 @@ export default async function (tree: Tree) {

const newCommand = ciWebServerCommand.replace(
/nx.*[^"']/,
`nx run ${project}:${serveStaticTargetName}`
`nx run ${project}:${serveStaticTargetName}${
portFlagValue ? ` --port=${portFlagValue}` : ''
}`
);
tree.write(
configFile,
Expand Down Expand Up @@ -162,14 +180,16 @@ export default async function (tree: Tree) {

const newCommand = ciWebServerCommand.replace(
/nx.*[^"']/,
`nx run ${project}:${previewTargetName}`
`nx run ${project}:${previewTargetName}${
portFlagValue ? ` --port=${portFlagValue}` : ''
}`
);
tree.write(
configFile,
`${configFileContents.slice(0, nodes[0].getStart())}${newCommand},
ciBaseUrl: "http://localhost:4300"${configFileContents.slice(
nodes[0].getEnd()
)}`
ciBaseUrl: "http://localhost:${
portFlagValue ?? '4300'
}"${configFileContents.slice(nodes[0].getEnd())}`
);
}
}
Expand Down
Loading