feat: add vscode extension

xiejay97 · xiejay97 · commit 34501ecaf019 · 2022-08-19T20:35:30.000+08:00
diff --git a/.vscode/extensions.json b/.vscode/extensions.json
@@ -4,6 +4,7 @@
     "esbenp.prettier-vscode",
     "firsttris.vscode-jest-runner",
     "dbaeumer.vscode-eslint",
-    "stylelint.vscode-stylelint"
+    "stylelint.vscode-stylelint",
+    "xiejay97.react-devui"
   ]
 }
diff --git a/jest.config.js b/jest.config.js
diff --git a/jest.config.ts b/jest.config.ts
@@ -0,0 +1,5 @@
+import { getJestProjects } from '@nrwl/jest';
+
+export default {
+  projects: getJestProjects(),
+};
diff --git a/jest.preset.js b/jest.preset.js
@@ -1,3 +1,3 @@
-const nxPreset = require('@nrwl/jest/preset');
+const nxPreset = require('@nrwl/jest/preset').default;
 
 module.exports = { ...nxPreset };
diff --git a/jest.setup.js b/jest.setup.js
diff --git a/package.json b/package.json
@@ -61,20 +61,21 @@
     "@nrwl/tao": "14.5.6",
     "@nrwl/web": "14.5.6",
     "@nrwl/workspace": "14.5.6",
-    "@testing-library/jest-dom": "^5.16.5",
-    "@testing-library/react": "13.3.0",
-    "@testing-library/react-hooks": "^8.0.1",
+    "@testing-library/react": "^13.3.0",
     "@types/fs-extra": "^9.0.13",
-    "@types/jest": "^28.1.6",
+    "@types/glob": "^7.2.0",
+    "@types/jest": "^27.4.1",
     "@types/lodash": "^4.14.182",
     "@types/marked": "^4.0.3",
+    "@types/mocha": "^9.1.1",
     "@types/node": "^18.7.3",
     "@types/react": "^18.0.17",
     "@types/react-dom": "^18.0.6",
+    "@types/vscode": "^1.70.0",
     "@typescript-eslint/eslint-plugin": "^5.33.0",
     "@typescript-eslint/parser": "^5.33.0",
-    "babel-jest": "^28.1.3",
-    "dotenv": "^16.0.1",
+    "@vscode/test-electron": "^2.1.5",
+    "babel-jest": "^27.5.1",
     "eslint": "^8.22.0",
     "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-import": "^2.26.0",
@@ -86,9 +87,12 @@
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-tsdoc": "^0.2.16",
     "fs-extra": "^10.1.0",
+    "glob": "^8.0.3",
     "husky": "^8.0.1",
-    "jest": "^28.1.3",
+    "jest": "^27.5.1",
     "lerna": "^5.4.2",
+    "mocha": "^10.0.0",
+    "nx": "14.5.6",
     "postcss-html": "^1.5.0",
     "postcss-markdown": "^1.2.0",
     "prettier": "^2.7.1",
@@ -101,7 +105,7 @@
     "stylelint-config-recommended-scss": "^7.0.0",
     "stylelint-config-standard": "^27.0.0",
     "stylelint-scss": "^4.3.0",
-    "ts-jest": "^28.0.8",
+    "ts-jest": "^27.1.4",
     "ts-node": "^10.9.1",
     "typescript": "~4.7.4",
     "yaml-front-matter": "^4.1.1"
diff --git a/packages/hooks/jest.config.ts b/packages/hooks/jest.config.ts
@@ -6,5 +6,4 @@ export default {
   },
   moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
   coverageDirectory: '../../coverage/packages/hooks',
-  setupFilesAfterEnv: ['../../jest.setup.js'],
 };
diff --git a/packages/hooks/project.json b/packages/hooks/project.json
@@ -43,9 +43,7 @@
       "outputs": ["coverage/packages/hooks"],
       "options": {
         "jestConfig": "packages/hooks/jest.config.ts",
-        "passWithNoTests": true,
-        "codeCoverage": true,
-        "coverageReporters": ["clover", "json", "lcov", "text"]
+        "passWithNoTests": true
       }
     }
   }
diff --git a/packages/hooks/tsconfig.spec.json b/packages/hooks/tsconfig.spec.json
@@ -3,7 +3,7 @@
   "compilerOptions": {
     "outDir": "../../dist/out-tsc",
     "module": "commonjs",
-    "types": ["jest", "node", "@testing-library/jest-dom"]
+    "types": ["jest", "node"]
   },
   "include": [
     "jest.config.ts",
diff --git a/packages/icons/jest.config.ts b/packages/icons/jest.config.ts
@@ -5,6 +5,6 @@ export default {
     '^.+\\.[tj]sx?$': 'babel-jest',
   },
   moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
+  collectCoverageFrom: ['!./dist/**'],
   coverageDirectory: '../../coverage/packages/icons',
-  setupFilesAfterEnv: ['../../jest.setup.js'],
 };
diff --git a/packages/icons/project.json b/packages/icons/project.json
@@ -43,9 +43,7 @@
       "outputs": ["coverage/packages/icons"],
       "options": {
         "jestConfig": "packages/icons/jest.config.ts",
-        "passWithNoTests": true,
-        "codeCoverage": true,
-        "coverageReporters": ["clover", "json", "lcov", "text"]
+        "passWithNoTests": true
       }
     }
   }
diff --git a/packages/icons/tsconfig.spec.json b/packages/icons/tsconfig.spec.json
@@ -3,7 +3,7 @@
   "compilerOptions": {
     "outDir": "../../dist/out-tsc",
     "module": "commonjs",
-    "types": ["jest", "node", "@testing-library/jest-dom"]
+    "types": ["jest", "node"]
   },
   "include": [
     "jest.config.ts",
diff --git a/packages/site/jest.config.ts b/packages/site/jest.config.ts
@@ -7,5 +7,4 @@ export default {
   },
   moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
   coverageDirectory: '../../coverage/packages/site',
-  setupFilesAfterEnv: ['../../jest.setup.js'],
 };
diff --git a/packages/site/project.json b/packages/site/project.json
@@ -92,9 +92,7 @@
       "outputs": ["coverage/packages/site"],
       "options": {
         "jestConfig": "packages/site/jest.config.ts",
-        "passWithNoTests": true,
-        "codeCoverage": true,
-        "coverageReporters": ["clover", "json", "lcov", "text"]
+        "passWithNoTests": true
       }
     }
   }
diff --git a/packages/site/tsconfig.spec.json b/packages/site/tsconfig.spec.json
@@ -3,7 +3,7 @@
   "compilerOptions": {
     "outDir": "../../dist/out-tsc",
     "module": "commonjs",
-    "types": ["jest", "node", "@testing-library/jest-dom"]
+    "types": ["jest", "node"]
   },
   "files": ["../../node_modules/@nrwl/react/typings/cssmodule.d.ts", "../../node_modules/@nrwl/react/typings/image.d.ts"],
   "include": [
diff --git a/packages/ui/__tests__/config.ts b/packages/ui/__tests__/config.ts
diff --git a/packages/ui/__tests__/index.ts b/packages/ui/__tests__/index.ts
diff --git a/packages/ui/components/button/Button.spec.tsx b/packages/ui/components/button/Button.spec.tsx
@@ -0,0 +1,26 @@
+import type { DButtonProps } from './Button';
+import type { RenderResult } from '@testing-library/react';
+
+import { render } from '@testing-library/react';
+
+import { PREFIX } from '../../__tests__';
+import { DButton } from './Button';
+
+describe('DButton', () => {
+  let buttonRender: (props: DButtonProps) => RenderResult;
+  let buttonEl: HTMLElement;
+
+  beforeEach(() => {
+    buttonRender = (props) => {
+      const renderResult = render(<DButton data-testid="button" {...props} />);
+      buttonEl = renderResult.getByTestId('button');
+      return renderResult;
+    };
+  });
+
+  it('should `dType` work', () => {
+    const type = 'secondary';
+    buttonRender({ dType: type });
+    expect(buttonEl.classList.contains(`${PREFIX}button--${type}`)).toBeTruthy();
+  });
+});
diff --git a/packages/ui/components/index.ts b/packages/ui/components/index.ts
@@ -10,7 +10,7 @@ export { DAlert } from './alert';
 export type { DAnchorProps } from './anchor';
 export { DAnchor } from './anchor';
 
-export type { DAutoCompleteProps } from './auto-complete';
+export { DAutoCompleteProps } from './auto-complete';
 export { DAutoComplete } from './auto-complete';
 
 export type { DAvatarProps } from './avatar';
diff --git a/packages/ui/jest.config.ts b/packages/ui/jest.config.ts
@@ -5,6 +5,8 @@ export default {
     '^.+\\.[tj]sx?$': 'babel-jest',
   },
   moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
+  collectCoverage: true,
+  collectCoverageFrom: ['./components/**'],
+  coverageReporters: ['clover', 'json', 'lcov', 'text'],
   coverageDirectory: '../../coverage/packages/ui',
-  setupFilesAfterEnv: ['../../jest.setup.js'],
 };
diff --git a/packages/ui/project.json b/packages/ui/project.json
@@ -48,9 +48,7 @@
       "outputs": ["coverage/packages/ui"],
       "options": {
         "jestConfig": "packages/ui/jest.config.ts",
-        "passWithNoTests": true,
-        "codeCoverage": true,
-        "coverageReporters": ["clover", "json", "lcov", "text"]
+        "passWithNoTests": true
       }
     }
   }
diff --git a/packages/ui/tsconfig.lib.json b/packages/ui/tsconfig.lib.json
@@ -8,7 +8,6 @@
   "files": ["../../node_modules/@nrwl/react/typings/cssmodule.d.ts", "../../node_modules/@nrwl/react/typings/image.d.ts"],
   "exclude": [
     "jest.config.ts",
-    "src/tests/**",
     "**/*.spec.ts",
     "**/*.test.ts",
     "**/*.spec.tsx",
diff --git a/packages/ui/tsconfig.spec.json b/packages/ui/tsconfig.spec.json
@@ -3,7 +3,7 @@
   "compilerOptions": {
     "outDir": "../../dist/out-tsc",
     "module": "commonjs",
-    "types": ["jest", "node", "@testing-library/jest-dom"]
+    "types": ["jest", "node"]
   },
   "include": [
     "jest.config.ts",
diff --git a/packages/utils/jest.config.ts b/packages/utils/jest.config.ts
@@ -6,5 +6,4 @@ export default {
   },
   moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
   coverageDirectory: '../../coverage/packages/utils',
-  setupFilesAfterEnv: ['../../jest.setup.js'],
 };
diff --git a/packages/utils/project.json b/packages/utils/project.json
@@ -43,9 +43,7 @@
       "outputs": ["coverage/packages/utils"],
       "options": {
         "jestConfig": "packages/utils/jest.config.ts",
-        "passWithNoTests": true,
-        "codeCoverage": true,
-        "coverageReporters": ["clover", "json", "lcov", "text"]
+        "passWithNoTests": true
       }
     }
   }
diff --git a/packages/utils/tsconfig.spec.json b/packages/utils/tsconfig.spec.json
@@ -3,7 +3,7 @@
   "compilerOptions": {
     "outDir": "../../dist/out-tsc",
     "module": "commonjs",
-    "types": ["jest", "node", "@testing-library/jest-dom"]
+    "types": ["jest", "node"]
   },
   "include": [
     "jest.config.ts",
diff --git a/packages/vscode-extension/.babelrc b/packages/vscode-extension/.babelrc
@@ -0,0 +1,10 @@
+{
+  "presets": [
+    [
+      "@nrwl/web/babel",
+      {
+        "useBuiltIns": "usage"
+      }
+    ]
+  ]
+}
diff --git a/packages/vscode-extension/.eslintrc.json b/packages/vscode-extension/.eslintrc.json
@@ -0,0 +1,18 @@
+{
+  "extends": ["../../.eslintrc.json"],
+  "ignorePatterns": ["!**/*"],
+  "overrides": [
+    {
+      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.ts", "*.tsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.js", "*.jsx"],
+      "rules": {}
+    }
+  ]
+}
diff --git a/packages/vscode-extension/.vscodeignore b/packages/vscode-extension/.vscodeignore
@@ -0,0 +1,10 @@
+.vscode/**
+.vscode-test/**
+src/**
+.gitignore
+.yarnrc
+vsc-extension-quickstart.md
+**/tsconfig.json
+**/.eslintrc.json
+**/*.map
+**/*.ts
diff --git a/packages/vscode-extension/CHANGELOG.md b/packages/vscode-extension/CHANGELOG.md
@@ -0,0 +1,9 @@
+# Change Log
+
+All notable changes to the "react-devui" extension will be documented in this file.
+
+Check [Keep a Changelog](http://keepachangelog.com/) for recommendations on how to structure this file.
+
+## [Unreleased]
+
+- Initial release
diff --git a/packages/vscode-extension/README.md b/packages/vscode-extension/README.md
@@ -0,0 +1,3 @@
+# React DevUI
+
+This is the extension for React DevUI development.
diff --git a/packages/vscode-extension/extension.ts b/packages/vscode-extension/extension.ts
@@ -0,0 +1,30 @@
+import * as vscode from 'vscode';
+
+import { createTerminal, getJestConfigPath } from './utils';
+
+export function activate(context: vscode.ExtensionContext) {
+  console.log('Congratulations, your extension "react-devui" is now active!');
+
+  const disposables = [
+    vscode.commands.registerCommand('run_jest', (uri) => {
+      const [jestConfigPath, folderPath] = getJestConfigPath(uri.path);
+      const terminal = createTerminal('react-devui:jest');
+      terminal.sendText(
+        String.raw`yarn jest "${uri.path}" --config='${jestConfigPath}' --collectCoverageFrom='[".${folderPath.replace(
+          /\.test\.|\.spec\./,
+          '.'
+        )}"]'`
+      );
+    }),
+    vscode.commands.registerCommand('run_jest_folder', (uri) => {
+      const [jestConfigPath, folderPath] = getJestConfigPath(uri.path);
+      const terminal = createTerminal('react-devui:jest');
+      terminal.sendText(String.raw`yarn jest "${uri.path}" --config='${jestConfigPath}' --collectCoverageFrom='[".${folderPath}/**"]'`);
+    }),
+  ];
+
+  context.subscriptions.push(...disposables);
+}
+
+// eslint-disable-next-line @typescript-eslint/no-empty-function
+export function deactivate() {}
diff --git a/packages/vscode-extension/package.json b/packages/vscode-extension/package.json
diff --git a/packages/vscode-extension/project.json b/packages/vscode-extension/project.json
diff --git a/packages/vscode-extension/tsconfig.json b/packages/vscode-extension/tsconfig.json
diff --git a/packages/vscode-extension/tsconfig.lib.json b/packages/vscode-extension/tsconfig.lib.json
diff --git a/packages/vscode-extension/utils.ts b/packages/vscode-extension/utils.ts
diff --git a/tsconfig.base.json b/tsconfig.base.json
diff --git a/workspace.json b/workspace.json
diff --git a/yarn.lock b/yarn.lock

Original file line number	Diff line number	Diff line change
`@@ -4,6 +4,7 @@`
`4`	`4`	`"esbenp.prettier-vscode",`
`5`	`5`	`"firsttris.vscode-jest-runner",`
`6`	`6`	`"dbaeumer.vscode-eslint",`
`7`		`- "stylelint.vscode-stylelint"`
	`7`	`+ "stylelint.vscode-stylelint",`
	`8`	`+ "xiejay97.react-devui"`
`8`	`9`	`]`
`9`	`10`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,3 +1,3 @@`
`1`		`-const nxPreset = require('@nrwl/jest/preset');`
	`1`	`+const nxPreset = require('@nrwl/jest/preset').default;`
`2`	`2`
`3`	`3`	`module.exports = { ...nxPreset };`
Original file line number	Diff line number	Diff line change
`@@ -43,9 +43,7 @@`
`43`	`43`	`"outputs": ["coverage/packages/hooks"],`
`44`	`44`	`"options": {`
`45`	`45`	`"jestConfig": "packages/hooks/jest.config.ts",`
`46`		`- "passWithNoTests": true,`
`47`		`- "codeCoverage": true,`
`48`		`- "coverageReporters": ["clover", "json", "lcov", "text"]`
	`46`	`+ "passWithNoTests": true`
`49`	`47`	`}`
`50`	`48`	`}`
`51`	`49`	`}`