chore: bumps version of esbuild-loader to v3.2.0

change/@fluentui-react-tree-bd477d26-b715-40ab-958c-bf2c1fbc5ab9.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "chore: adds tsconfig.cy.json file to root of the package",
+  "packageName": "@fluentui/react-tree",
+  "email": "bernardo.sunderhus@gmail.com",
+  "dependentChangeType": "none"
+}

package.json

@@ -227,7 +227,7 @@
     "enzyme": "3.10.0",
     "enzyme-to-json": "3.6.2",
     "esbuild": "0.14.51",
-    "esbuild-loader": "2.20.0",
+    "esbuild-loader": "3.2.0",
     "eslint": "7.25.0",
     "eslint-config-airbnb": "18.2.1",
     "eslint-config-prettier": "8.3.0",

packages/react-components/react-tree/tsconfig.cy.json

@@ -0,0 +1,8 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "isolatedModules": false,
+    "types": ["node", "cypress", "cypress-storybook/cypress", "cypress-real-events"]
+  },
+  "include": ["**/*.cy.ts", "**/*.cy.tsx"]
+}

packages/react-examples/package.json

@@ -13,7 +13,9 @@
     "clean": "just-scripts clean",
     "code-style": "just-scripts code-style",
     "just": "just-scripts",
-    "lint": "just-scripts lint"
+    "lint": "just-scripts lint",
+    "e2e": "cypress run --component",
+    "e2e:local": "cypress open --component"
   },
   "devDependencies": {
     "@fluentui/eslint-plugin": "*",

packages/react-examples/tsconfig.cy.json

@@ -0,0 +1,9 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "isolatedModules": false,
+    "types": ["node", "cypress", "cypress-storybook/cypress", "cypress-real-events"],
+    "lib": ["ES2019", "dom"]
+  },
+  "include": ["src/**/*.cy.ts", "src/**/*.cy.tsx"]
+}

scripts/cypress/src/base.config.ts

@@ -1,9 +1,6 @@
-import * as fs from 'fs';
 import * as path from 'path';
 
 import { defineConfig } from 'cypress';
-import * as jju from 'jju';
-import TsconfigPathsPlugin from 'tsconfig-paths-webpack-plugin';
 import type { Configuration } from 'webpack';
 
 /**
@@ -25,24 +22,12 @@ export const baseWebpackConfig: Configuration = {
 };
 
 const cypressWebpackConfig = (): Configuration => {
-  // For v9, use tsconfig paths and esbuild-loader
-  const tsConfigBasePath = path.resolve(__dirname, '../../../tsconfig.base.json');
-
-  const tsConfigBase = jju.parse(fs.readFileSync(tsConfigBasePath).toString());
-  const tsPaths = new TsconfigPathsPlugin({
-    configFile: tsConfigBasePath,
-  });
-
-  if (baseWebpackConfig.resolve) {
-    baseWebpackConfig.resolve.plugins = [tsPaths];
-  }
   if (baseWebpackConfig.module) {
     baseWebpackConfig.module.rules?.push({
       test: /\.(ts|tsx)$/,
       loader: 'esbuild-loader',
       options: {
-        loader: 'tsx',
-        target: tsConfigBase.compilerOptions.target,
+        tsconfig: './tsconfig.cy.json',
       },
     });
   }