From a7df17ed104e212bbe4f880d8c3f6dcddbb1b736 Mon Sep 17 00:00:00 2001 From: Martin Hochel Date: Tue, 25 Apr 2023 15:10:34 +0200 Subject: [PATCH 1/5] chore(v0): emit dts only for v0 which uses babel for transpilation --- packages/fluentui/e2e/tsconfig.json | 5 +++-- packages/fluentui/perf/tsconfig.json | 1 + packages/fluentui/projects-test/tsconfig.json | 3 +-- packages/fluentui/react-northstar/tsconfig.json | 1 - tsconfig.base.v0.json | 1 + 5 files changed, 6 insertions(+), 5 deletions(-) diff --git a/packages/fluentui/e2e/tsconfig.json b/packages/fluentui/e2e/tsconfig.json index a343a32b4060d..62bb069602de1 100644 --- a/packages/fluentui/e2e/tsconfig.json +++ b/packages/fluentui/e2e/tsconfig.json @@ -3,9 +3,10 @@ "compilerOptions": { "allowSyntheticDefaultImports": true, "isolatedModules": false, + "noEmit": true, + "emitDeclarationOnly": false, "module": "esnext", - "types": ["node", "webpack-env", "cypress", "cypress-real-events"], - "skipLibCheck": true + "types": ["node", "webpack-env", "cypress", "cypress-real-events"] }, "include": ["."] } diff --git a/packages/fluentui/perf/tsconfig.json b/packages/fluentui/perf/tsconfig.json index b6b2b56975a4d..cbbf13b831240 100644 --- a/packages/fluentui/perf/tsconfig.json +++ b/packages/fluentui/perf/tsconfig.json @@ -2,6 +2,7 @@ "extends": "../../../tsconfig.base.v0.json", "compilerOptions": { "noEmit": true, + "emitDeclarationOnly": false, "module": "esnext", "types": ["node", "webpack-env"] }, diff --git a/packages/fluentui/projects-test/tsconfig.json b/packages/fluentui/projects-test/tsconfig.json index 36a27e87aad4a..5ada62d3057c3 100644 --- a/packages/fluentui/projects-test/tsconfig.json +++ b/packages/fluentui/projects-test/tsconfig.json @@ -4,9 +4,8 @@ "allowSyntheticDefaultImports": true, "module": "esnext", "types": ["node"], - "skipLibCheck": true, "outDir": "dist/dts", - "noEmit": true, + "emitDeclarationOnly": false, "composite": true }, "include": ["src"], diff --git a/packages/fluentui/react-northstar/tsconfig.json b/packages/fluentui/react-northstar/tsconfig.json index 2859e3b14d8e8..e16b7d45bf27a 100644 --- a/packages/fluentui/react-northstar/tsconfig.json +++ b/packages/fluentui/react-northstar/tsconfig.json @@ -3,7 +3,6 @@ "compilerOptions": { "composite": true, "outDir": "dist/dts", - "skipLibCheck": true, "types": ["node", "jest", "@testing-library/jest-dom"], "paths": { "docs/*": ["packages/fluentui/docs/*"], diff --git a/tsconfig.base.v0.json b/tsconfig.base.v0.json index ad82302a2bfa0..42209b9a2a6e8 100644 --- a/tsconfig.base.v0.json +++ b/tsconfig.base.v0.json @@ -7,6 +7,7 @@ "jsx": "react", "isolatedModules": true, "moduleResolution": "node", + "emitDeclarationOnly": true, "pretty": true, "allowJs": false, "noImplicitReturns": true, From 49370edc9fea848011e83a3e2c459bd58dcb6dc7 Mon Sep 17 00:00:00 2001 From: Martin Hochel Date: Tue, 25 Apr 2023 17:32:14 +0200 Subject: [PATCH 2/5] test(react-norhtstar): use new conformance api to narrow down ts program to speed up tests --- .../fluentui/react-northstar/jest.config.js | 18 +++++++++++++++--- .../commonTests/extraConformanceTests.tsx | 2 +- .../test/specs/commonTests/isConformant.tsx | 3 ++- .../fluentui/react-northstar/tsconfig.json | 4 +--- .../react-northstar/tsconfig.spec.json | 14 ++++++++++++++ 5 files changed, 33 insertions(+), 8 deletions(-) create mode 100644 packages/fluentui/react-northstar/tsconfig.spec.json diff --git a/packages/fluentui/react-northstar/jest.config.js b/packages/fluentui/react-northstar/jest.config.js index 627d34cdebc3a..58083ac69d28b 100644 --- a/packages/fluentui/react-northstar/jest.config.js +++ b/packages/fluentui/react-northstar/jest.config.js @@ -1,13 +1,25 @@ +const path = require('path'); +const fs = require('fs'); +const { workspaceRoot } = require('@nrwl/devkit'); +const { pathsToModuleNameMapper } = require('ts-jest'); const { createV0Config: commonConfig } = require('@fluentui/scripts-jest'); const config = commonConfig({ - name: 'react', + displayName: 'react-northstar', moduleNameMapper: { // Legacy aliases, they should not be used in new tests - '^src/(.*)$': `/src/$1`, - 'test/(.*)$': `/test/$1`, + ...getAliases(), }, }); config.setupFilesAfterEnv = [...config.setupFilesAfterEnv, './jest-setup.js']; module.exports = config; + +function getAliases() { + const tsConfig = JSON.parse(fs.readFileSync(path.join(__dirname, 'tsconfig.spec.json'))); + const tsPathAliases = pathsToModuleNameMapper(tsConfig.compilerOptions.paths, { + prefix: `/${path.relative(__dirname, workspaceRoot)}/`, + }); + + return tsPathAliases; +} diff --git a/packages/fluentui/react-northstar/test/specs/commonTests/extraConformanceTests.tsx b/packages/fluentui/react-northstar/test/specs/commonTests/extraConformanceTests.tsx index e4a72f5930ff4..d8ce93d18f195 100644 --- a/packages/fluentui/react-northstar/test/specs/commonTests/extraConformanceTests.tsx +++ b/packages/fluentui/react-northstar/test/specs/commonTests/extraConformanceTests.tsx @@ -1,6 +1,6 @@ import * as _ from 'lodash'; import * as path from 'path'; -import { TestObject } from '@fluentui/react-conformance'; +import type { TestObject } from '@fluentui/react-conformance'; import * as doctrine from 'doctrine'; diff --git a/packages/fluentui/react-northstar/test/specs/commonTests/isConformant.tsx b/packages/fluentui/react-northstar/test/specs/commonTests/isConformant.tsx index 01f829bea9ae2..0966bd2232c75 100644 --- a/packages/fluentui/react-northstar/test/specs/commonTests/isConformant.tsx +++ b/packages/fluentui/react-northstar/test/specs/commonTests/isConformant.tsx @@ -22,7 +22,7 @@ import * as FluentUI from 'src/index'; import { getEventTargetComponent, EVENT_TARGET_ATTRIBUTE } from './eventTarget'; import { extraConformanceTests } from './extraConformanceTests'; -export interface Conformant +interface Conformant extends Pick, 'disabledTests' | 'testOptions' | 'getTargetElement'> { /** Path to the test file. */ testPath: string; @@ -75,6 +75,7 @@ export function isConformant( } = options; const defaultConfig: IsConformantOptions = { + tsConfig: { configName: 'tsconfig.spec.json' }, renderOptions: { wrapper: EmptyThemeProvider }, componentPath: testPath .replace(/test[/\\]specs/, 'src') diff --git a/packages/fluentui/react-northstar/tsconfig.json b/packages/fluentui/react-northstar/tsconfig.json index e16b7d45bf27a..f22addcb1f6e4 100644 --- a/packages/fluentui/react-northstar/tsconfig.json +++ b/packages/fluentui/react-northstar/tsconfig.json @@ -5,10 +5,8 @@ "outDir": "dist/dts", "types": ["node", "jest", "@testing-library/jest-dom"], "paths": { - "docs/*": ["packages/fluentui/docs/*"], "src/*": ["packages/fluentui/react-northstar/src/*"], - "test/*": ["packages/fluentui/react-northstar/test/*"], - "@fluentui/a11y-testing": ["packages/a11y-testing/src/index"] + "test/*": ["packages/fluentui/react-northstar/test/*"] } }, "include": ["src", "test"], diff --git a/packages/fluentui/react-northstar/tsconfig.spec.json b/packages/fluentui/react-northstar/tsconfig.spec.json new file mode 100644 index 0000000000000..487c22c774b4d --- /dev/null +++ b/packages/fluentui/react-northstar/tsconfig.spec.json @@ -0,0 +1,14 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "noEmit": true, + "emitDeclarationOnly": false, + "composite": false, + "types": ["node", "jest", "@testing-library/jest-dom"], + "paths": { + "src/*": ["packages/fluentui/react-northstar/src/*"], + "test/*": ["packages/fluentui/react-northstar/test/*"] + } + }, + "include": ["test"] +} From 0c406a7af0bb5e3f914d5048dbb9eb568ca61402 Mon Sep 17 00:00:00 2001 From: Martin Hochel Date: Wed, 26 Apr 2023 09:54:57 +0200 Subject: [PATCH 3/5] feat(scripts-jest): clear and restore mocks automatically to prevent accidental test leaks --- scripts/jest/src/jest.preset.v0.js | 2 ++ scripts/jest/src/v0/setupTests.js | 9 +-------- 2 files changed, 3 insertions(+), 8 deletions(-) diff --git a/scripts/jest/src/jest.preset.v0.js b/scripts/jest/src/jest.preset.v0.js index 4d6aff1732032..778fcdccc10f8 100644 --- a/scripts/jest/src/jest.preset.v0.js +++ b/scripts/jest/src/jest.preset.v0.js @@ -16,6 +16,8 @@ const createConfig = (/** @type {import('@jest/types').Config.InitialOptions} */ verbose: false, watchPlugins: ['jest-watch-typeahead/filename', 'jest-watch-typeahead/testname'], testEnvironment: 'jsdom', + restoreMocks: true, + clearMocks: true, ...customConfig, moduleNameMapper: { ...getLernaAliases({ diff --git a/scripts/jest/src/v0/setupTests.js b/scripts/jest/src/v0/setupTests.js index 3704debf781f3..8dff4a7691bf0 100644 --- a/scripts/jest/src/v0/setupTests.js +++ b/scripts/jest/src/v0/setupTests.js @@ -3,8 +3,8 @@ * This is the bootstrap code that is run before any tests, utils, mocks. */ -const enzyme = require('enzyme'); const Adapter = require('@wojtekmaj/enzyme-adapter-react-17'); +const enzyme = require('enzyme'); enzyme.configure({ adapter: new Adapter(), @@ -16,11 +16,4 @@ if (process.env.TF_BUILD) { jest.spyOn(console, 'info'); jest.spyOn(console, 'warn'); jest.spyOn(console, 'error'); - - afterAll(() => { - expect(console.log).not.toHaveBeenCalled(); - expect(console.info).not.toHaveBeenCalled(); - expect(console.warn).not.toHaveBeenCalled(); - expect(console.error).not.toHaveBeenCalled(); - }); } From 5913b9929c305bbc9b74e577edc3be5f0c0ed37f Mon Sep 17 00:00:00 2001 From: Martin Hochel Date: Wed, 26 Apr 2023 09:55:35 +0200 Subject: [PATCH 4/5] test(react-northstar): scope fake timers usage --- .../test/specs/components/Carousel/Carousel-test.tsx | 4 ++-- .../test/specs/components/Dropdown/Dropdown-test.tsx | 3 ++- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/packages/fluentui/react-northstar/test/specs/components/Carousel/Carousel-test.tsx b/packages/fluentui/react-northstar/test/specs/components/Carousel/Carousel-test.tsx index 152ae0917ddad..6804f49ffeffe 100644 --- a/packages/fluentui/react-northstar/test/specs/components/Carousel/Carousel-test.tsx +++ b/packages/fluentui/react-northstar/test/specs/components/Carousel/Carousel-test.tsx @@ -60,8 +60,6 @@ const getNavigationNavigationItemAtIndexWrapper = (wrapper: ReactWrapper, index: findIntrinsicElement(wrapper, `.${carouselNavigationItemClassName}`).at(index); const getButtonWrapper = (wrapper: ReactWrapper): CommonWrapper => findIntrinsicElement(wrapper, `#${buttonName}`); -jest.useFakeTimers(); - describe('Carousel', () => { isConformant(Carousel, { testPath: __filename, @@ -244,6 +242,8 @@ describe('Carousel', () => { items: items.map(item => ({ key: item.key, icon: { name: 'icon-circle' } })), }; + jest.useFakeTimers(); + afterEach(() => { jest.runAllTimers(); }); diff --git a/packages/fluentui/react-northstar/test/specs/components/Dropdown/Dropdown-test.tsx b/packages/fluentui/react-northstar/test/specs/components/Dropdown/Dropdown-test.tsx index acc8fd6916110..e8921f5f42e15 100644 --- a/packages/fluentui/react-northstar/test/specs/components/Dropdown/Dropdown-test.tsx +++ b/packages/fluentui/react-northstar/test/specs/components/Dropdown/Dropdown-test.tsx @@ -12,7 +12,6 @@ import { ShorthandValue } from 'src/types'; import { List } from 'src/components/List/List'; jest.dontMock('@fluentui/keyboard-key'); -jest.useFakeTimers(); describe('Dropdown', () => { isConformant(Dropdown, { @@ -327,6 +326,7 @@ describe('Dropdown', () => { }); describe('highlightedIndex', () => { + jest.useFakeTimers(); afterEach(() => { act(() => { jest.runAllTimers(); @@ -1292,6 +1292,7 @@ describe('Dropdown', () => { }); describe('getA11ySelectionMessage', () => { + jest.useFakeTimers(); afterEach(() => { jest.runAllTimers(); }); From 24a87edef04c5f016067a40aedc6f5ecbda71bc6 Mon Sep 17 00:00:00 2001 From: Martin Hochel Date: Thu, 27 Apr 2023 17:03:31 +0200 Subject: [PATCH 5/5] fixup! feat(scripts-jest): clear and restore mocks automatically to prevent accidental test leaks --- scripts/jest/src/v0/setupTests.js | 7 ------- 1 file changed, 7 deletions(-) diff --git a/scripts/jest/src/v0/setupTests.js b/scripts/jest/src/v0/setupTests.js index 8dff4a7691bf0..e400bd47cf1cc 100644 --- a/scripts/jest/src/v0/setupTests.js +++ b/scripts/jest/src/v0/setupTests.js @@ -10,10 +10,3 @@ enzyme.configure({ adapter: new Adapter(), disableLifecycleMethods: true, }); - -if (process.env.TF_BUILD) { - jest.spyOn(console, 'log'); - jest.spyOn(console, 'info'); - jest.spyOn(console, 'warn'); - jest.spyOn(console, 'error'); -}