From afa63f2fd9a9c6ecd6158d6bb384db4a50f3fc97 Mon Sep 17 00:00:00 2001 From: Martin Hochel Date: Wed, 14 Jun 2023 12:23:13 +0200 Subject: [PATCH 1/6] fix(scripts-tasks): disable api-extractor custom path aliases usage which causes invalid api.md and .d.ts rollup generation --- scripts/tasks/src/utils.spec.ts | 7 +++++-- scripts/tasks/src/utils.ts | 21 ++++++++++++++------- 2 files changed, 19 insertions(+), 9 deletions(-) diff --git a/scripts/tasks/src/utils.spec.ts b/scripts/tasks/src/utils.spec.ts index 56e35def7e6576..84489ea9a4f4b7 100644 --- a/scripts/tasks/src/utils.spec.ts +++ b/scripts/tasks/src/utils.spec.ts @@ -43,10 +43,13 @@ describe(`utils`, () => { definitionsRootPath: 'dist/for/types', }); - expect(actual.overrideTsconfig.compilerOptions).toEqual(expect.objectContaining({ paths: undefined })); + expect(actual.overrideTsconfig.compilerOptions).toEqual( + expect.objectContaining({ paths: undefined, baseUrl: '.' }), + ); }); - it(`should override path aliases to emitted declaration files instead of source files`, () => { + // This is not used unless api-extractor resolves resolving workspace d.ts packages - see https://github.com/microsoft/rushstack/pull/3321, https://github.com/microsoft/rushstack/pull/3339 + it.skip(`should override path aliases to emitted declaration files instead of source files`, () => { const actual = setup({ definitionsRootPath: 'dist/for/types', pathAliasesTsConfigPath: path.join(workspaceRoot, 'tsconfig.base.json'), diff --git a/scripts/tasks/src/utils.ts b/scripts/tasks/src/utils.ts index dca9655a309602..c1af3d56e6b296 100644 --- a/scripts/tasks/src/utils.ts +++ b/scripts/tasks/src/utils.ts @@ -108,6 +108,8 @@ function enableAllowSyntheticDefaultImports(options: { pkgJson: PackageJson }) { return shouldEnable ? { allowSyntheticDefaultImports: true } : null; } +// eslint-disable-next-line @typescript-eslint/ban-ts-comment +// @ts-ignore - 💡 NOTE: this is not used unless api-extractor resolves resolving workspace d.ts packages - see https://github.com/microsoft/rushstack/pull/3321, https://github.com/microsoft/rushstack/pull/3339 function createNormalizedTsPaths(options: { definitionsRootPath: string; pathAliasesTsConfigPath: string }) { type PathAliases = Record; const { definitionsRootPath, pathAliasesTsConfigPath } = options; @@ -132,14 +134,16 @@ export function getTsPathAliasesApiExtractorConfig(options: { definitionsRootPath: string; pathAliasesTsConfigPath?: string; }) { - const { packageJson, tsConfig, pathAliasesTsConfigPath, definitionsRootPath } = options; + const { packageJson, tsConfig /* , pathAliasesTsConfigPath, definitionsRootPath */ } = options; /** * Because api-extractor ran into race conditions when executing via lage (https://github.com/microsoft/fluentui/issues/25766), * we won't use path aliases on CI, rather serving api-extractor rolluped dts files cross package, that will be referenced via yarn workspace sym-links + * + * 💡 NOTE: this is not used unless api-extractor resolves resolving workspace d.ts packages - see https://github.com/microsoft/rushstack/pull/3321, https://github.com/microsoft/rushstack/pull/3339 */ - const normalizedPaths = pathAliasesTsConfigPath - ? createNormalizedTsPaths({ definitionsRootPath, pathAliasesTsConfigPath }) - : undefined; + // const normalizedPaths = pathAliasesTsConfigPath + // ? createNormalizedTsPaths({ definitionsRootPath, pathAliasesTsConfigPath }) + // : undefined; /** * Customized TSConfig that uses `tsconfig.lib.json` as base with some required overrides: @@ -166,10 +170,13 @@ export function getTsPathAliasesApiExtractorConfig(options: { */ skipLibCheck: false, /** - * just-scripts provides invalid types for tsconfig, thus `paths` cannot be set to dictionary,nor null or `{}` + * api-extractor introduced a "feature" which is actually a bug and makes using path aliases impossible + * - with this api extractor change user is forced to rely on yarn/npm "workspace" symlinks in order to determine that inner workspace package should not be bundled in type definition rollup/api.md + * - see https://github.com/microsoft/rushstack/pull/3321, https://github.com/microsoft/rushstack/pull/3339 + * */ - // @ts-expect-error - just-scripts provides invalid types - paths: normalizedPaths, + paths: undefined, + baseUrl: '.', }, }; From 06c7dbcca22dac454a03d7132ec95152ddd89d1d Mon Sep 17 00:00:00 2001 From: Martin Hochel Date: Wed, 14 Jun 2023 12:54:43 +0200 Subject: [PATCH 2/6] chore: add generate-api task definition to lage config --- lage.config.js | 1 + 1 file changed, 1 insertion(+) diff --git a/lage.config.js b/lage.config.js index 77ac03ddcbefa3..0459542313df59 100644 --- a/lage.config.js +++ b/lage.config.js @@ -9,6 +9,7 @@ module.exports = { lint: ['build'], clean: [], test: ['build'], + 'generate-api': ['^generate-api'], 'test-ssr': [], 'type-check': ['build'], 'code-style': [], From 0a8a96fa740e10375cc3d0eb302285010e77b15b Mon Sep 17 00:00:00 2001 From: Martin Hochel Date: Wed, 14 Jun 2023 13:24:27 +0200 Subject: [PATCH 3/6] feat(react-conformance): migrate package to v9 setup in order to be able to run generate-api task without build --- packages/react-conformance/.npmignore | 61 ++++++++------- packages/react-conformance/.swcrc | 30 ++++++++ .../config/api-extractor.json | 5 ++ packages/react-conformance/config/tests.js | 1 + .../etc/react-conformance.api.md | 75 +++++++++++++++++++ packages/react-conformance/jest.config.js | 27 ++++++- packages/react-conformance/just.config.ts | 2 +- packages/react-conformance/package.json | 14 +++- .../src/utils/errorMessages.ts | 2 +- packages/react-conformance/tsconfig.json | 30 ++++---- packages/react-conformance/tsconfig.lib.json | 15 ++++ packages/react-conformance/tsconfig.spec.json | 9 +++ workspace.json | 3 +- 13 files changed, 222 insertions(+), 52 deletions(-) create mode 100644 packages/react-conformance/.swcrc create mode 100644 packages/react-conformance/config/api-extractor.json create mode 100644 packages/react-conformance/config/tests.js create mode 100644 packages/react-conformance/etc/react-conformance.api.md create mode 100644 packages/react-conformance/tsconfig.lib.json create mode 100644 packages/react-conformance/tsconfig.spec.json diff --git a/packages/react-conformance/.npmignore b/packages/react-conformance/.npmignore index 24337b6c973e82..72e2ecf6190162 100644 --- a/packages/react-conformance/.npmignore +++ b/packages/react-conformance/.npmignore @@ -1,34 +1,37 @@ +.storybook/ +.vscode/ +bundle-size/ +config/ +coverage/ +docs/ +etc/ +node_modules/ +src/ +stories/ +dist/types/ +temp/ +__fixtures__ +__mocks__ +__tests__ + *.api.json -*.config.js *.log -*.nuspec +*.spec.* +*.cy.* *.test.* *.yml + +# config files +*config.* +*rc.* .editorconfig -.eslintrc* -.eslintcache -.gitattributes -.gitignore -.vscode -coverage -dist/storybook -dist/*.stats.html -dist/*.stats.json -dist/demo -fabric-test* -gulpfile.js -images -index.html -jsconfig.json -node_modules -results -src/**/* -!src/**/examples/*.tsx -!src/**/docs/**/*.md -!src/**/*.types.ts -temp -tsconfig.json -tsd.json -tslint.json -typings -visualtests +.eslint* +.git* +.prettierignore +.swcrc + +# exclude gitignore patterns explicitly +!lib +!lib-commonjs +!lib-amd +!dist/*.d.ts diff --git a/packages/react-conformance/.swcrc b/packages/react-conformance/.swcrc new file mode 100644 index 00000000000000..b4ffa86dee3067 --- /dev/null +++ b/packages/react-conformance/.swcrc @@ -0,0 +1,30 @@ +{ + "$schema": "https://json.schemastore.org/swcrc", + "exclude": [ + "/testing", + "/**/*.cy.ts", + "/**/*.cy.tsx", + "/**/*.spec.ts", + "/**/*.spec.tsx", + "/**/*.test.ts", + "/**/*.test.tsx" + ], + "jsc": { + "parser": { + "syntax": "typescript", + "tsx": true, + "decorators": false, + "dynamicImport": false + }, + "externalHelpers": true, + "transform": { + "react": { + "runtime": "classic", + "useSpread": true + } + }, + "target": "es2019" + }, + "minify": false, + "sourceMaps": true +} diff --git a/packages/react-conformance/config/api-extractor.json b/packages/react-conformance/config/api-extractor.json new file mode 100644 index 00000000000000..89ba391e079eca --- /dev/null +++ b/packages/react-conformance/config/api-extractor.json @@ -0,0 +1,5 @@ +{ + "$schema": "https://developer.microsoft.com/json-schemas/api-extractor/v7/api-extractor.schema.json", + "extends": "@fluentui/scripts-api-extractor/api-extractor.common.v-next.json", + "mainEntryPointFilePath": "/../../dist/out-tsc/types/packages//src/index.d.ts" +} diff --git a/packages/react-conformance/config/tests.js b/packages/react-conformance/config/tests.js new file mode 100644 index 00000000000000..2e211ae9e21420 --- /dev/null +++ b/packages/react-conformance/config/tests.js @@ -0,0 +1 @@ +/** Jest test setup file. */ diff --git a/packages/react-conformance/etc/react-conformance.api.md b/packages/react-conformance/etc/react-conformance.api.md new file mode 100644 index 00000000000000..7f841f59461b7f --- /dev/null +++ b/packages/react-conformance/etc/react-conformance.api.md @@ -0,0 +1,75 @@ +## API Report File for "@fluentui/react-conformance" + +> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/). + +```ts + +import { ComponentDoc } from 'react-docgen-typescript'; +import * as React_2 from 'react'; +import { render } from '@testing-library/react'; +import * as ts from 'typescript'; + +// @public (undocumented) +export type ConformanceTest = (componentInfo: ComponentDoc, testInfo: IsConformantOptions, tsProgram: ts.Program) => void; + +// @public (undocumented) +export function isConformant(...testInfo: Partial>[]): void; + +// @public (undocumented) +export interface IsConformantOptions { + Component: React_2.ComponentType; + componentPath: string; + disabledTests?: string[]; + displayName: string; + elementRefName?: string; + extraTests?: TestObject; + getTargetElement?: (renderResult: ReturnType, attr: keyof React_2.AllHTMLAttributes | 'ref' | `data-${string}`) => HTMLElement; + isInternal?: boolean; + primarySlot?: keyof TProps | 'root'; + renderOptions?: Parameters[1]; + requiredProps?: Partial; + testOptions?: TestOptions; + tsConfig?: Partial<{ + configName: string; + configDir: string; + }>; + // @deprecated (undocumented) + tsconfigDir?: string; + useDefaultExport?: boolean; +} + +// @public (undocumented) +export interface TestObject { + // (undocumented) + [key: string]: ConformanceTest; +} + +// @public +export interface TestOptions { + // (undocumented) + 'component-has-static-classname'?: { + prefix?: string; + }; + // (undocumented) + 'consistent-callback-args'?: { + ignoreProps?: string[]; + }; + // (undocumented) + 'consistent-callback-names'?: { + ignoreProps?: string[]; + }; + // (undocumented) + 'has-static-classnames'?: { + props: { + [key: string]: string | {}; + }; + expectedClassNames?: { + [key: string]: string; + }; + getPortalElement?: (renderResult: ReturnType) => HTMLElement; + }[]; +} + +// (No @packageDocumentation comment for this package) + +``` diff --git a/packages/react-conformance/jest.config.js b/packages/react-conformance/jest.config.js index b5c1d19b022227..aadd2d62cecfe8 100644 --- a/packages/react-conformance/jest.config.js +++ b/packages/react-conformance/jest.config.js @@ -1,5 +1,26 @@ -const { createV8Config: createConfig } = require('@fluentui/scripts-jest'); +// const { createV8Config: createConfig } = require('@fluentui/scripts-jest'); -const config = createConfig({}); +// const config = createConfig({}); -module.exports = config; +// module.exports = config; + +// @ts-check + +/** + * @type {import('@jest/types').Config.InitialOptions} + */ +module.exports = { + displayName: 'react-conformance', + preset: '../../jest.preset.js', + globals: { + 'ts-jest': { + tsconfig: '/tsconfig.spec.json', + isolatedModules: true, + }, + }, + transform: { + '^.+\\.tsx?$': 'ts-jest', + }, + coverageDirectory: './coverage', + setupFilesAfterEnv: ['./config/tests.js'], +}; diff --git a/packages/react-conformance/just.config.ts b/packages/react-conformance/just.config.ts index 242d94f1f02109..b7b2c9a33bf435 100644 --- a/packages/react-conformance/just.config.ts +++ b/packages/react-conformance/just.config.ts @@ -2,4 +2,4 @@ import { preset, task } from '@fluentui/scripts-tasks'; preset(); -task('build', 'build:node-lib').cached!(); +task('build', 'build:react-components').cached?.(); diff --git a/packages/react-conformance/package.json b/packages/react-conformance/package.json index 6291197e04e93a..001cab5736d4a2 100644 --- a/packages/react-conformance/package.json +++ b/packages/react-conformance/package.json @@ -3,7 +3,7 @@ "version": "0.16.3", "description": "Customizable conformance testing utility for Fluent UI React components.", "main": "lib-commonjs/index.js", - "typings": "lib-commonjs/index.d.ts", + "typings": "dist/index.d.ts", "repository": { "type": "git", "url": "https://github.com/microsoft/fluentui" @@ -15,7 +15,9 @@ "code-style": "just-scripts code-style", "just": "just-scripts", "test": "just-scripts test", - "lint": "just-scripts lint" + "lint": "just-scripts lint", + "generate-api": "just-scripts generate-api", + "type-check": "just-scripts type-check" }, "devDependencies": { "@fluentui/eslint-plugin": "*", @@ -37,5 +39,13 @@ "react": ">=16.8.0 <19.0.0", "react-dom": ">=16.8.0 <19.0.0", "typescript": "^4.3.0" + }, + "exports": { + ".": { + "types": "./dist/index.d.ts", + "node": "./lib-commonjs/index.js", + "require": "./lib-commonjs/index.js" + }, + "./package.json": "./package.json" } } diff --git a/packages/react-conformance/src/utils/errorMessages.ts b/packages/react-conformance/src/utils/errorMessages.ts index b38360a613d272..2614884df2a2a7 100644 --- a/packages/react-conformance/src/utils/errorMessages.ts +++ b/packages/react-conformance/src/utils/errorMessages.ts @@ -1,4 +1,4 @@ -import chalk from 'chalk'; +import * as chalk from 'chalk'; import { EOL } from 'os'; /** Console message colors used in the test. */ diff --git a/packages/react-conformance/tsconfig.json b/packages/react-conformance/tsconfig.json index 08e77d03e1277a..228b07034cea4c 100644 --- a/packages/react-conformance/tsconfig.json +++ b/packages/react-conformance/tsconfig.json @@ -1,22 +1,22 @@ { + "extends": "../../tsconfig.base.json", "compilerOptions": { - "baseUrl": ".", - "outDir": "lib", - "target": "es6", - "module": "commonjs", + "target": "ES2019", + "noEmit": true, "jsx": "react", - "declaration": true, - "sourceMap": true, - "experimentalDecorators": true, + "isolatedModules": true, "importHelpers": true, - "noUnusedLocals": true, - "forceConsistentCasingInFileNames": true, - "strict": true, - "moduleResolution": "node", "preserveConstEnums": true, - "isolatedModules": true, - "lib": ["es2017", "dom"], - "types": ["jest", "node"] + "noUnusedLocals": true }, - "include": ["src"] + "include": [], + "files": [], + "references": [ + { + "path": "./tsconfig.lib.json" + }, + { + "path": "./tsconfig.spec.json" + } + ] } diff --git a/packages/react-conformance/tsconfig.lib.json b/packages/react-conformance/tsconfig.lib.json new file mode 100644 index 00000000000000..29882306a14298 --- /dev/null +++ b/packages/react-conformance/tsconfig.lib.json @@ -0,0 +1,15 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "noEmit": false, + "lib": ["DOM", "ES2019"], + "declaration": true, + "declarationDir": "../../dist/out-tsc/types", + "outDir": "../../dist/out-tsc", + "inlineSources": true, + "types": ["static-assets", "environment", "jest", "node"], + "module": "CommonJS" + }, + "exclude": ["**/*.spec.ts", "**/*.spec.tsx", "**/*.test.ts", "**/*.test.tsx"], + "include": ["./src/**/*.ts", "./src/**/*.tsx"] +} diff --git a/packages/react-conformance/tsconfig.spec.json b/packages/react-conformance/tsconfig.spec.json new file mode 100644 index 00000000000000..469fcba4d7ba75 --- /dev/null +++ b/packages/react-conformance/tsconfig.spec.json @@ -0,0 +1,9 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "module": "CommonJS", + "outDir": "dist", + "types": ["jest", "node"] + }, + "include": ["**/*.spec.ts", "**/*.spec.tsx", "**/*.test.ts", "**/*.test.tsx", "**/*.d.ts"] +} diff --git a/workspace.json b/workspace.json index 40ae5268834d29..6012a19ee57f6a 100644 --- a/workspace.json +++ b/workspace.json @@ -418,8 +418,9 @@ "@fluentui/react-conformance": { "root": "packages/react-conformance", "projectType": "library", + "sourceRoot": "packages/react-conformance-griffel/src", "implicitDependencies": [], - "tags": ["v8", "platform:node"] + "tags": ["vNext", "platform:node"] }, "@fluentui/react-conformance-griffel": { "root": "packages/react-components/react-conformance-griffel", From 2f7efa36fb928a72b8f27c470d7d6627e399caaf Mon Sep 17 00:00:00 2001 From: Martin Hochel Date: Wed, 14 Jun 2023 13:56:35 +0200 Subject: [PATCH 4/6] fixup! feat(react-conformance): migrate package to v9 setup in order to be able to run generate-api task without build --- packages/react-conformance/src/utils/errorMessages.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-conformance/src/utils/errorMessages.ts b/packages/react-conformance/src/utils/errorMessages.ts index 2614884df2a2a7..b38360a613d272 100644 --- a/packages/react-conformance/src/utils/errorMessages.ts +++ b/packages/react-conformance/src/utils/errorMessages.ts @@ -1,4 +1,4 @@ -import * as chalk from 'chalk'; +import chalk from 'chalk'; import { EOL } from 'os'; /** Console message colors used in the test. */ From 46462bae4b217e7d99a7c9aa07ac368bf2e5ac57 Mon Sep 17 00:00:00 2001 From: Martin Hochel Date: Wed, 14 Jun 2023 13:59:47 +0200 Subject: [PATCH 5/6] generate changefile --- ...t-conformance-35e35a06-cb99-40ac-9617-72e443ec3109.json | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 change/@fluentui-react-conformance-35e35a06-cb99-40ac-9617-72e443ec3109.json diff --git a/change/@fluentui-react-conformance-35e35a06-cb99-40ac-9617-72e443ec3109.json b/change/@fluentui-react-conformance-35e35a06-cb99-40ac-9617-72e443ec3109.json new file mode 100644 index 00000000000000..bd30968a595e58 --- /dev/null +++ b/change/@fluentui-react-conformance-35e35a06-cb99-40ac-9617-72e443ec3109.json @@ -0,0 +1,7 @@ +{ + "type": "minor", + "comment": "BREAKING CHANGE: migrate package to v9 setup in order to be able to run generate-api task without build", + "packageName": "@fluentui/react-conformance", + "email": "martinhochel@microsoft.com", + "dependentChangeType": "patch" +} From 609724311d7df0f3fa1994e1970bb088769028d7 Mon Sep 17 00:00:00 2001 From: Martin Hochel Date: Thu, 15 Jun 2023 19:09:55 +0200 Subject: [PATCH 6/6] chore: fix typos --- packages/react-conformance/jest.config.js | 6 ------ workspace.json | 2 +- 2 files changed, 1 insertion(+), 7 deletions(-) diff --git a/packages/react-conformance/jest.config.js b/packages/react-conformance/jest.config.js index aadd2d62cecfe8..101261e61a4efe 100644 --- a/packages/react-conformance/jest.config.js +++ b/packages/react-conformance/jest.config.js @@ -1,9 +1,3 @@ -// const { createV8Config: createConfig } = require('@fluentui/scripts-jest'); - -// const config = createConfig({}); - -// module.exports = config; - // @ts-check /** diff --git a/workspace.json b/workspace.json index 6012a19ee57f6a..8aa630b8799ea8 100644 --- a/workspace.json +++ b/workspace.json @@ -418,7 +418,7 @@ "@fluentui/react-conformance": { "root": "packages/react-conformance", "projectType": "library", - "sourceRoot": "packages/react-conformance-griffel/src", + "sourceRoot": "packages/react-conformance/src", "implicitDependencies": [], "tags": ["vNext", "platform:node"] },