From f69737e7d077be1f7f8bb53c80b786dd77809120 Mon Sep 17 00:00:00 2001 From: Marija Najdova Date: Mon, 7 Jun 2021 19:16:11 +0200 Subject: [PATCH 1/3] ts fixes --- .../src/SliderUnstyled/SliderUnstyled.d.ts | 23 ++++++++++++------- 1 file changed, 15 insertions(+), 8 deletions(-) diff --git a/packages/material-ui-unstyled/src/SliderUnstyled/SliderUnstyled.d.ts b/packages/material-ui-unstyled/src/SliderUnstyled/SliderUnstyled.d.ts index 0ff2be2f4971f6..172b665f395112 100644 --- a/packages/material-ui-unstyled/src/SliderUnstyled/SliderUnstyled.d.ts +++ b/packages/material-ui-unstyled/src/SliderUnstyled/SliderUnstyled.d.ts @@ -1,6 +1,8 @@ import { OverridableComponent, OverridableTypeMap, OverrideProps } from '@material-ui/types'; import { SliderUnstyledClasses } from './sliderUnstyledClasses'; +export interface SliderStylePropsOverrides {} + export interface Mark { value: number; label?: React.ReactNode; @@ -51,38 +53,43 @@ export interface SliderUnstyledTypeMap

; + as?: React.ElementType; + styleProps?: Omit['props'], 'components' | 'componentsProps'> & + SliderStylePropsOverrides; }; track?: { as?: React.ElementType; - styleProps?: Omit['props'], 'components' | 'componentsProps'>; + styleProps?: Omit['props'], 'components' | 'componentsProps'> & + SliderStylePropsOverrides; }; rail?: { as?: React.ElementType; - styleProps?: Omit['props'], 'components' | 'componentsProps'>; + styleProps?: Omit['props'], 'components' | 'componentsProps'> & + SliderStylePropsOverrides; }; thumb?: { as?: React.ElementType; - styleProps?: Omit['props'], 'components' | 'componentsProps'>; + styleProps?: Omit['props'], 'components' | 'componentsProps'> & + SliderStylePropsOverrides; }; mark?: { as?: React.ElementType; styleProps?: Omit< SliderUnstyledTypeMap['props'], 'components' | 'componentsProps' - > & { markActive?: boolean }; + > & { markActive?: boolean } & SliderStylePropsOverrides; }; markLabel?: { as?: React.ElementType; styleProps?: Omit< SliderUnstyledTypeMap['props'], 'components' | 'componentsProps' - > & { markLabelActive?: boolean }; + > & { markLabelActive?: boolean } & SliderStylePropsOverrides; }; valueLabel?: { as?: React.ElementType; - styleProps?: Omit['props'], 'components' | 'componentsProps'>; + styleProps?: Omit['props'], 'components' | 'componentsProps'> & + SliderStylePropsOverrides; }; }; /** From f4f93d2b8775b64d625e4c8f06d01879e9b03564 Mon Sep 17 00:00:00 2001 From: Marija Najdova Date: Tue, 8 Jun 2021 12:08:53 +0200 Subject: [PATCH 2/3] add module augmentation tests for unstyled --- .circleci/config.yml | 4 +- packages/material-ui-unstyled/package.json | 3 +- .../scripts/testModuleAugmentation.js | 65 +++++++++++++++++++ .../sliderStyleProps.spec.tsx | 13 ++++ .../sliderStyleProps.tsconfig.json | 4 ++ 5 files changed, 87 insertions(+), 2 deletions(-) create mode 100644 packages/material-ui-unstyled/scripts/testModuleAugmentation.js create mode 100644 packages/material-ui-unstyled/test/typescript/moduleAugmentation/sliderStyleProps.spec.tsx create mode 100644 packages/material-ui-unstyled/test/typescript/moduleAugmentation/sliderStyleProps.tsconfig.json diff --git a/.circleci/config.yml b/.circleci/config.yml index 059b8a81b40fff..972aacc53ba916 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -242,7 +242,9 @@ jobs: command: yarn typescript:ci - run: name: Test module augmenation - command: yarn workspace @material-ui/core typescript:module-augmentation + command: | + yarn workspace @material-ui/core typescript:module-augmentation + yarn workspace @material-ui/unstyled typescript:module-augmentation - restore_cache: name: Restore generated declaration files diff --git a/packages/material-ui-unstyled/package.json b/packages/material-ui-unstyled/package.json index 1fb8d8b5902314..ae2709874bfafb 100644 --- a/packages/material-ui-unstyled/package.json +++ b/packages/material-ui-unstyled/package.json @@ -33,7 +33,8 @@ "prebuild": "rimraf build tsconfig.build.tsbuildinfo", "release": "yarn build && npm publish build --tag next", "test": "cd ../../ && cross-env NODE_ENV=test mocha 'packages/material-ui-unstyled/**/*.test.{js,ts,tsx}'", - "typescript": "tslint -p tsconfig.json \"{src,test}/**/*.{spec,d}.{ts,tsx}\" && tsc -p tsconfig.json" + "typescript": "tslint -p tsconfig.json \"{src,test}/**/*.{spec,d}.{ts,tsx}\" && tsc -p tsconfig.json", + "typescript:module-augmentation": "node scripts/testModuleAugmentation.js" }, "peerDependencies": { "@types/react": "^16.8.6 || ^17.0.0", diff --git a/packages/material-ui-unstyled/scripts/testModuleAugmentation.js b/packages/material-ui-unstyled/scripts/testModuleAugmentation.js new file mode 100644 index 00000000000000..10b722335cd22b --- /dev/null +++ b/packages/material-ui-unstyled/scripts/testModuleAugmentation.js @@ -0,0 +1,65 @@ +const childProcess = require('child_process'); +const { chunk } = require('lodash'); +const glob = require('fast-glob'); +const path = require('path'); +const { promisify } = require('util'); + +const exec = promisify(childProcess.exec); +const packageRoot = path.resolve(__dirname, '../'); + +async function test(tsconfigPath) { + try { + await exec(['yarn', 'tsc', '--project', tsconfigPath].join(' '), { cwd: packageRoot }); + } catch (error) { + if (error.stdout !== undefined) { + // `exec` error + throw new Error(`exit code ${error.code}: ${error.stdout}`); + } + // Unknown error + throw error; + } +} + +/** + * Tests various module augmentation scenarios. + * We can't run them with a single `tsc` run since these apply globally. + * Running them all would mean they're not isolated. + * Each test case represents a section in our docs. + * + * We're not using mocha since mocha is used for runtime tests. + * This script also allows us to test in parallel which we can't do with our mocha tests. + */ +async function main() { + const tsconfigPaths = await glob('test/typescript/moduleAugmentation/*.tsconfig.json', { + absolute: true, + cwd: packageRoot, + }); + // Need to process in chunks or we might run out-of-memory + // approximate yarn lerna --concurrency 7 + const tsconfigPathsChunks = chunk(tsconfigPaths, 7); + + // eslint-disable-next-line no-restricted-syntax + for await (const tsconfigPathsChunk of tsconfigPathsChunks) { + await Promise.all( + tsconfigPathsChunk.map(async (tsconfigPath) => { + await test(tsconfigPath).then( + () => { + // eslint-disable-next-line no-console -- test runner feedback + console.log(`PASS ${path.relative(process.cwd(), tsconfigPath)}`); + }, + (error) => { + // don't bail but log the error + console.error(`FAIL ${path.relative(process.cwd(), tsconfigPath)}\n ${error}`); + // and mark the test as failed + process.exitCode = 1; + }, + ); + }), + ); + } +} + +main().catch((error) => { + console.error(error); + process.exit(1); +}); diff --git a/packages/material-ui-unstyled/test/typescript/moduleAugmentation/sliderStyleProps.spec.tsx b/packages/material-ui-unstyled/test/typescript/moduleAugmentation/sliderStyleProps.spec.tsx new file mode 100644 index 00000000000000..4dad017b0c33e5 --- /dev/null +++ b/packages/material-ui-unstyled/test/typescript/moduleAugmentation/sliderStyleProps.spec.tsx @@ -0,0 +1,13 @@ +import * as React from 'react'; +import { SliderUnstyled } from '@material-ui/unstyled'; + +declare module '@material-ui/unstyled' { + interface SliderStylePropsOverrides { + color?: 'primary' | 'secondary'; + } +} + +; + +// @ts-expect-error unknown color +; diff --git a/packages/material-ui-unstyled/test/typescript/moduleAugmentation/sliderStyleProps.tsconfig.json b/packages/material-ui-unstyled/test/typescript/moduleAugmentation/sliderStyleProps.tsconfig.json new file mode 100644 index 00000000000000..7bb7753751e245 --- /dev/null +++ b/packages/material-ui-unstyled/test/typescript/moduleAugmentation/sliderStyleProps.tsconfig.json @@ -0,0 +1,4 @@ +{ + "extends": "../../../../../tsconfig", + "files": ["sliderStyleProps.spec.tsx"] +} From 4a786307b7e83d0aa69e2bc8d37328b443f6c1af Mon Sep 17 00:00:00 2001 From: Marija Najdova Date: Tue, 8 Jun 2021 12:14:08 +0200 Subject: [PATCH 3/3] prettier --- .../typescript/moduleAugmentation/sliderStyleProps.spec.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/material-ui-unstyled/test/typescript/moduleAugmentation/sliderStyleProps.spec.tsx b/packages/material-ui-unstyled/test/typescript/moduleAugmentation/sliderStyleProps.spec.tsx index 4dad017b0c33e5..0baf23e743d3e7 100644 --- a/packages/material-ui-unstyled/test/typescript/moduleAugmentation/sliderStyleProps.spec.tsx +++ b/packages/material-ui-unstyled/test/typescript/moduleAugmentation/sliderStyleProps.spec.tsx @@ -7,7 +7,7 @@ declare module '@material-ui/unstyled' { } } -; +; // @ts-expect-error unknown color -; +;