feat(generator): add typedoc and tsconfig generation (#19)

- add typedoc and tsconfig generation - add global test to generator --------- Signed-off-by: Francois Eoche <[email protected]> Signed-off-by: aurore.stagnol <[email protected]>
ovh · Apr 27, 2023 · 928f881 · 928f881
1 parent 4e19c84
commit 928f881
Show file tree

Hide file tree

Showing 6 changed files with 84 additions and 43 deletions.
diff --git a/packages/libraries/core/scripts/generate-typedoc-md.js b/packages/libraries/core/scripts/generate-typedoc-md.js
@@ -4,54 +4,14 @@ const typedocJson = require(path.resolve('typedoc/typedoc.json'));
 
 const { convertJsonToMarkdown } = require(path.resolve('src/utils/typedoc/typedoc-json-to-md'));
 
-const components = [
-  'OdsAccordion',
-  'OdsAccordionGroup',
-  'OdsButton',
-  'OdsCart',
-  'OdsCartFooter',
-  'OdsCartFooterItem',
-  'OdsCartHeader',
-  'OdsCartItem',
-  'OdsCartItemOption',
-  'OdsCartManager',
-  'OdsCartSection',
-  'OdsCartTotal',
-  'OdsCheckbox',
-  'OdsCheckboxButton',
-  'OdsChip',
-  'OdsCode',
-  'OdsContentAddon',
-  'OdsDivider',
-  'OdsFlag',
-  'OdsIcon',
-  'OdsInput',
-  'OdsLink',
-  'OdsLocationTile',
-  'OdsMessage',
-  'OdsQuantity',
-  'OdsRadio',
-  'OdsRadioButton',
-  'OdsRadioGroup',
-  'OdsRange',
-  'OdsSelect',
-  'OdsSkeleton',
-  'OdsTabs',
-  'OdsTabBar',
-  'OdsTabBarItem',
-  'OdsTabPanel',
-  'OdsText',
-  'OdsTextarea',
-  'OdsTile',
-  'OdsToggle',
-];
+const componentTypes = require('../src/components/component-types.json');
 
 const createComponentDetailedList = (list) => list.map((item) => ({
   pathName: item.replace(/ods/gmi, '').replace(/([a-z])([A-Z])/gm, '$1-$2').toLowerCase(),
   regex: new RegExp(item, 'gmi'),
 }));
 
-createComponentDetailedList(components).forEach(({ pathName, regex }) => {
+createComponentDetailedList(componentTypes).forEach(({ pathName, regex }) => {
   const dir = path.resolve('src/components', pathName, 'docs');
   fs.mkdirSync(dir, { recursive: true });
 

diff --git a/packages/libraries/core/src/components/component-types.json b/packages/libraries/core/src/components/component-types.json
@@ -0,0 +1,41 @@
+[
+  "OdsAccordion",
+  "OdsAccordionGroup",
+  "OdsButton",
+  "OdsCart",
+  "OdsCartFooter",
+  "OdsCartFooterItem",
+  "OdsCartHeader",
+  "OdsCartItem",
+  "OdsCartItemOption",
+  "OdsCartManager",
+  "OdsCartSection",
+  "OdsCartTotal",
+  "OdsCheckbox",
+  "OdsCheckboxButton",
+  "OdsChip",
+  "OdsCode",
+  "OdsContentAddon",
+  "OdsDivider",
+  "OdsFlag",
+  "OdsIcon",
+  "OdsInput",
+  "OdsLink",
+  "OdsLocationTile",
+  "OdsMessage",
+  "OdsQuantity",
+  "OdsRadio",
+  "OdsRadioButton",
+  "OdsRadioGroup",
+  "OdsRange",
+  "OdsSelect",
+  "OdsSkeleton",
+  "OdsTabs",
+  "OdsTabBar",
+  "OdsTabBarItem",
+  "OdsTabPanel",
+  "OdsText",
+  "OdsTextarea",
+  "OdsTile",
+  "OdsToggle"
+]
diff --git a/packages/stencil/libraries/stencil-core/src/stencilConfig.ts b/packages/stencil/libraries/stencil-core/src/stencilConfig.ts
@@ -77,6 +77,7 @@ import { OdsStencilConfigEnvOptions } from './ods-stencil-config-env-options';
  * @param vueOutput - config for vue proxies
  * @param dev - dev specific options to set
  * @param prod - production specific options to set
+ * @param test - testing specific options to set
  */
 export function getStencilConfig({
                                    namespace,
@@ -87,7 +88,8 @@ export function getStencilConfig({
                                    reactOutput,
                                    vueOutput,
                                    dev,
-                                   prod
+                                   prod,
+                                   test,
                                  }: {
   namespace: string,
   args: string[],
@@ -100,6 +102,7 @@ export function getStencilConfig({
   vueOutput?: Partial<OutputTargetVue>,
   dev?: OdsStencilConfigEnvOptions,
   prod?: OdsStencilConfigEnvOptions,
+  test?: OdsStencilConfigEnvOptions,
 }): StencilConfig {
   const isCi = args.some((arg) => arg.match(/(--|:)ci/g)),
     /**
@@ -203,6 +206,8 @@ export function getStencilConfig({
     globalScriptOption = { globalScript: dev.globalScript };
   } else if (isProd && prod?.globalScript) {
     globalScriptOption = { globalScript: prod.globalScript };
+  } else if (isTest && test?.globalScript) {
+    globalScriptOption = { globalScript: test.globalScript };
   }
   globalScriptOption?.globalScript && console.info(`ODS: integrates globalScript ${globalScriptOption.globalScript} into the Build`);
 

diff --git a/packages/tools/generator/component/saofile.js b/packages/tools/generator/component/saofile.js
@@ -63,6 +63,13 @@ module.exports = {
           return data + `export * from './${templateData.componentFolderName}/public-api';`
         }
       },
+      {
+        type: 'modify',
+        files: `${config.outDir}/${config.odsCorePath}/component-types.json`,
+        handler(data) {
+          return [...data, `Ods${templateData.componentName}`].sort();
+        }
+      },
 
       // Move Specifications files
       {
@@ -137,6 +144,24 @@ module.exports = {
           'stencil/vue/tsconfig.json': `${config.outDir}/${config.odsStencilPath}/${templateData.name}/vue/tsconfig.json`,
         }
       },
+      {
+        type: 'modify',
+        files: `${config.outDir}/${config.odsStencilPath}/tsconfig.components.dev.json`,
+        handler(data) {
+          data.include.push(`${templateData.name}/src`);
+          data.include = data.include.sort();
+          return data;
+        }
+      },
+      {
+        type: 'modify',
+        files: `${config.outDir}/${config.odsStencilPath}/tsconfig.components.prod.json`,
+        handler(data) {
+          data.include.push(`${templateData.name}/src`);
+          data.include = data.include.sort();
+          return data;
+        }
+      },
       {
         type: 'modify',
         files: `${config.outDir}/${config.odsThemingPath}/ods-size-definitions.scss`,

diff --git a/packages/tools/generator/component/template/stencil/src/global.test.ts b/packages/tools/generator/component/template/stencil/src/global.test.ts
@@ -0,0 +1,7 @@
+// ###
+// global script file to include only in test mode.
+// it always has to include './global.ts'
+// then, you can import sub-component(s) needed in tests like this: import '@ovhcloud/ods-stencil/components/button';
+// ###
+
+import './global';
diff --git a/packages/tools/generator/component/template/stencil/stencil.config.ts b/packages/tools/generator/component/template/stencil/stencil.config.ts
@@ -22,5 +22,8 @@ export const config: Config = getStencilConfig({
   },
   prod: {
     globalScript: 'src/global.prod.ts'
+  },
+  test: {
+    globalScript: 'src/global.test.ts'
   }
 });
-Original file line number
+Diff line change
@@ Expand Up / @@ -22,5 +22,8 @@ export const config: Config = getStencilConfig({ @@
       },
       prod: {
         globalScript: 'src/global.prod.ts'
+      },
+      test: {
+        globalScript: 'src/global.test.ts'
       }
     });