From 1a9df531b643a30616571797ef24c923144d634c Mon Sep 17 00:00:00 2001 From: Caleb Ukle Date: Tue, 13 Sep 2022 09:17:49 -0500 Subject: [PATCH] fix(testing): normalize paths for component-testing (#11963) * fix(testing): normalize paths before accessing the project graph * fix(testing): return object with offset input instead of string * fix(testing): update schemas to provide better prompts --- docs/generated/packages/angular.json | 16 ++++++++++------ docs/generated/packages/react.json | 15 ++++++++------- .../src/cypress-component-tests.test.ts | 12 ++++++++++++ packages/angular/plugins/component-testing.ts | 6 +++--- .../src/generators/component-test/schema.json | 16 +++++++--------- .../cypress-component-configuration/schema.json | 5 ++--- packages/cypress/plugins/cypress-preset.ts | 9 ++++++--- .../src/generators/component-test/schema.json | 4 +--- .../cypress-component-configuration/schema.json | 15 +++++++-------- 9 files changed, 56 insertions(+), 42 deletions(-) diff --git a/docs/generated/packages/angular.json b/docs/generated/packages/angular.json index e3589a88f1..25c286f83a 100644 --- a/docs/generated/packages/angular.json +++ b/docs/generated/packages/angular.json @@ -526,17 +526,20 @@ "componentName": { "type": "string", "description": "Class name of the component to create a test for.", - "examples": ["MyFancyButtonComponent"] + "examples": ["MyFancyButtonComponent"], + "x-prompt": "What is the class name of the component to create a test for?" }, "componentDir": { "type": "string", "description": "Relative path to the folder that contains the component from the project root.", - "example": ["src/lib/my-fancy-button"] + "examples": ["src/lib/my-fancy-button"], + "x-prompt": "What is the path to the component directory from the project root?" }, "componentFileName": { "type": "string", "description": "File name that contains the component without the `.ts` extension.", - "examples": ["my-fancy-button.component"] + "examples": ["my-fancy-button.component"], + "x-prompt": "What is the file name that contains the component?" }, "skipFormat": { "description": "Skip formatting files.", @@ -546,9 +549,9 @@ }, "additionalProperties": false, "required": [ - "projectPath", + "project", "componentName", - "componentPath", + "componentDir", "componentFileName" ], "presets": [] @@ -2193,12 +2196,13 @@ "project": { "type": "string", "description": "The name of the project to add cypress component testing configuration to", - "$default": { "$source": "projectName" }, + "x-dropdown": "projects", "x-prompt": "What project should we add Cypress component testing to?" }, "generateTests": { "type": "boolean", "description": "Generate default component tests for existing components in the project", + "x-prompt": "Automatically generate tests for components declared in this project?", "default": false }, "buildTarget": { diff --git a/docs/generated/packages/react.json b/docs/generated/packages/react.json index 2186a9c9ff..8343aaf277 100644 --- a/docs/generated/packages/react.json +++ b/docs/generated/packages/react.json @@ -1227,19 +1227,20 @@ "project": { "type": "string", "description": "The name of the project to add cypress component testing configuration to", - "$default": { "$source": "projectName" }, + "x-dropdown": "projects", "x-prompt": "What project should we add Cypress component testing to?" }, + "generateTests": { + "type": "boolean", + "description": "Generate default component tests for existing components in the project", + "x-prompt": "Automatically generate tests for components declared in this project?", + "default": false + }, "buildTarget": { "type": "string", "description": "A build target used to configure Cypress component testing in the format of `project:target[:configuration]`. The build target should be from a React app. If not provided we will try to infer it from your projects usage.", "pattern": "^[^:\\s]+:[^:\\s]+(:\\S+)?$" }, - "generateTests": { - "type": "boolean", - "description": "Generate default component tests for existing components in the project", - "default": false - }, "skipFormat": { "type": "boolean", "description": "Skip formatting files", @@ -1275,7 +1276,7 @@ "project": { "type": "string", "description": "The name of the project the component is apart of", - "$default": { "$source": "projectName" }, + "x-dropdown": "projects", "x-prompt": "What project is this component apart of?" }, "componentPath": { diff --git a/e2e/angular-extensions/src/cypress-component-tests.test.ts b/e2e/angular-extensions/src/cypress-component-tests.test.ts index 192b836d27..946beb7df2 100644 --- a/e2e/angular-extensions/src/cypress-component-tests.test.ts +++ b/e2e/angular-extensions/src/cypress-component-tests.test.ts @@ -5,6 +5,7 @@ import { runCLI, uniq, updateFile, + updateProjectConfig, } from '../../utils'; import { names } from '@nrwl/devkit'; describe('Angular Cypress Component Tests', () => { @@ -130,6 +131,17 @@ import {CommonModule} from '@angular/common'; } ` ); + + // make sure assets from the workspace root work. + createFile('libs/assets/data.json', JSON.stringify({ data: 'data' })); + updateProjectConfig(appName, (config) => { + config.targets['build'].options.assets.push({ + glob: '**/*', + input: 'libs/assets', + output: 'assets', + }); + return config; + }); }); it('should test app', () => { diff --git a/packages/angular/plugins/component-testing.ts b/packages/angular/plugins/component-testing.ts index 58adc38424..18e80f3f7c 100644 --- a/packages/angular/plugins/component-testing.ts +++ b/packages/angular/plugins/component-testing.ts @@ -196,17 +196,17 @@ function normalizeBuildTargetOptions( buildOptions.assets = buildOptions.assets.map((asset) => { return typeof asset === 'string' ? joinPathFragments(offset, asset) - : (asset.input = joinPathFragments(offset, asset.input)); + : { ...asset, input: joinPathFragments(offset, asset.input) }; }); buildOptions.styles = buildOptions.styles.map((style) => { return typeof style === 'string' ? joinPathFragments(offset, style) - : (style.input = joinPathFragments(offset, style.input)); + : { ...style, input: joinPathFragments(offset, style.input) }; }); buildOptions.scripts = buildOptions.scripts.map((script) => { return typeof script === 'string' ? joinPathFragments(offset, script) - : (script.input = joinPathFragments(offset, script.input)); + : { ...script, input: joinPathFragments(offset, script.input) }; }); } else { const stylePath = getTempStylesForTailwind(ctContext); diff --git a/packages/angular/src/generators/component-test/schema.json b/packages/angular/src/generators/component-test/schema.json index 5ea9939c2a..b98cf64eff 100644 --- a/packages/angular/src/generators/component-test/schema.json +++ b/packages/angular/src/generators/component-test/schema.json @@ -14,17 +14,20 @@ "componentName": { "type": "string", "description": "Class name of the component to create a test for.", - "examples": ["MyFancyButtonComponent"] + "examples": ["MyFancyButtonComponent"], + "x-prompt": "What is the class name of the component to create a test for?" }, "componentDir": { "type": "string", "description": "Relative path to the folder that contains the component from the project root.", - "example": ["src/lib/my-fancy-button"] + "examples": ["src/lib/my-fancy-button"], + "x-prompt": "What is the path to the component directory from the project root?" }, "componentFileName": { "type": "string", "description": "File name that contains the component without the `.ts` extension.", - "examples": ["my-fancy-button.component"] + "examples": ["my-fancy-button.component"], + "x-prompt": "What is the file name that contains the component?" }, "skipFormat": { "description": "Skip formatting files.", @@ -33,10 +36,5 @@ } }, "additionalProperties": false, - "required": [ - "projectPath", - "componentName", - "componentPath", - "componentFileName" - ] + "required": ["project", "componentName", "componentDir", "componentFileName"] } diff --git a/packages/angular/src/generators/cypress-component-configuration/schema.json b/packages/angular/src/generators/cypress-component-configuration/schema.json index 4d2c760ded..8701b078a7 100644 --- a/packages/angular/src/generators/cypress-component-configuration/schema.json +++ b/packages/angular/src/generators/cypress-component-configuration/schema.json @@ -9,14 +9,13 @@ "project": { "type": "string", "description": "The name of the project to add cypress component testing configuration to", - "$default": { - "$source": "projectName" - }, + "x-dropdown": "projects", "x-prompt": "What project should we add Cypress component testing to?" }, "generateTests": { "type": "boolean", "description": "Generate default component tests for existing components in the project", + "x-prompt": "Automatically generate tests for components declared in this project?", "default": false }, "buildTarget": { diff --git a/packages/cypress/plugins/cypress-preset.ts b/packages/cypress/plugins/cypress-preset.ts index ee06800621..3a687eac20 100644 --- a/packages/cypress/plugins/cypress-preset.ts +++ b/packages/cypress/plugins/cypress-preset.ts @@ -1,5 +1,6 @@ import { ExecutorContext, + normalizePath, ProjectConfiguration, ProjectGraph, readNxJson, @@ -83,9 +84,11 @@ export function getProjectConfigByPath( configPath: string ): ProjectConfiguration { const configFileFromWorkspaceRoot = relative(workspaceRoot, configPath); - const normalizedPathFromWorkspaceRoot = lstatSync(configPath).isFile() - ? configFileFromWorkspaceRoot.replace(extname(configPath), '') - : configFileFromWorkspaceRoot; + const normalizedPathFromWorkspaceRoot = normalizePath( + lstatSync(configPath).isFile() + ? configFileFromWorkspaceRoot.replace(extname(configPath), '') + : configFileFromWorkspaceRoot + ); const mappedGraph = mapProjectGraphFiles(graph); const componentTestingProjectName = diff --git a/packages/react/src/generators/component-test/schema.json b/packages/react/src/generators/component-test/schema.json index 7ba8baf01f..bfaa00dbec 100644 --- a/packages/react/src/generators/component-test/schema.json +++ b/packages/react/src/generators/component-test/schema.json @@ -15,9 +15,7 @@ "project": { "type": "string", "description": "The name of the project the component is apart of", - "$default": { - "$source": "projectName" - }, + "x-dropdown": "projects", "x-prompt": "What project is this component apart of?" }, "componentPath": { diff --git a/packages/react/src/generators/cypress-component-configuration/schema.json b/packages/react/src/generators/cypress-component-configuration/schema.json index 771f1e2b04..90026d68fa 100644 --- a/packages/react/src/generators/cypress-component-configuration/schema.json +++ b/packages/react/src/generators/cypress-component-configuration/schema.json @@ -19,21 +19,20 @@ "project": { "type": "string", "description": "The name of the project to add cypress component testing configuration to", - "$default": { - "$source": "projectName" - }, + "x-dropdown": "projects", "x-prompt": "What project should we add Cypress component testing to?" }, + "generateTests": { + "type": "boolean", + "description": "Generate default component tests for existing components in the project", + "x-prompt": "Automatically generate tests for components declared in this project?", + "default": false + }, "buildTarget": { "type": "string", "description": "A build target used to configure Cypress component testing in the format of `project:target[:configuration]`. The build target should be from a React app. If not provided we will try to infer it from your projects usage.", "pattern": "^[^:\\s]+:[^:\\s]+(:\\S+)?$" }, - "generateTests": { - "type": "boolean", - "description": "Generate default component tests for existing components in the project", - "default": false - }, "skipFormat": { "type": "boolean", "description": "Skip formatting files",