chore: run migration for @fluentui/make-styles (#20742)

* chore: run migration for @fluentui/make-styles

* Change files

* move serializer to common

* remove unused eslint-disable

* add common to "testFiles"

* Change files

change/@fluentui-eslint-plugin-fb1325fb-f708-4cb5-b687-ddee1a1353a5.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "handle `common` directory as test files",
+  "packageName": "@fluentui/eslint-plugin",
+  "email": "[email protected]",
+  "dependentChangeType": "none"
+}

change/@fluentui-make-styles-37e74f24-6d91-44b3-90fd-7f125afcb606.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "update tooling config",
+  "packageName": "@fluentui/make-styles",
+  "email": "[email protected]",
+  "dependentChangeType": "none"
+}

packages/eslint-plugin/src/utils/configHelpers.js

@@ -7,7 +7,7 @@ const jju = require('jju');
 const testFiles = [
   '**/*{.,-}test.{ts,tsx}',
   '**/*.stories.tsx',
-  '**/{test,tests,stories}/**',
+  '**/{common,test,tests,stories}/**',
   '**/testUtilities.{ts,tsx}',
   '**/common/isConformant.{ts,tsx}',
 ];

packages/make-styles/.npmignore

@@ -1,4 +1,3 @@
-.cache/
 .storybook/
 .vscode/
 bundle-size/

packages/make-styles/config/api-extractor.local.json

@@ -1,5 +1,5 @@
 {
   "$schema": "https://developer.microsoft.com/json-schemas/api-extractor/v7/api-extractor.schema.json",
   "extends": "./api-extractor.json",
-  "mainEntryPointFilePath": "<projectFolder>/dist/index.d.ts"
+  "mainEntryPointFilePath": "<projectFolder>/dist/packages/<unscopedPackageName>/src/index.d.ts"
 }

packages/make-styles/config/tests.js

@@ -0,0 +1 @@
+/** Jest test setup file. */

packages/make-styles/jest.config.js

@@ -8,12 +8,13 @@ module.exports = {
   preset: '../../jest.preset.js',
   globals: {
     'ts-jest': {
-      tsConfig: '<rootDir>/tsconfig.json',
+      tsConfig: '<rootDir>/tsconfig.spec.json',
       diagnostics: false,
     },
   },
   transform: {
     '^.+\\.tsx?$': 'ts-jest',
   },
   coverageDirectory: './coverage',
+  setupFilesAfterEnv: ['./config/tests.js'],
 };

packages/make-styles/package.json

@@ -19,7 +19,8 @@
     "lint": "just-scripts lint",
     "test": "jest",
     "docs": "api-extractor run --config=config/api-extractor.local.json --local",
-    "build:local": "tsc -p . --module esnext --emitDeclarationOnly && node ../../scripts/typescript/normalize-import --output dist/ && yarn docs"
+    "build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../scripts/typescript/normalize-import --output ./dist/packages/make-styles/src && yarn docs",
+    "type-check": "tsc -b tsconfig.json"
   },
   "devDependencies": {
     "@fluentui/eslint-plugin": "*",

packages/make-styles/src/utils/test/snapshotSerializer.ts → packages/make-styles/src/common/snapshotSerializers.ts

@@ -1,7 +1,7 @@
 import * as prettier from 'prettier';
 
-import { resolveStyleRules } from '../../runtime/resolveStyleRules';
-import { MakeStylesRenderer, CSSRulesByBucket, StyleBucketName } from '../../types';
+import { resolveStyleRules } from '../runtime/resolveStyleRules';
+import { MakeStylesRenderer, CSSRulesByBucket, StyleBucketName } from '../types';
 
 export const makeStylesRendererSerializer: jest.SnapshotSerializerPlugin = {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any

packages/make-styles/src/makeStaticStyles.test.ts

@@ -1,5 +1,5 @@
 import { createDOMRenderer } from './renderer/createDOMRenderer';
-import { makeStylesRendererSerializer } from './utils/test/snapshotSerializer';
+import { makeStylesRendererSerializer } from './common/snapshotSerializers';
 import { makeStaticStyles } from './makeStaticStyles';
 import { makeStyles } from './makeStyles';
 import { MakeStylesRenderer } from './types';

packages/make-styles/src/makeStyles.test.ts

@@ -1,5 +1,5 @@
 import { createDOMRenderer } from './renderer/createDOMRenderer';
-import { makeStylesRendererSerializer } from './utils/test/snapshotSerializer';
+import { makeStylesRendererSerializer } from './common/snapshotSerializers';
 import { makeStyles } from './makeStyles';
 import { MakeStylesRenderer } from './types';
 

packages/make-styles/src/renderer/rehydrateRendererCache.ts

@@ -2,7 +2,6 @@ import { MakeStylesRenderer, StyleBucketName } from '../types';
 
 // Regexps to extract names of classes and animations
 // https://github.com/styletron/styletron/blob/e0fcae826744eb00ce679ac613a1b10d44256660/packages/styletron-engine-atomic/src/client/client.js#L8
-// eslint-disable-next-line @fluentui/max-len
 const KEYFRAMES_HYDRATOR = /@(-webkit-)?keyframes ([^{]+){((?:(?:from|to|(?:\d+\.?\d*%))\{(?:[^}])*})*)}/g;
 const AT_RULES_HYDRATOR = /@(media|supports)[^{]+\{([\s\S]+?})\s*}/g;
 const STYLES_HYDRATOR = /\.([^{:]+)(:[^{]+)?{(?:[^}]*;)?([^}]*?)}/g;

packages/make-styles/src/runtime/resolveStyleRules.test.ts

@@ -1,4 +1,4 @@
-import { makeStylesRulesSerializer } from '../utils/test/snapshotSerializer';
+import { makeStylesRulesSerializer } from '../common/snapshotSerializers';
 import { resolveStyleRules } from './resolveStyleRules';
 import { CSSClassesMap, CSSClasses, CSSRulesByBucket } from '../types';
 

packages/make-styles/tsconfig.json

@@ -1,17 +1,22 @@
 {
   "extends": "../../tsconfig.base.json",
-  "include": ["src"],
   "compilerOptions": {
-    "target": "ES5",
-    "module": "CommonJS",
-    "lib": ["ES2015", "dom"],
-    "outDir": "dist",
-    "jsx": "react",
-    "declaration": true,
-    "experimentalDecorators": true,
+    "target": "ES2019",
+    "noEmit": true,
+    "isolatedModules": true,
     "importHelpers": true,
+    "jsx": "react",
     "noUnusedLocals": true,
-    "preserveConstEnums": true,
-    "types": ["jest", "custom-global", "inline-style-expand-shorthand"]
-  }
+    "preserveConstEnums": true
+  },
+  "include": [],
+  "files": [],
+  "references": [
+    {
+      "path": "./tsconfig.lib.json"
+    },
+    {
+      "path": "./tsconfig.spec.json"
+    }
+  ]
 }

packages/make-styles/tsconfig.lib.json

@@ -0,0 +1,20 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "noEmit": false,
+    "lib": ["ES2019", "dom"],
+    "outDir": "dist",
+    "declaration": true,
+    "types": ["static-assets", "environment", "inline-style-expand-shorthand"]
+  },
+  "exclude": [
+    "./src/common/**.ts",
+    "**/*.spec.ts",
+    "**/*.spec.tsx",
+    "**/*.test.ts",
+    "**/*.test.tsx",
+    "**/*.stories.ts",
+    "**/*.stories.tsx"
+  ],
+  "include": ["./src/**/*.ts", "./src/**/*.tsx"]
+}

packages/make-styles/tsconfig.spec.json

@@ -0,0 +1,9 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "module": "CommonJS",
+    "outDir": "dist",
+    "types": ["jest", "node", "inline-style-expand-shorthand"]
+  },
+  "include": ["./src/common/**.ts", "**/*.spec.ts", "**/*.spec.tsx", "**/*.test.ts", "**/*.test.tsx", "**/*.d.ts"]
+}