From 4e5084c1f39e2393d5af6915fc2226fe8d0a04e9 Mon Sep 17 00:00:00 2001 From: Martin Hochel Date: Mon, 21 Nov 2022 18:56:33 +0100 Subject: [PATCH 1/2] refactor(scripts): encapsulate v0 and v8 tooling within its domain boundaries --- .../src/index.ts | 16 ++++++--- apps/ts-minbar-test-react/src/index.ts | 17 +++++++--- gulpfile.ts | 6 ++-- .../tasks/fluentPerfRegressions.ts | 7 ++-- .../projects-test/src/createReactApp.ts | 20 +++++------ packages/fluentui/projects-test/src/nextjs.ts | 8 ++--- packages/fluentui/projects-test/src/rollup.ts | 15 +++++---- .../fluentui/projects-test/src/typings.ts | 12 ++++--- scripts/dangerjs/checkChangelog.ts | 9 ++--- scripts/dangerjs/checkStorybookVersions.ts | 14 ++++---- .../detectNonApprovedDependencies/index.ts | 9 ++--- .../utils/getRuntimeDependencies.ts | 7 ++-- .../utils/getVersionConstraints.ts | 2 +- scripts/dangerjs/utils.ts | 6 ++++ scripts/{ => gulp}/config.ts | 9 ++++- .../plugins/gulp-component-menu-behaviors.ts | 2 +- scripts/gulp/plugins/gulp-cypress.ts | 2 +- scripts/gulp/plugins/gulp-doctoc.ts | 7 ++-- scripts/gulp/plugins/gulp-jest.ts | 2 +- scripts/gulp/plugins/gulp-react-docgen.ts | 2 +- scripts/gulp/plugins/gulp-webpack.ts | 4 +-- .../util/getRelativePathToSourceFile.ts | 2 +- scripts/gulp/tasks/bundle.ts | 4 +-- scripts/gulp/tasks/component-info.ts | 2 +- scripts/gulp/tasks/docs.ts | 8 ++--- scripts/gulp/tasks/perf.ts | 4 +-- scripts/gulp/tasks/stats.ts | 4 +-- scripts/gulp/tasks/test-circulars/config.ts | 2 +- scripts/gulp/tasks/test-circulars/index.ts | 2 +- scripts/gulp/tasks/test-circulars/utils.ts | 2 +- scripts/gulp/tasks/test-dependencies/index.ts | 2 +- scripts/gulp/tasks/test-dependencies/utils.ts | 5 ++- scripts/gulp/tasks/test-e2e.ts | 4 +-- scripts/gulp/tasks/vr-build.ts | 2 +- scripts/gulp/tasks/vr-test.ts | 2 +- .../{ => gulp}/webpack/webpack.config.e2e.ts | 5 ++- .../{ => gulp}/webpack/webpack.config.perf.ts | 5 ++- .../webpack/webpack.config.stats.ts | 3 +- scripts/{ => gulp}/webpack/webpack.config.ts | 8 ++--- scripts/jest/index.js | 12 ++++--- scripts/lernaAliasNorthstar.js | 33 ------------------- scripts/monorepo/get-lerna-aliases.js | 16 +++++++++ .../getDefaultEnvironmentVars.js | 4 ++- scripts/monorepo/index.d.ts | 16 +++++++++ scripts/monorepo/index.js | 2 ++ scripts/monorepo/utils.js | 4 +-- scripts/projects-test/packPackages.ts | 3 +- scripts/projects-test/performBrowserTest.ts | 7 ++-- scripts/projects-test/utils.ts | 7 ++-- scripts/screener/screener.config.js | 8 ++--- scripts/utils/index.d.ts | 4 +++ scripts/utils/index.js | 1 + scripts/{gulp/sh.ts => utils/sh.js} | 18 +++++++--- scripts/webpack/webpack-resources.js | 4 +-- 54 files changed, 215 insertions(+), 166 deletions(-) create mode 100644 scripts/dangerjs/utils.ts rename scripts/{ => gulp}/config.ts (93%) rename scripts/{ => gulp}/webpack/webpack.config.e2e.ts (91%) rename scripts/{ => gulp}/webpack/webpack.config.perf.ts (93%) rename scripts/{ => gulp}/webpack/webpack.config.stats.ts (99%) rename scripts/{ => gulp}/webpack/webpack.config.ts (95%) delete mode 100644 scripts/lernaAliasNorthstar.js create mode 100644 scripts/monorepo/get-lerna-aliases.js rename scripts/{webpack => monorepo}/getDefaultEnvironmentVars.js (92%) create mode 100644 scripts/utils/index.d.ts rename scripts/{gulp/sh.ts => utils/sh.js} (64%) diff --git a/apps/ts-minbar-test-react-components/src/index.ts b/apps/ts-minbar-test-react-components/src/index.ts index 31334be6e6502b..1b31386f506b92 100644 --- a/apps/ts-minbar-test-react-components/src/index.ts +++ b/apps/ts-minbar-test-react-components/src/index.ts @@ -1,10 +1,16 @@ -import config from '@fluentui/scripts/config'; import * as path from 'path'; import { addResolutionPathsForProjectPackages, packProjectPackages, } from '@fluentui/scripts/projects-test/packPackages'; -import { prepareTempDirs, log, shEcho, TempPaths, generateFiles } from '@fluentui/scripts/projects-test/utils'; +import { + prepareTempDirs, + log, + shEcho, + TempPaths, + workspaceRoot, + generateFiles, +} from '@fluentui/scripts/projects-test/utils'; const tsVersion = '3.9'; const testName = 'ts-minbar-react-components'; @@ -14,7 +20,7 @@ async function performTest() { const logger = log(`test:${testName}`); try { - const scaffoldPath = config.paths.withRootAt(path.resolve(__dirname, '../files')); + const scaffoldPathRoot = path.resolve(__dirname, '../files'); tempPaths = prepareTempDirs(`${testName}-`); logger(`✔️ Temporary directories created under ${tempPaths.root}`); @@ -30,14 +36,14 @@ async function performTest() { await shEcho(`yarn add ${dependencies}`, tempPaths.testApp); logger(`✔️ Dependencies were installed`); - const lernaRoot = config.paths.allPackages(); + const lernaRoot = workspaceRoot; const packedPackages = await packProjectPackages(logger, lernaRoot, ['@fluentui/react-components']); await addResolutionPathsForProjectPackages(tempPaths.testApp); await shEcho(`yarn add ${packedPackages['@fluentui/react-components']}`, tempPaths.testApp); logger(`✔️ Fluent UI packages were added to dependencies`); - generateFiles(scaffoldPath(), tempPaths.testApp); + generateFiles(scaffoldPathRoot, tempPaths.testApp); logger(`✔️ Source and configs were copied`); await shEcho(`npx npm-which yarn`); diff --git a/apps/ts-minbar-test-react/src/index.ts b/apps/ts-minbar-test-react/src/index.ts index 0cbac32d06762a..6cbe2743a705a7 100644 --- a/apps/ts-minbar-test-react/src/index.ts +++ b/apps/ts-minbar-test-react/src/index.ts @@ -1,10 +1,17 @@ -import config from '@fluentui/scripts/config'; import * as path from 'path'; + import { addResolutionPathsForProjectPackages, packProjectPackages, } from '@fluentui/scripts/projects-test/packPackages'; -import { prepareTempDirs, log, shEcho, TempPaths, generateFiles } from '@fluentui/scripts/projects-test/utils'; +import { + prepareTempDirs, + log, + shEcho, + TempPaths, + workspaceRoot, + generateFiles, +} from '@fluentui/scripts/projects-test/utils'; const tsVersion = '3.9'; const testName = 'ts-minbar-react'; @@ -14,7 +21,7 @@ async function performTest() { const logger = log(`test:${testName}`); try { - const scaffoldPath = config.paths.withRootAt(path.resolve(__dirname, '../files')); + const scaffoldPathRoot = path.resolve(__dirname, '../files'); tempPaths = prepareTempDirs(`${testName}-`); logger(`✔️ Temporary directories created under ${tempPaths.root}`); @@ -31,14 +38,14 @@ async function performTest() { await shEcho(`yarn add ${dependencies}`, tempPaths.testApp); logger(`✔️ Dependencies were installed`); - const lernaRoot = config.paths.allPackages(); + const lernaRoot = workspaceRoot; const packedPackages = await packProjectPackages(logger, lernaRoot, ['@fluentui/react']); await addResolutionPathsForProjectPackages(tempPaths.testApp); await shEcho(`yarn add ${packedPackages['@fluentui/react']}`, tempPaths.testApp); logger(`✔️ Fluent UI packages were added to dependencies`); - generateFiles(scaffoldPath(), tempPaths.testApp); + generateFiles(scaffoldPathRoot, tempPaths.testApp); logger(`✔️ Source and configs were copied`); await shEcho(`npx npm-which yarn`); diff --git a/gulpfile.ts b/gulpfile.ts index dd562b2ee3f980..2bf46ef8dc9045 100644 --- a/gulpfile.ts +++ b/gulpfile.ts @@ -6,15 +6,13 @@ import { task, parallel } from 'gulp'; import * as path from 'path'; import * as tsPaths from 'tsconfig-paths'; -import config from './scripts/config'; - -const { compilerOptions } = require(config.paths.docs('tsconfig.json')); +const { compilerOptions } = require('./packages/fluentui/docs/tsconfig.json'); // add node_modules/.bin to the path so we can invoke .bin CLIs in tasks process.env.PATH = process.env.PATH + path.delimiter + path.resolve(__dirname, 'node_modules', '.bin'); tsPaths.register({ - baseUrl: config.path_base, + baseUrl: __dirname, paths: compilerOptions.paths, }); diff --git a/packages/fluentui/perf-test-northstar/tasks/fluentPerfRegressions.ts b/packages/fluentui/perf-test-northstar/tasks/fluentPerfRegressions.ts index 45ca324ae7c12d..7e9bc60223d233 100644 --- a/packages/fluentui/perf-test-northstar/tasks/fluentPerfRegressions.ts +++ b/packages/fluentui/perf-test-northstar/tasks/fluentPerfRegressions.ts @@ -1,7 +1,6 @@ import * as _ from 'lodash'; import * as path from 'path'; - -import config from '@fluentui/scripts/config'; +import { workspaceRoot } from 'nx/src/utils/app-root'; // TODO: check false positive potential regression reports in fluent ui repo and fix @@ -29,7 +28,7 @@ export function getFluentPerfRegressions() { function linkToFlamegraph(value: string, filename: string) { const urlForDeployPath = process.env.DEPLOYURL ? `${process.env.DEPLOYURL}/perf-test-northstar` - : 'file://' + config.paths.packageDist('perf-test'); + : 'file://' + path.resolve(workspaceRoot, 'packages/fluentui/perf-test/dist'); return `[${value}](${urlForDeployPath}/${path.basename(filename)})`; } @@ -109,7 +108,7 @@ const checkPerfRegressions = (reporter: Reporter) => { reporter.markdown('## Perf Analysis (`@fluentui/react-northstar`)'); try { - perfCounts = require(config.paths.packageDist('perf-test-northstar', 'perfCounts.json')); + perfCounts = require(path.resolve(workspaceRoot, 'packages/perf-test-northstar/dist/perfCounts.json')); } catch { reporter.warn('No perf measurements available'); return; diff --git a/packages/fluentui/projects-test/src/createReactApp.ts b/packages/fluentui/projects-test/src/createReactApp.ts index 3e901b9f51b82e..31ca74cc177a87 100644 --- a/packages/fluentui/projects-test/src/createReactApp.ts +++ b/packages/fluentui/projects-test/src/createReactApp.ts @@ -1,4 +1,3 @@ -import config from '@fluentui/scripts/config'; import fs from 'fs-extra'; import path from 'path'; @@ -10,6 +9,7 @@ import { shEcho, performBrowserTest, prepareCreateReactApp, + workspaceRoot, } from '@fluentui/scripts/projects-test'; /** @@ -21,7 +21,7 @@ import { */ export async function createReactApp() { const logger = log('test:projects:cra-ts'); - const scaffoldPath = config.paths.withRootAt(path.resolve(__dirname, '../assets/cra')); + const scaffoldPathRoot = path.resolve(__dirname, '../assets/cra'); const tempPaths = prepareTempDirs('project-cra-'); logger(`✔️ Temporary directories created under ${tempPaths.root}`); @@ -29,24 +29,24 @@ export async function createReactApp() { logger('STEP 1. Create test React project with TSX scripts..'); await prepareCreateReactApp(tempPaths, 'typescript'); - const testAppPath = config.paths.withRootAt(tempPaths.testApp); - logger(`Test React project is successfully created: ${testAppPath()}`); + const testAppPathRoot = tempPaths.testApp; + logger(`Test React project is successfully created: ${testAppPathRoot}`); logger('STEP 2. Add Fluent UI dependency to test project..'); - const packedPackages = await packProjectPackages(logger, config.paths.base(), ['@fluentui/react-northstar']); - await addResolutionPathsForProjectPackages(testAppPath()); + const packedPackages = await packProjectPackages(logger, workspaceRoot, ['@fluentui/react-northstar']); + await addResolutionPathsForProjectPackages(testAppPathRoot); - await shEcho(`yarn add ${packedPackages['@fluentui/react-northstar']}`, testAppPath()); + await shEcho(`yarn add ${packedPackages['@fluentui/react-northstar']}`, testAppPathRoot); logger(`✔️ Fluent UI packages were added to dependencies`); logger("STEP 3. Reference Fluent UI components in test project's App.tsx"); - fs.copyFileSync(scaffoldPath('App.tsx'), testAppPath('src', 'App.tsx')); + fs.copyFileSync(path.resolve(scaffoldPathRoot, 'App.tsx'), path.resolve(testAppPathRoot, 'src', 'App.tsx')); logger('STEP 4. Build test project..'); - await shEcho(`yarn build`, testAppPath()); + await shEcho(`yarn build`, testAppPathRoot); logger('STEP 5. Load the test app in the browser'); - await performBrowserTest(testAppPath('build')); + await performBrowserTest(path.resolve(testAppPathRoot, 'build')); logger(`✔️ Browser test was passed`); } diff --git a/packages/fluentui/projects-test/src/nextjs.ts b/packages/fluentui/projects-test/src/nextjs.ts index 3d0f2d4df342fc..d64c078dbf6828 100644 --- a/packages/fluentui/projects-test/src/nextjs.ts +++ b/packages/fluentui/projects-test/src/nextjs.ts @@ -1,4 +1,3 @@ -import config from '@fluentui/scripts/config'; import fs from 'fs-extra'; import path from 'path'; @@ -9,12 +8,13 @@ import { log, shEcho, performBrowserTest, + workspaceRoot, } from '@fluentui/scripts/projects-test'; export async function nextjs() { const logger = log('test:projects:nextjs'); - const scaffoldPath = config.paths.withRootAt(path.resolve(__dirname, '../assets/nextjs')); + const scaffoldPathRoot = path.resolve(__dirname, '../assets/nextjs'); const tempPaths = prepareTempDirs('project-nextjs-'); logger(`✔️ Temporary directories created under ${tempPaths.root}`); @@ -25,7 +25,7 @@ export async function nextjs() { logger('STEP 2. Add Fluent UI dependency to test project'); - const packedPackages = await packProjectPackages(logger, config.paths.base(), ['@fluentui/react-northstar']); + const packedPackages = await packProjectPackages(logger, workspaceRoot, ['@fluentui/react-northstar']); await addResolutionPathsForProjectPackages(tempPaths.testApp); await shEcho(`yarn add ${packedPackages['@fluentui/react-northstar']}`, tempPaths.testApp); @@ -33,7 +33,7 @@ export async function nextjs() { logger('STEP 3. Copy scaffold files to test project'); fs.mkdirSync(path.resolve(tempPaths.testApp, 'pages')); - fs.copyFileSync(scaffoldPath('index.js'), path.resolve(tempPaths.testApp, 'pages', 'index.js')); + fs.copyFileSync(path.resolve(scaffoldPathRoot, 'index.js'), path.resolve(tempPaths.testApp, 'pages', 'index.js')); logger(`✔️ Source and bundler's config were created`); logger('STEP 4. Build test project'); diff --git a/packages/fluentui/projects-test/src/rollup.ts b/packages/fluentui/projects-test/src/rollup.ts index 1e55aebef96242..7fdf100ac038f1 100644 --- a/packages/fluentui/projects-test/src/rollup.ts +++ b/packages/fluentui/projects-test/src/rollup.ts @@ -1,4 +1,3 @@ -import config from '@fluentui/scripts/config'; import fs from 'fs-extra'; import path from 'path'; @@ -9,12 +8,13 @@ import { prepareTempDirs, log, shEcho, + workspaceRoot, } from '@fluentui/scripts/projects-test'; export async function rollup() { const logger = log('test:projects:rollup'); - const scaffoldPath = config.paths.withRootAt(path.resolve(__dirname, '../assets/rollup')); + const scaffoldPathRoot = path.resolve(__dirname, '../assets/rollup'); const tempPaths = prepareTempDirs('project-rollup-'); logger(`✔️ Temporary directories created under ${tempPaths.root}`); @@ -36,16 +36,19 @@ export async function rollup() { logger('STEP 2. Add Fluent UI dependency to test project'); - const packedPackages = await packProjectPackages(logger, config.paths.base(), ['@fluentui/react-northstar']); + const packedPackages = await packProjectPackages(logger, workspaceRoot, ['@fluentui/react-northstar']); await addResolutionPathsForProjectPackages(tempPaths.testApp); await shEcho(`yarn add ${packedPackages['@fluentui/react-northstar']}`, tempPaths.testApp); logger(`✔️ Fluent UI packages were added to dependencies`); logger('STEP 3. Copy scaffold files to test project'); - fs.copyFileSync(scaffoldPath('app.js'), path.resolve(tempPaths.testApp, 'app.js')); - fs.copyFileSync(scaffoldPath('rollup.config.js'), path.resolve(tempPaths.testApp, 'rollup.config.js')); - fs.copyFileSync(scaffoldPath('index.html'), path.resolve(tempPaths.testApp, 'index.html')); + fs.copyFileSync(path.resolve(scaffoldPathRoot, 'app.js'), path.resolve(tempPaths.testApp, 'app.js')); + fs.copyFileSync( + path.resolve(scaffoldPathRoot, 'rollup.config.js'), + path.resolve(tempPaths.testApp, 'rollup.config.js'), + ); + fs.copyFileSync(path.resolve(scaffoldPathRoot, 'index.html'), path.resolve(tempPaths.testApp, 'index.html')); logger(`✔️ Source and bundler's config were created`); logger('STEP 4. Build test project'); diff --git a/packages/fluentui/projects-test/src/typings.ts b/packages/fluentui/projects-test/src/typings.ts index 2122a50dc6c7bb..015078390eab04 100644 --- a/packages/fluentui/projects-test/src/typings.ts +++ b/packages/fluentui/projects-test/src/typings.ts @@ -1,4 +1,3 @@ -import config from '@fluentui/scripts/config'; import fs from 'fs-extra'; import path from 'path'; @@ -9,17 +8,20 @@ import { log, shEcho, generateFiles, + workspaceRoot, } from '@fluentui/scripts/projects-test'; export async function typings() { const logger = log('test:projects:typings'); - const scaffoldPath = config.paths.withRootAt(path.resolve(__dirname, '../assets/typings')); + const scaffoldPathRoot = path.resolve(__dirname, '../assets/typings'); const tempPaths = prepareTempDirs('project-typings-'); logger(`✔️ Temporary directories created under ${tempPaths.root}`); // Install dependencies, ensuring we specify the same TS version as our projects use - const rootPkgJson: { devDependencies: Record } = fs.readJSONSync(config.paths.base('package.json')); + const rootPkgJson: { devDependencies: Record } = fs.readJSONSync( + path.resolve(workspaceRoot, 'package.json'), + ); const { typescript: tsVersion } = rootPkgJson.devDependencies; const dependencies = [ @@ -32,13 +34,13 @@ export async function typings() { await shEcho(`yarn add ${dependencies}`, tempPaths.testApp); logger(`✔️ Dependencies were installed`); - const packedPackages = await packProjectPackages(logger, config.paths.base(), ['@fluentui/react-northstar']); + const packedPackages = await packProjectPackages(logger, workspaceRoot, ['@fluentui/react-northstar']); await addResolutionPathsForProjectPackages(tempPaths.testApp); await shEcho(`yarn add ${packedPackages['@fluentui/react-northstar']}`, tempPaths.testApp); logger(`✔️ Fluent UI packages were added to dependencies`); - generateFiles(scaffoldPath(), tempPaths.testApp); + generateFiles(scaffoldPathRoot, tempPaths.testApp); logger(`✔️ Source and configs were copied`); await shEcho(`which yarn`); diff --git a/scripts/dangerjs/checkChangelog.ts b/scripts/dangerjs/checkChangelog.ts index 5f69d1cb5b3d56..492f989d17025b 100644 --- a/scripts/dangerjs/checkChangelog.ts +++ b/scripts/dangerjs/checkChangelog.ts @@ -1,9 +1,10 @@ import type { AddChange } from 'parse-diff'; import * as fs from 'fs'; +import * as path from 'path'; +import type { DangerDSLType } from 'danger'; -import config from '../config'; -import { DangerJS } from './types'; -import { DangerDSLType } from 'danger'; +import { workspaceRoot } from './utils'; +import type { DangerJS } from './types'; const CHANGELOG_FILE = 'packages/fluentui/CHANGELOG.md'; @@ -11,7 +12,7 @@ const CHANGELOG_FILE = 'packages/fluentui/CHANGELOG.md'; * This function asserts that added entries into the changelog file are placed in the right section. */ const hasAddedLinesAfterVersionInChangelog = async (danger: DangerDSLType): Promise => { - const changelogContent = fs.readFileSync(config.paths.base(CHANGELOG_FILE)).toString(); + const changelogContent = fs.readFileSync(path.resolve(workspaceRoot, CHANGELOG_FILE)).toString(); const versionLineNumber = changelogContent .split('\n') .findIndex(line => line.startsWith('')); diff --git a/scripts/dangerjs/checkStorybookVersions.ts b/scripts/dangerjs/checkStorybookVersions.ts index a094740cd7f09d..aacbeea2fb7dd7 100644 --- a/scripts/dangerjs/checkStorybookVersions.ts +++ b/scripts/dangerjs/checkStorybookVersions.ts @@ -1,13 +1,13 @@ import * as fs from 'fs-extra'; import * as path from 'path'; -import config from '../config'; -import { DangerJS } from './types'; -import { PackageJson } from '../monorepo'; +import type { DangerJS } from './types'; +import type { PackageJson } from '../monorepo'; +import { workspaceRoot } from './utils'; const packageJsonFilename = 'package.json'; const webComponentsPackageJsonFilename = 'packages/web-components/package.json'; -const scriptFilename = path.relative(config.paths.base(), __filename); +const scriptFilename = path.relative(workspaceRoot, __filename); /** * This check ensures that the `@storybook/html` dep is specified under web-components rather than @@ -39,8 +39,10 @@ export async function checkStorybookVersions({ danger, fail }: DangerJS) { // Read the package.jsons and compare the dep versions. // (It would be possible to check the detailed diffs of the file and determine whether specifically // the @storybook/react line changed, but just reading and comparing the files is simpler.) - const rootPackageJson: PackageJson = fs.readJSONSync(config.paths.base(packageJsonFilename)); - const webComponentsPackageJson: PackageJson = fs.readJSONSync(config.paths.base(webComponentsPackageJsonFilename)); + const rootPackageJson: PackageJson = fs.readJSONSync(path.resolve(workspaceRoot, packageJsonFilename)); + const webComponentsPackageJson: PackageJson = fs.readJSONSync( + path.resolve(workspaceRoot, webComponentsPackageJsonFilename), + ); const storybookReactVersion = rootPackageJson.devDependencies?.['@storybook/react']; const storybookHtmlVersion = webComponentsPackageJson.devDependencies?.['@storybook/html']; diff --git a/scripts/dangerjs/detectNonApprovedDependencies/index.ts b/scripts/dangerjs/detectNonApprovedDependencies/index.ts index f946c45c615604..c220148cefe5ac 100644 --- a/scripts/dangerjs/detectNonApprovedDependencies/index.ts +++ b/scripts/dangerjs/detectNonApprovedDependencies/index.ts @@ -1,3 +1,4 @@ +import * as path from 'path'; import { getFailedPackageVersionConstraints, getVersionConstraints, @@ -5,10 +6,8 @@ import { getPackageName, FailedConstraintsExplanation, } from './utils'; -import config from '../../config'; import { DangerJS } from '../types'; - -const { paths } = config; +import { workspaceRoot } from '../utils'; /** * This check uses the following logic: @@ -23,7 +22,9 @@ const detectNonApprovedDependencies = async (dangerJS: DangerJS) => { const allFailedVersionConstraints: FailedConstraintsExplanation[] = []; const dependencyPackageIds = getRuntimeDependencies('react-northstar'); - const versionConstraints = await getVersionConstraints(paths.packages('react-northstar', 'package.json')); + const versionConstraints = await getVersionConstraints( + path.resolve(workspaceRoot, 'packages/fluentui/react-northstar/package.json'), + ); dependencyPackageIds.forEach(packageId => { const failedPackageVersionConstraints = getFailedPackageVersionConstraints( diff --git a/scripts/dangerjs/detectNonApprovedDependencies/utils/getRuntimeDependencies.ts b/scripts/dangerjs/detectNonApprovedDependencies/utils/getRuntimeDependencies.ts index fac7dbe21173b7..2d48898e0ae089 100644 --- a/scripts/dangerjs/detectNonApprovedDependencies/utils/getRuntimeDependencies.ts +++ b/scripts/dangerjs/detectNonApprovedDependencies/utils/getRuntimeDependencies.ts @@ -1,8 +1,5 @@ import { spawnSync } from 'child_process'; - -import config from '../../../config'; - -const { paths } = config; +import { workspaceRoot } from '../../utils'; /** * It is necessary to run corresponding Gulp task in a separate process. @@ -14,7 +11,7 @@ const getRuntimeDependencies = (packageName: string) => { const dependencyRegex = /^dependency:\s+(.*)$/; const result = spawnSync(`yarn gulp test:dependencies:list --prefix="dependency: " --package=${packageName}`, { shell: true, - cwd: paths.base(), + cwd: workspaceRoot, stdio: 'pipe', encoding: 'utf-8', }); diff --git a/scripts/dangerjs/detectNonApprovedDependencies/utils/getVersionConstraints.ts b/scripts/dangerjs/detectNonApprovedDependencies/utils/getVersionConstraints.ts index 1ea59e59f2a3ab..5b6445ea218686 100644 --- a/scripts/dangerjs/detectNonApprovedDependencies/utils/getVersionConstraints.ts +++ b/scripts/dangerjs/detectNonApprovedDependencies/utils/getVersionConstraints.ts @@ -3,7 +3,7 @@ import * as fs from 'fs'; import { getPackageName, getPackageVersion } from './packageNameUtils'; import { isIgnored } from '../approvedPackages'; -import { PackageJson } from '../../../monorepo'; +import type { PackageJson } from '../../../monorepo'; type Constraints = { [PackageId: string]: string[] }; diff --git a/scripts/dangerjs/utils.ts b/scripts/dangerjs/utils.ts new file mode 100644 index 00000000000000..056a78b10fccae --- /dev/null +++ b/scripts/dangerjs/utils.ts @@ -0,0 +1,6 @@ +// we cannot use dependencies written in JS via commonjs - danger will error out +// -> Unable to evaluate the Dangerfile +// TypeError: require(...) is not a function +// at module.exports (/mnt/vss/_work/1/s/babel.config.js:1:65) + +export { workspaceRoot } from 'nx/src/utils/app-root'; diff --git a/scripts/config.ts b/scripts/gulp/config.ts similarity index 93% rename from scripts/config.ts rename to scripts/gulp/config.ts index 83039d4fd8956a..b350c6e148efe7 100644 --- a/scripts/config.ts +++ b/scripts/gulp/config.ts @@ -2,6 +2,12 @@ import * as path from 'path'; import * as _ from 'lodash'; import * as webpack from 'webpack'; import { URL } from 'url'; +import { getLernaAliases } from '../monorepo'; + +// northstar packages should pull these from npm, not the repo +const excludedPackages = ['@fluentui/dom-utilities']; +const lernaAliases = (options: Omit[number], 'excludedPackages'>) => + getLernaAliases({ excludedPackages, ...options }); // ------------------------------------ // Environment vars @@ -30,7 +36,7 @@ const envConfig = { // ---------------------------------- // Project Structure // ---------------------------------- - path_base: path.resolve(__dirname, '..'), + path_base: path.resolve(__dirname, '../../'), dir_build: 'scripts', dir_docs: 'packages/fluentui/docs', dir_docs_dist: 'packages/fluentui/docs/dist', @@ -167,6 +173,7 @@ const config = { isRoot, /** Package name the task is running against: default to react if running at root, or cwd otherwise */ package: packageName, + lernaAliases, }; export default config; diff --git a/scripts/gulp/plugins/gulp-component-menu-behaviors.ts b/scripts/gulp/plugins/gulp-component-menu-behaviors.ts index c00e4dbcee381d..b20b107fb86090 100644 --- a/scripts/gulp/plugins/gulp-component-menu-behaviors.ts +++ b/scripts/gulp/plugins/gulp-component-menu-behaviors.ts @@ -6,7 +6,7 @@ import _ from 'lodash'; import fs from 'fs'; import doctrine from 'doctrine'; import { Transform } from 'stream'; -import config from '../../config'; +import config from '../config'; const { paths } = config; diff --git a/scripts/gulp/plugins/gulp-cypress.ts b/scripts/gulp/plugins/gulp-cypress.ts index 3ec2b136d1ffc9..711254bb4b4f42 100644 --- a/scripts/gulp/plugins/gulp-cypress.ts +++ b/scripts/gulp/plugins/gulp-cypress.ts @@ -1,4 +1,4 @@ -import sh from '../sh'; +import { sh } from '../../utils'; export type CypressPluginConfig = { serverUrl: string; diff --git a/scripts/gulp/plugins/gulp-doctoc.ts b/scripts/gulp/plugins/gulp-doctoc.ts index be0ecf312b183d..8a4e7d22cd2104 100644 --- a/scripts/gulp/plugins/gulp-doctoc.ts +++ b/scripts/gulp/plugins/gulp-doctoc.ts @@ -1,11 +1,12 @@ +import path from 'path'; import fs from 'fs'; import through2 from 'through2'; -import config from '../../config'; -import sh from '../sh'; +import { sh } from '../../utils'; +import { workspaceRoot } from '../../monorepo'; import { runPrettier } from '../../prettier/prettier-helpers'; -const insideGitRepo = fs.existsSync(config.paths.base('.git')); +const insideGitRepo = fs.existsSync(path.resolve(workspaceRoot, '.git')); export default () => through2.obj((file, enc, done) => { diff --git a/scripts/gulp/plugins/gulp-jest.ts b/scripts/gulp/plugins/gulp-jest.ts index 5f8eaf72c3acde..948438a266c1bb 100644 --- a/scripts/gulp/plugins/gulp-jest.ts +++ b/scripts/gulp/plugins/gulp-jest.ts @@ -1,4 +1,4 @@ -import sh from '../sh'; +import { sh } from '../../utils'; export type JestPluginConfig = { config: string; diff --git a/scripts/gulp/plugins/gulp-react-docgen.ts b/scripts/gulp/plugins/gulp-react-docgen.ts index dfc77c4a2eb28d..66bb8eb25ea5b4 100644 --- a/scripts/gulp/plugins/gulp-react-docgen.ts +++ b/scripts/gulp/plugins/gulp-react-docgen.ts @@ -5,7 +5,7 @@ import Vinyl from 'vinyl'; import getComponentInfo, { GetComponentInfoOptions } from './util/getComponentInfo'; -import config from '../../config'; +import config from '../config'; const { paths } = config; diff --git a/scripts/gulp/plugins/gulp-webpack.ts b/scripts/gulp/plugins/gulp-webpack.ts index 6f02fb0baad0b2..1f994325e99942 100644 --- a/scripts/gulp/plugins/gulp-webpack.ts +++ b/scripts/gulp/plugins/gulp-webpack.ts @@ -1,12 +1,12 @@ import webpack from 'webpack'; -import config from '../../config'; +import config from '../config'; import { log, PluginError } from 'gulp-util'; const { __DEV__, __SKIP_ERRORS__ } = config.compiler_globals; const DEV_SKIP_ERRORS = __DEV__ && __SKIP_ERRORS__; -const webpackPlugin = (webpackConfig: any, cb: (errror?: any) => void, onComplete = (err: any, stats: any) => {}) => { +const webpackPlugin = (webpackConfig: any, cb: (error?: any) => void, onComplete = (err: any, stats: any) => {}) => { webpack(webpackConfig).run((err, stats) => { const { errors = [], warnings = [] } = stats?.toJson() ?? {}; onComplete(err, stats); diff --git a/scripts/gulp/plugins/util/getRelativePathToSourceFile.ts b/scripts/gulp/plugins/util/getRelativePathToSourceFile.ts index 777ea9ecfb20e4..ffbb90aa9dc68b 100644 --- a/scripts/gulp/plugins/util/getRelativePathToSourceFile.ts +++ b/scripts/gulp/plugins/util/getRelativePathToSourceFile.ts @@ -1,5 +1,5 @@ import path from 'path'; -import config from '../../../config'; +import config from '../../config'; const examplesPath = config.paths.docsSrc('examples', 'components'); diff --git a/scripts/gulp/tasks/bundle.ts b/scripts/gulp/tasks/bundle.ts index 86640e40594d9f..c7fd1747d93224 100644 --- a/scripts/gulp/tasks/bundle.ts +++ b/scripts/gulp/tasks/bundle.ts @@ -3,8 +3,8 @@ import babel from 'gulp-babel'; import sourcemaps from 'gulp-sourcemaps'; import del from 'del'; -import config from '../../config'; -import sh from '../sh'; +import config from '../config'; +import { sh } from '../../utils'; const { paths } = config; diff --git a/scripts/gulp/tasks/component-info.ts b/scripts/gulp/tasks/component-info.ts index f6e3ac2fd3895f..7ff1aaec31cf47 100644 --- a/scripts/gulp/tasks/component-info.ts +++ b/scripts/gulp/tasks/component-info.ts @@ -7,7 +7,7 @@ import path from 'path'; import readPkgUp from 'read-pkg-up'; import { Transform } from 'stream'; -import config from '../../config'; +import config from '../config'; import gulpReactDocgen from '../plugins/gulp-react-docgen'; const logWatchAdd = (filePath: string) => log('Created', chalk.blue(path.basename(filePath))); diff --git a/scripts/gulp/tasks/docs.ts b/scripts/gulp/tasks/docs.ts index 2c43f4f8d014ab..058e27ed4d5c9a 100644 --- a/scripts/gulp/tasks/docs.ts +++ b/scripts/gulp/tasks/docs.ts @@ -12,8 +12,8 @@ import webpack from 'webpack'; import WebpackDevMiddleware from 'webpack-dev-middleware'; import WebpackHotMiddleware from 'webpack-hot-middleware'; -import sh from '../sh'; -import config from '../../config'; +import { sh } from '../../utils'; +import config from '../config'; import gulpComponentMenuBehaviors from '../plugins/gulp-component-menu-behaviors'; import gulpDoctoc from '../plugins/gulp-doctoc'; import gulpExampleMenu from '../plugins/gulp-example-menu'; @@ -122,7 +122,7 @@ task('build:docs:schema', () => ); task('build:docs:webpack', cb => { - webpackPlugin(require('../../webpack/webpack.config').default, cb); + webpackPlugin(require('../webpack/webpack.config').default, cb); }); task('build:docs:assets:component:info', cb => { @@ -186,7 +186,7 @@ task('serve:docs', async () => { }); task('serve:docs:hot', async () => { - const webpackConfig = require('../../webpack/webpack.config').default; + const webpackConfig = require('../webpack/webpack.config').default; const compiler = webpack(webpackConfig); server = await serve(paths.docsDist(), config.server_host, config.server_port, app => { diff --git a/scripts/gulp/tasks/perf.ts b/scripts/gulp/tasks/perf.ts index 8bb4f933b1a5fc..aa1aaab6df3db0 100644 --- a/scripts/gulp/tasks/perf.ts +++ b/scripts/gulp/tasks/perf.ts @@ -17,7 +17,7 @@ import { ProfilerMeasureCycle, ReducedMeasures, } from '../../../packages/fluentui/perf/types'; -import config from '../../config'; +import config from '../config'; import webpackPlugin from '../plugins/gulp-webpack'; import { Browser, createChrome, createElectron } from './browserAdapters'; @@ -156,7 +156,7 @@ async function runMeasures( task('perf:clean', () => del(paths.perfDist(), { force: true })); task('perf:build', cb => { - webpackPlugin(require('../../webpack/webpack.config.perf').default, cb); + webpackPlugin(require('../webpack/webpack.config.perf').default, cb); }); task('perf:run', async () => { diff --git a/scripts/gulp/tasks/stats.ts b/scripts/gulp/tasks/stats.ts index 22af7bd4e06c1a..72874be46c3636 100644 --- a/scripts/gulp/tasks/stats.ts +++ b/scripts/gulp/tasks/stats.ts @@ -7,7 +7,7 @@ import stableStringify from 'json-stable-stringify-without-jsonify'; import { argv } from 'yargs'; import requestHttp from 'request-promise-native'; -import config from '../../config'; +import config from '../config'; const { paths } = config; @@ -115,7 +115,7 @@ const currentStatsFilePath = paths.docsSrc('currentBundleStats.json'); task('stats:build:bundle', async () => { process.env.NODE_ENV = 'build'; - const webpackStatsConfig = require('../../webpack/webpack.config.stats').default; + const webpackStatsConfig = require('../webpack/webpack.config.stats').default; const assets = await compileOneByOne(webpackStatsConfig); const results = _(assets) diff --git a/scripts/gulp/tasks/test-circulars/config.ts b/scripts/gulp/tasks/test-circulars/config.ts index de433cf3ec4efa..2eb96a5859a22b 100644 --- a/scripts/gulp/tasks/test-circulars/config.ts +++ b/scripts/gulp/tasks/test-circulars/config.ts @@ -1,4 +1,4 @@ -import config from '../../../config'; +import config from '../../config'; const reactPackageDist = (filePath: string) => config.paths.packageDist('react-northstar', 'es', filePath); diff --git a/scripts/gulp/tasks/test-circulars/index.ts b/scripts/gulp/tasks/test-circulars/index.ts index d8a55fcbe5253e..8f4c8aee6874e7 100644 --- a/scripts/gulp/tasks/test-circulars/index.ts +++ b/scripts/gulp/tasks/test-circulars/index.ts @@ -3,7 +3,7 @@ import fs from 'fs'; import { task, series } from 'gulp'; import webpackPlugin from '../../plugins/gulp-webpack'; -import config from '../../../config'; +import config from '../../config'; import { cyclesToSkip } from './config'; import { buildWebpackConfig, configureCircularDependencyCheckPlugin, isCycleToSkip } from './utils'; diff --git a/scripts/gulp/tasks/test-circulars/utils.ts b/scripts/gulp/tasks/test-circulars/utils.ts index 765836badd1b50..759943db1e35c7 100644 --- a/scripts/gulp/tasks/test-circulars/utils.ts +++ b/scripts/gulp/tasks/test-circulars/utils.ts @@ -1,7 +1,7 @@ import path from 'path'; import CircularDependencyPlugin from 'circular-dependency-plugin'; -import config from '../../../config'; +import config from '../../config'; export const isCycleToSkip = (proposedCycle: string[], benignCycles: string[][]) => { return benignCycles.some(benignCycle => { diff --git a/scripts/gulp/tasks/test-dependencies/index.ts b/scripts/gulp/tasks/test-dependencies/index.ts index 70ce7bb96dbe19..24913585cc8c11 100644 --- a/scripts/gulp/tasks/test-dependencies/index.ts +++ b/scripts/gulp/tasks/test-dependencies/index.ts @@ -4,7 +4,7 @@ import * as fs from 'fs'; import { argv } from 'yargs'; import { prepareWebpackConfig, runWebpack } from './utils'; -import config from '../../../config'; +import config from '../../config'; const { paths } = config; diff --git a/scripts/gulp/tasks/test-dependencies/utils.ts b/scripts/gulp/tasks/test-dependencies/utils.ts index 1309eb5e765240..9aa11389b1d047 100644 --- a/scripts/gulp/tasks/test-dependencies/utils.ts +++ b/scripts/gulp/tasks/test-dependencies/utils.ts @@ -1,9 +1,8 @@ import * as path from 'path'; -import { webpack as lernaAliases } from '../../../lernaAliasNorthstar'; import { LicenseWebpackPlugin } from 'license-webpack-plugin'; import webpack from 'webpack'; -import config from '../../../config'; +import config from '../../config'; const { paths } = config; @@ -60,7 +59,7 @@ export const prepareWebpackConfig = (options: WebpackOptions) => { resolve: { extensions: ['.ts', '.tsx', '.js', '.json'], alias: { - ...lernaAliases(), + ...config.lernaAliases({ type: 'webpack' }), src: paths.packageSrc('react-northstar'), }, }, diff --git a/scripts/gulp/tasks/test-e2e.ts b/scripts/gulp/tasks/test-e2e.ts index d0192b14d59041..9da8701f146923 100644 --- a/scripts/gulp/tasks/test-e2e.ts +++ b/scripts/gulp/tasks/test-e2e.ts @@ -4,7 +4,7 @@ import { Server } from 'http'; import portfinder from 'portfinder'; import * as yargs from 'yargs'; -import config from '../../config'; +import config from '../config'; import webpackPlugin from '../plugins/gulp-webpack'; import cypress from '../plugins/gulp-cypress'; @@ -17,7 +17,7 @@ const argv = yargs.option('skipBuild', {}).option('testNamePattern', { alias: 't task('test:e2e:clean', () => del(paths.e2eDist(), { force: true })); task('test:e2e:build', cb => { - webpackPlugin(require('../../webpack/webpack.config.e2e').default, cb); + webpackPlugin(require('../webpack/webpack.config.e2e').default, cb); }); let server: Server; diff --git a/scripts/gulp/tasks/vr-build.ts b/scripts/gulp/tasks/vr-build.ts index 6fe6cb4460b0ff..fcde98215ddfe0 100644 --- a/scripts/gulp/tasks/vr-build.ts +++ b/scripts/gulp/tasks/vr-build.ts @@ -1,7 +1,7 @@ import { task, series } from 'gulp'; import fs from 'fs'; -import config from '../../config'; +import config from '../config'; import getScreenerStates from '../../screener/screener.states'; const { paths } = config; diff --git a/scripts/gulp/tasks/vr-test.ts b/scripts/gulp/tasks/vr-test.ts index 4c2e3be9183a98..ecdc04610e9026 100644 --- a/scripts/gulp/tasks/vr-test.ts +++ b/scripts/gulp/tasks/vr-test.ts @@ -1,7 +1,7 @@ import { task } from 'gulp'; import { argv } from 'yargs'; -import config from '../../config'; +import config from '../config'; import { getAllPackageInfo } from '../../monorepo'; import { screenerRunner } from '../../screener/screener.runner'; import getConfig from '../../screener/screener.config'; diff --git a/scripts/webpack/webpack.config.e2e.ts b/scripts/gulp/webpack/webpack.config.e2e.ts similarity index 91% rename from scripts/webpack/webpack.config.e2e.ts rename to scripts/gulp/webpack/webpack.config.e2e.ts index e7bde70e18e47e..2efd995dc28460 100644 --- a/scripts/webpack/webpack.config.e2e.ts +++ b/scripts/gulp/webpack/webpack.config.e2e.ts @@ -1,8 +1,7 @@ import CopyWebpackPlugin from 'copy-webpack-plugin'; import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin'; -import { webpack as lernaAliases } from '../lernaAliasNorthstar'; import webpack from 'webpack'; -import getDefaultEnvironmentVars from './getDefaultEnvironmentVars'; +import { getDefaultEnvironmentVars } from '../../monorepo'; import config from '../config'; const { paths } = config; @@ -60,7 +59,7 @@ const webpackConfig: webpack.Configuration = { path: require.resolve('path-browserify'), }, extensions: ['.ts', '.tsx', '.js', '.json'], - alias: lernaAliases(), + alias: config.lernaAliases({ type: 'webpack' }), }, performance: { hints: false, // to (temporarily) disable "WARNING in entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit") diff --git a/scripts/webpack/webpack.config.perf.ts b/scripts/gulp/webpack/webpack.config.perf.ts similarity index 93% rename from scripts/webpack/webpack.config.perf.ts rename to scripts/gulp/webpack/webpack.config.perf.ts index 41e57e3c35b539..f4c17573d0b45c 100644 --- a/scripts/webpack/webpack.config.perf.ts +++ b/scripts/gulp/webpack/webpack.config.perf.ts @@ -1,9 +1,8 @@ import CopyWebpackPlugin from 'copy-webpack-plugin'; import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin'; -import { webpack as lernaAliases } from '../lernaAliasNorthstar'; import { argv } from 'yargs'; import webpack from 'webpack'; -import getDefaultEnvironmentVars from './getDefaultEnvironmentVars'; +import { getDefaultEnvironmentVars } from '../../monorepo'; import config from '../config'; const { paths } = config; @@ -60,7 +59,7 @@ const webpackConfig: webpack.Configuration = { }, extensions: ['.ts', '.tsx', '.js', '.json'], alias: { - ...lernaAliases(), + ...config.lernaAliases({ type: 'webpack' }), src: paths.packageSrc('react-northstar'), // We are using React in production mode with tracing. diff --git a/scripts/webpack/webpack.config.stats.ts b/scripts/gulp/webpack/webpack.config.stats.ts similarity index 99% rename from scripts/webpack/webpack.config.stats.ts rename to scripts/gulp/webpack/webpack.config.stats.ts index 27dcf8ea167fa6..1b426246dfdd96 100644 --- a/scripts/webpack/webpack.config.stats.ts +++ b/scripts/gulp/webpack/webpack.config.stats.ts @@ -2,13 +2,14 @@ import { CleanWebpackPlugin } from 'clean-webpack-plugin'; import fs from 'fs'; import path from 'path'; import webpack from 'webpack'; -import config from '../config'; import glob from 'glob'; import * as _ from 'lodash'; import { argv } from 'yargs'; import TerserWebpackPlugin from 'terser-webpack-plugin'; // const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin; +import config from '../config'; + const { paths } = config; // Interfaces no longer exist after transpiling, causing webpack to throw errors about them. diff --git a/scripts/webpack/webpack.config.ts b/scripts/gulp/webpack/webpack.config.ts similarity index 95% rename from scripts/webpack/webpack.config.ts rename to scripts/gulp/webpack/webpack.config.ts index 01634fa9c2b711..dc88cd36ac2278 100644 --- a/scripts/webpack/webpack.config.ts +++ b/scripts/gulp/webpack/webpack.config.ts @@ -1,6 +1,5 @@ import CopyWebpackPlugin from 'copy-webpack-plugin'; import HtmlWebpackPlugin from 'html-webpack-plugin'; -import { webpack as lernaAliases } from '../lernaAliasNorthstar'; import _ from 'lodash'; import webpack from 'webpack'; import TerserPlugin from 'terser-webpack-plugin'; @@ -8,7 +7,7 @@ import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin'; import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer'; import config from '../config'; -import getDefaultEnvironmentVars from './getDefaultEnvironmentVars'; +import { getDefaultEnvironmentVars } from '../../monorepo'; const { paths } = config; const { __DEV__, __PERF__, __PROD__ } = config.compiler_globals; @@ -104,7 +103,8 @@ const webpackConfig: webpack.Configuration & babelStandalone: require('@babel/standalone/package.json').version, lodash: require('lodash/package.json').version, prettier: require('prettier/package.json').version, - fluentUI: require('../package.json').version, + // FIXME?: this is not used anywhere in doc templates and also points to wrong package.json (one within scripts/) + fluentUI: require('../../package.json').version, reactVis: require('react-vis/package.json').version, }, }), @@ -124,7 +124,7 @@ const webpackConfig: webpack.Configuration & resolve: { extensions: ['.ts', '.tsx', '.js', '.json'], alias: { - ...lernaAliases(), + ...config.lernaAliases({ type: 'webpack' }), src: paths.packageSrc('react-northstar'), faker: 'faker/locale/en', 'react-hook-form': 'react-hook-form/dist/react-hook-form.ie11', diff --git a/scripts/jest/index.js b/scripts/jest/index.js index 13768877335f77..8c19d48dcc1c2d 100644 --- a/scripts/jest/index.js +++ b/scripts/jest/index.js @@ -1,5 +1,7 @@ -const lernaAlias = require('../lernaAliasNorthstar'); -const findGitRoot = require('../monorepo/findGitRoot'); +const { getLernaAliases, workspaceRoot } = require('../monorepo'); + +// northstar packages should pull these from npm, not the repo +const excludedPackages = ['@fluentui/dom-utilities']; module.exports = (/** @type {import('@jest/types').Config.InitialOptions} */ customConfig) => ({ coverageDirectory: './coverage/', @@ -14,8 +16,10 @@ module.exports = (/** @type {import('@jest/types').Config.InitialOptions} */ cus watchPlugins: ['jest-watch-typeahead/filename', 'jest-watch-typeahead/testname'], ...customConfig, moduleNameMapper: { - ...lernaAlias.jest({ - directory: findGitRoot(), + ...getLernaAliases({ + type: 'jest', + excludedPackages, + directory: workspaceRoot, }), ...customConfig.moduleNameMapper, }, diff --git a/scripts/lernaAliasNorthstar.js b/scripts/lernaAliasNorthstar.js deleted file mode 100644 index 79eba860f0dc1b..00000000000000 --- a/scripts/lernaAliasNorthstar.js +++ /dev/null @@ -1,33 +0,0 @@ -const lernaAlias = require('lerna-alias'); - -// northstar packages should pull these from npm, not the repo -const excludedPackages = ['@fluentui/date-time-utilities', '@fluentui/dom-utilities']; - -/** - * @type {typeof lernaAlias} - */ -const api = { - jest: options => { - const aliases = lernaAlias.jest(options); - for (const pkg of excludedPackages) { - delete aliases[`^${pkg}$`]; - } - return aliases; - }, - rollup: options => { - const aliases = lernaAlias.rollup(options); - for (const pkg of excludedPackages) { - delete aliases[pkg]; - } - return aliases; - }, - webpack: options => { - const aliases = lernaAlias.webpack(options); - for (const pkg of excludedPackages) { - delete aliases[`${pkg}$`]; - } - return aliases; - }, -}; - -module.exports = api; diff --git a/scripts/monorepo/get-lerna-aliases.js b/scripts/monorepo/get-lerna-aliases.js new file mode 100644 index 00000000000000..81e9f7e414f7cf --- /dev/null +++ b/scripts/monorepo/get-lerna-aliases.js @@ -0,0 +1,16 @@ +const lernaAlias = require('lerna-alias'); + +/** + * + * @param {{excludedPackages:string[];type:keyof typeof lernaAlias} & lernaAlias.Options} options + */ +function getLernaAliases(options) { + const { excludedPackages, type, ...lernaOptions } = options; + const aliases = lernaAlias[type](lernaOptions); + for (const pkg of excludedPackages) { + delete aliases[`^${pkg}$`]; + } + return aliases; +} + +exports.getLernaAliases = getLernaAliases; diff --git a/scripts/webpack/getDefaultEnvironmentVars.js b/scripts/monorepo/getDefaultEnvironmentVars.js similarity index 92% rename from scripts/webpack/getDefaultEnvironmentVars.js rename to scripts/monorepo/getDefaultEnvironmentVars.js index 44b787e549829d..516d8523035ecf 100644 --- a/scripts/webpack/getDefaultEnvironmentVars.js +++ b/scripts/monorepo/getDefaultEnvironmentVars.js @@ -34,7 +34,9 @@ const getVariables = options => { * @param {Record} [otherValues] - Other values to include in the environment. Key is the * environment variable name and value is the non-stringified value. */ -module.exports = (isProduction, otherValues) => ({ +const getDefaultEnvironmentVars = (isProduction, otherValues) => ({ 'process.env.NODE_ENV': JSON.stringify(isProduction ? 'production' : process.env.NODE_ENV || 'development'), ...(otherValues && getVariables(otherValues)), }); + +exports.getDefaultEnvironmentVars = getDefaultEnvironmentVars; diff --git a/scripts/monorepo/index.d.ts b/scripts/monorepo/index.d.ts index 018f9adba14b6c..feaa3f1257c545 100644 --- a/scripts/monorepo/index.d.ts +++ b/scripts/monorepo/index.d.ts @@ -89,3 +89,19 @@ export declare function getProjectMetadata(options: { * @param options.production - include production dependencies */ export async function getDependencies(packageName: string, options?: { production?: true; dev?: true }): string[]; + +export function getLernaAliases( + options: { + excludedPackages: string[]; + type: keyof typeof import('lerna-alias'); + } & import('lerna-alias').Options, +): import('lerna-alias').Aliases; + +export const getDefaultEnvironmentVars: ( + isProduction?: boolean | undefined, + otherValues?: Record | undefined, +) => { + 'process.env.NODE_ENV': string; +}; + +export const workspaceRoot: string; diff --git a/scripts/monorepo/index.js b/scripts/monorepo/index.js index 6d8e66120fd0bb..6a7b527403d1c6 100644 --- a/scripts/monorepo/index.js +++ b/scripts/monorepo/index.js @@ -6,5 +6,7 @@ module.exports = { isConvergedPackage: require('./isConvergedPackage'), getAffectedPackages: require('./getAffectedPackages'), getNthCommit: require('./getNthCommit'), + ...require('./getDefaultEnvironmentVars'), + ...require('./get-lerna-aliases'), ...require('./utils'), }; diff --git a/scripts/monorepo/utils.js b/scripts/monorepo/utils.js index 53e6abb629ca6b..5ba56348a081eb 100644 --- a/scripts/monorepo/utils.js +++ b/scripts/monorepo/utils.js @@ -1,7 +1,6 @@ -// @ts-check - const fs = require('fs'); const path = require('path'); +const { workspaceRoot } = require('nx/src/utils/app-root'); const findGitRoot = require('./findGitRoot'); @@ -19,3 +18,4 @@ function getProjectMetadata(options) { } exports.getProjectMetadata = getProjectMetadata; +exports.workspaceRoot = workspaceRoot; diff --git a/scripts/projects-test/packPackages.ts b/scripts/projects-test/packPackages.ts index f22e06343f4f8d..4ef63ea6abd044 100644 --- a/scripts/projects-test/packPackages.ts +++ b/scripts/projects-test/packPackages.ts @@ -3,9 +3,8 @@ import { PackageGraph } from '@lerna/package-graph'; import fs from 'fs-extra'; import path from 'path'; -import sh from '../gulp/sh'; - import { createTempDir, shEcho } from './utils'; +import { sh } from '../utils'; type PackedPackages = Record; diff --git a/scripts/projects-test/performBrowserTest.ts b/scripts/projects-test/performBrowserTest.ts index 42d348ceac3606..ebf0f64ce40ea8 100644 --- a/scripts/projects-test/performBrowserTest.ts +++ b/scripts/projects-test/performBrowserTest.ts @@ -1,17 +1,18 @@ -import config from '../config'; import { safeLaunchOptions } from '../puppeteer/puppeteer.config'; import express from 'express'; import http from 'http'; import puppeteer from 'puppeteer'; import { AddressInfo } from 'net'; +const SERVER_HOST = 'localhost'; + function startServer(publicDirectory: string, listenPort: number) { return new Promise((resolve, reject) => { try { const app = express(); app.use(express.static(publicDirectory)); - const server = app.listen(listenPort, config.server_host, () => { + const server = app.listen(listenPort, SERVER_HOST, () => { resolve(server); }); } catch (err) { @@ -57,7 +58,7 @@ export async function performBrowserTest(publicDirectory: string) { error = pageError; }); - const url = `http://${config.server_host}:${port}`; + const url = `http://${SERVER_HOST}:${port}`; console.log(`Loading ${url} in puppeteer...`); await page.goto(url); console.log('Page loaded'); diff --git a/scripts/projects-test/utils.ts b/scripts/projects-test/utils.ts index 3b6cec277e4b8d..b77a9ae73a760e 100644 --- a/scripts/projects-test/utils.ts +++ b/scripts/projects-test/utils.ts @@ -2,8 +2,9 @@ import fs from 'fs'; import fsExtra from 'fs-extra'; import path from 'path'; import tmp from 'tmp'; -// note: there's nothing gulp-specific about this utility, it just runs commands -import sh from '../gulp/sh'; + +import { sh } from '../utils'; +import { workspaceRoot } from '../monorepo'; // Clean up created files/folders on exit, even after exceptions // (will not catch SIGINT on windows) @@ -72,3 +73,5 @@ export async function shEcho(cmd: string, cwd?: string) { export function generateFiles(srcFolder: string, target: string) { fsExtra.copySync(srcFolder, target, { recursive: true }); } + +export { workspaceRoot }; diff --git a/scripts/screener/screener.config.js b/scripts/screener/screener.config.js index ee63d4dea9ec77..8025ca95e966ea 100644 --- a/scripts/screener/screener.config.js +++ b/scripts/screener/screener.config.js @@ -1,6 +1,8 @@ require('../babel/register'); const cp = require('child_process'); +const path = require('path'); +const { workspaceRoot } = require('../monorepo'); function getCurrentHash() { try { @@ -20,12 +22,10 @@ function getCurrentHash() { return ''; } -const config = require('../config').default; - -const { compilerOptions } = require(config.paths.docs('tsconfig.json')); +const { compilerOptions } = require(path.resolve(workspaceRoot, 'packages/fluentui/docs/tsconfig.json')); require('tsconfig-paths').register({ - baseUrl: config.path_base, + baseUrl: workspaceRoot, paths: compilerOptions.paths, }); diff --git a/scripts/utils/index.d.ts b/scripts/utils/index.d.ts new file mode 100644 index 00000000000000..997092ddf0f410 --- /dev/null +++ b/scripts/utils/index.d.ts @@ -0,0 +1,4 @@ +export { findConfig } from './find-config'; +export { writeConfig } from './write-config'; +export { readConfig } from './read-config'; +export { sh } from './sh'; diff --git a/scripts/utils/index.js b/scripts/utils/index.js index e7b3c9c74b80af..ce17f3855fc271 100644 --- a/scripts/utils/index.js +++ b/scripts/utils/index.js @@ -2,4 +2,5 @@ module.exports = { ...require('./find-config'), ...require('./read-config'), ...require('./write-config'), + ...require('./sh'), }; diff --git a/scripts/gulp/sh.ts b/scripts/utils/sh.js similarity index 64% rename from scripts/gulp/sh.ts rename to scripts/utils/sh.js index 9accf0d296f4d5..899cc3b8d0235e 100644 --- a/scripts/gulp/sh.ts +++ b/scripts/utils/sh.js @@ -1,10 +1,18 @@ -import * as childProcess from 'child_process'; - -const sh = (command: string, cwd?: string, pipeOutputToResult: boolean = false): Promise => +const childProcess = require('child_process'); + +/** + * + * @param {string} command + * @param {string=} cwd + * @param {boolean} pipeOutputToResult + * @returns {Promise} + */ +const sh = (command, cwd, pipeOutputToResult = false) => new Promise((resolve, reject) => { const [cmd, ...args] = command.split(' '); - const options: childProcess.SpawnOptions = { + /** @type {import('child_process').SpawnOptions} */ + const options = { cwd: cwd || process.cwd(), env: process.env, stdio: pipeOutputToResult ? 'pipe' : 'inherit', @@ -30,4 +38,4 @@ const sh = (command: string, cwd?: string, pipeOutputToResult: boolean = false): }); }); -export default sh; +exports.sh = sh; diff --git a/scripts/webpack/webpack-resources.js b/scripts/webpack/webpack-resources.js index 79451d435de394..3b5b5fb64f76bd 100644 --- a/scripts/webpack/webpack-resources.js +++ b/scripts/webpack/webpack-resources.js @@ -13,11 +13,9 @@ const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin'); const webpackVersion = /** @type {string} */ (require('webpack/package.json').version); const merge = require('../tasks/merge'); -const { findGitRoot } = require('../monorepo'); +const { getDefaultEnvironmentVars, findGitRoot } = require('../monorepo'); const getResolveAlias = require('./getResolveAlias'); -const getDefaultEnvironmentVars = require('./getDefaultEnvironmentVars'); - console.log(`Webpack version: ${webpackVersion}`); const gitRoot = findGitRoot(); From ad0754a053271e243ace9957e08e597252736e6b Mon Sep 17 00:00:00 2001 From: Martin Hochel Date: Tue, 29 Nov 2022 19:06:09 +0100 Subject: [PATCH 2/2] refactor(project-tests): use generateFiles to unify and simplify test setup --- .../projects-test/assets/cra/{ => src}/App.tsx | 0 .../projects-test/assets/nextjs/{ => pages}/index.js | 0 packages/fluentui/projects-test/src/createReactApp.ts | 4 ++-- packages/fluentui/projects-test/src/nextjs.ts | 5 ++--- packages/fluentui/projects-test/src/rollup.ts | 10 +++------- 5 files changed, 7 insertions(+), 12 deletions(-) rename packages/fluentui/projects-test/assets/cra/{ => src}/App.tsx (100%) rename packages/fluentui/projects-test/assets/nextjs/{ => pages}/index.js (100%) diff --git a/packages/fluentui/projects-test/assets/cra/App.tsx b/packages/fluentui/projects-test/assets/cra/src/App.tsx similarity index 100% rename from packages/fluentui/projects-test/assets/cra/App.tsx rename to packages/fluentui/projects-test/assets/cra/src/App.tsx diff --git a/packages/fluentui/projects-test/assets/nextjs/index.js b/packages/fluentui/projects-test/assets/nextjs/pages/index.js similarity index 100% rename from packages/fluentui/projects-test/assets/nextjs/index.js rename to packages/fluentui/projects-test/assets/nextjs/pages/index.js diff --git a/packages/fluentui/projects-test/src/createReactApp.ts b/packages/fluentui/projects-test/src/createReactApp.ts index 31ca74cc177a87..ce71367fbc26de 100644 --- a/packages/fluentui/projects-test/src/createReactApp.ts +++ b/packages/fluentui/projects-test/src/createReactApp.ts @@ -1,4 +1,3 @@ -import fs from 'fs-extra'; import path from 'path'; import { @@ -10,6 +9,7 @@ import { performBrowserTest, prepareCreateReactApp, workspaceRoot, + generateFiles, } from '@fluentui/scripts/projects-test'; /** @@ -41,7 +41,7 @@ export async function createReactApp() { logger(`✔️ Fluent UI packages were added to dependencies`); logger("STEP 3. Reference Fluent UI components in test project's App.tsx"); - fs.copyFileSync(path.resolve(scaffoldPathRoot, 'App.tsx'), path.resolve(testAppPathRoot, 'src', 'App.tsx')); + generateFiles(scaffoldPathRoot, testAppPathRoot); logger('STEP 4. Build test project..'); await shEcho(`yarn build`, testAppPathRoot); diff --git a/packages/fluentui/projects-test/src/nextjs.ts b/packages/fluentui/projects-test/src/nextjs.ts index d64c078dbf6828..be5e2dcd92d908 100644 --- a/packages/fluentui/projects-test/src/nextjs.ts +++ b/packages/fluentui/projects-test/src/nextjs.ts @@ -1,4 +1,3 @@ -import fs from 'fs-extra'; import path from 'path'; import { @@ -9,6 +8,7 @@ import { shEcho, performBrowserTest, workspaceRoot, + generateFiles, } from '@fluentui/scripts/projects-test'; export async function nextjs() { @@ -32,8 +32,7 @@ export async function nextjs() { logger(`✔️ Fluent UI packages were added to dependencies`); logger('STEP 3. Copy scaffold files to test project'); - fs.mkdirSync(path.resolve(tempPaths.testApp, 'pages')); - fs.copyFileSync(path.resolve(scaffoldPathRoot, 'index.js'), path.resolve(tempPaths.testApp, 'pages', 'index.js')); + generateFiles(scaffoldPathRoot, tempPaths.testApp); logger(`✔️ Source and bundler's config were created`); logger('STEP 4. Build test project'); diff --git a/packages/fluentui/projects-test/src/rollup.ts b/packages/fluentui/projects-test/src/rollup.ts index 7fdf100ac038f1..5de4fa42dd3945 100644 --- a/packages/fluentui/projects-test/src/rollup.ts +++ b/packages/fluentui/projects-test/src/rollup.ts @@ -1,4 +1,3 @@ -import fs from 'fs-extra'; import path from 'path'; import { @@ -9,6 +8,7 @@ import { log, shEcho, workspaceRoot, + generateFiles, } from '@fluentui/scripts/projects-test'; export async function rollup() { @@ -43,12 +43,8 @@ export async function rollup() { logger(`✔️ Fluent UI packages were added to dependencies`); logger('STEP 3. Copy scaffold files to test project'); - fs.copyFileSync(path.resolve(scaffoldPathRoot, 'app.js'), path.resolve(tempPaths.testApp, 'app.js')); - fs.copyFileSync( - path.resolve(scaffoldPathRoot, 'rollup.config.js'), - path.resolve(tempPaths.testApp, 'rollup.config.js'), - ); - fs.copyFileSync(path.resolve(scaffoldPathRoot, 'index.html'), path.resolve(tempPaths.testApp, 'index.html')); + generateFiles(scaffoldPathRoot, tempPaths.testApp); + logger(`✔️ Source and bundler's config were created`); logger('STEP 4. Build test project');