feat: lwc parser include html, xml and js

Signed-off-by: Shailesh Pachbhai <[email protected]>
salesforcecli · Aug 23, 2024 · 574def5 · 574def5
1 parent b3b944b
commit 574def5
Show file tree

Hide file tree

Showing 9 changed files with 231 additions and 2 deletions.
diff --git a/.vscode/launch.json b/.vscode/launch.json
@@ -4,6 +4,14 @@
   // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
   "version": "0.2.0",
   "configurations": [
+    {
+      "type": "pwa-node",
+      "request": "launch",
+      "name": "Debug TS",
+      "program": "${workspaceFolder}/src/utils/lwcparser/htmlCheerio.ts",
+      "runtimeArgs": ["-r", "ts-node/register"],
+      "console": "integratedTerminal"
+    },
     {
       "type": "node",
       "request": "attach",
@@ -45,4 +53,4 @@
       "preLaunchTask": "Compile"
     }
   ]
-}
+}
diff --git a/package.json b/package.json
@@ -5,17 +5,23 @@
   "author": "Salesforce",
   "bugs": "https://github.com/forcedotcom/cli/issues",
   "dependencies": {
+    "@babel/parser": "^7.25.3",
     "@oclif/command": "^1",
     "@oclif/config": "^1",
     "@oclif/errors": "^1",
     "@salesforce/command": "^4.2.1",
     "@salesforce/core": "^2.37.1",
+    "@types/jsdom": "^21.1.7",
     "@types/lodash.chunk": "^4.2.9",
+    "cheerio": "^1.0.0",
+    "jsdom": "^24.1.1",
     "lodash.chunk": "^4.2.0",
     "open": "^8.4.2",
-    "tslib": "^2"
+    "tslib": "^2",
+    "xmldom": "^0.6.0"
   },
   "devDependencies": {
+    "@babel/parser": "^7.25.3",
     "@oclif/dev-cli": "^1",
     "@oclif/plugin-command-snapshot": "^3.3.15",
     "@oclif/plugin-help": "^3",
@@ -25,6 +31,7 @@
     "@salesforce/plugin-command-reference": "^1.4.7",
     "@salesforce/prettier-config": "^0.0.3",
     "@salesforce/ts-sinon": "^1",
+    "@types/babel__traverse": "^7.20.6",
     "@types/jsforce": "^1.11.5",
     "@typescript-eslint/eslint-plugin": "^4.2.0",
     "@typescript-eslint/parser": "^4.2.0",

diff --git a/src/utils/lwcparser/input/test.html b/src/utils/lwcparser/input/test.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Replace Tags Example</title>
+  </head>
+  <body>
+    <template>
+      <c-input>Hello Shailesh</c-input>
+      <c-input>Another Input</c-input>
+    </template>
+  </body>
+</html>
diff --git a/src/utils/lwcparser/jsDomHtmlParser.ts b/src/utils/lwcparser/jsDomHtmlParser.ts
@@ -0,0 +1,46 @@
+import fs from 'fs';
+import { JSDOM } from 'jsdom';
+
+// Function to replace all <omnistudio-input> tags with <c-input>
+// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
+function replaceOmnistudioInput() {
+  const filePath = '/Users/spachbhai/os-migration/plugin-omnistudio-migration-tool/src/utils/lwcparser/test.html';
+  const fileContent = fs.readFileSync(filePath).toString();
+  // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-assignment
+  const dom = new JSDOM(fileContent);
+  const document = dom.window.document;
+  // Select all <omnistudio-input> elements in the document
+  const elements = document.querySelectorAll('omnistudio-input');
+
+  // Iterate over each element found
+  elements.forEach((element) => {
+    // Create a new <c-input> element
+    const newElement = document.createElement('c-input');
+
+    // Copy the content and attributes from the old element to the new one
+    newElement.innerHTML = element.innerHTML;
+
+    // Copy all attributes from the old element to the new one
+    Array.from(element.attributes).forEach((attr) => {
+      newElement.setAttribute(attr.name, attr.value);
+    });
+
+    // Replace the old element with the new one in the DOM
+    element.replaceWith(newElement);
+
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+    fs.writeFile('src/utils/lwcparser/output/lwc.html', document.body.innerHTML, (err) => {
+      // eslint-disable-next-line no-console
+      if (err) console.log(err);
+      else {
+        // eslint-disable-next-line no-console
+        console.log('File written successfully\n');
+      }
+    });
+    // eslint-disable-next-line no-console
+    // console.log(dom.window.document.body);
+  });
+}
+
+// Call the function to perform the replacement
+replaceOmnistudioInput();
diff --git a/src/utils/lwcparser/lwcJsParser.ts b/src/utils/lwcparser/lwcJsParser.ts
@@ -0,0 +1,19 @@
+import fs from 'fs';
+import * as parser from '@babel/parser';
+import traverse from '@babel/traverse';
+
+const filePath = '/Users/spachbhai/os-migration/plugin-omnistudio-migration-tool/src/utils/lwcparser/test11.js';
+const fileContent = fs.readFileSync(filePath).toString();
+
+const ast = parser.parse(fileContent, {
+  sourceType: 'module',
+  plugins: ['decorators'], // Add 'jsx' if you're parsing JSX
+});
+
+// eslint-disable-next-line @typescript-eslint/no-unsafe-call
+traverse(ast, {
+  ImportDeclaration(path) {
+    // eslint-disable-next-line no-console, @typescript-eslint/no-unsafe-member-access
+    console.log('Import found:', path.node.source.value);
+  },
+});
diff --git a/src/utils/lwcparser/lwcMetaXmlParser.ts b/src/utils/lwcparser/lwcMetaXmlParser.ts
@@ -0,0 +1,23 @@
+/* eslint-disable @typescript-eslint/no-unsafe-assignment */
+import { DOMParser } from 'xmldom';
+
+// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-call
+const parser = new DOMParser();
+const xmlString = `
+  <?xml version="1.0" encoding="UTF-8"?>
+<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata" fqn="omniscript">
+    <apiVersion>56.0</apiVersion>
+    <isExposed>true</isExposed>
+    <runtimeNamespace>omnistudio</runtimeNamespace>
+    <masterLabel>OmniExample - Custom Component Action Example</masterLabel>
+</LightningComponentBundle>
+`;
+
+// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call
+const doc = parser.parseFromString(xmlString, 'text/xml');
+// @typescript-eslint/no-unsafe-call
+// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call
+const bundle = doc.getElementsByTagName('LightningComponentBundle');
+
+// eslint-disable-next-line no-console, @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call
+console.log(bundle[0].getElementsByTagName('runtimeNamespace')[0].textContent);
diff --git a/src/utils/lwcparser/lwchtml.ts b/src/utils/lwcparser/lwchtml.ts
@@ -0,0 +1,37 @@
+import * as fs from 'fs';
+import * as cheerio from 'cheerio';
+
+try {
+  // Load your HTML file
+  const filePath = 'src/utils/lwcparser/input/test.html';
+  const html = fs.readFileSync(filePath, 'utf8');
+
+  // Load HTML into cheerio
+  const modifiedHtml = processHtml(html);
+
+  // Save the modified HTML back to the file or another file
+  fs.writeFileSync(filePath, modifiedHtml);
+
+  // eslint-disable-next-line no-console
+  console.log('Custom tags replaced successfully.');
+} catch (error) {
+  // eslint-disable-next-line no-console
+  console.error('Error processing HTML:', error);
+}
+// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
+function processHtml(html: string) {
+  const $ = cheerio.load(html);
+
+  // Replace <mytag> with <div>
+  $('omnistudio-input').each((_, element) => {
+    // Create a new div element with the same content
+    const newElement = $('<c-input></c-input>').html($(element).html());
+
+    // Replace the old element with the new one
+    $(element).replaceWith(newElement);
+  });
+
+  // Get the modified HTML
+  const modifiedHtml = $.html();
+  return modifiedHtml;
+}
diff --git a/src/utils/lwcparser/output/output.html b/src/utils/lwcparser/output/output.html
@@ -0,0 +1,13 @@
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Replace Tags Example</title>
+  </head>
+  <body>
+    <template>
+      <c-input>Hello Shailesh</c-input>
+      <c-input>Another Input</c-input>
+    </template>
+  </body>
+</html>
diff --git a/src/utils/lwcparser/test11.js b/src/utils/lwcparser/test11.js
@@ -0,0 +1,62 @@
+import { LightningElement, track, api } from 'lwc';
+import * as LABELS from './labels';
+import { cloneDeep } from 'runtime_omnistudio_common/lodash';
+
+export default class actionDebugger extends LightningElement {
+  labels = LABELS;
+  @api set actionData(val) {
+    if (val) {
+      this.actionJson = cloneDeep(val);
+    }
+  }
+  get actionData() {
+    return this.actionJson;
+  }
+
+  @api attrsToBeRemoved = [];
+
+  @track actionJson = [];
+  @track filteredLogs = [];
+  @track actionSearchInput;
+  _displayFilteredLogs = false;
+
+  toggle(event) {
+    const index = event.currentTarget.dataset.index;
+    this.actionJson[index].expanded = !this.actionJson[index].expanded;
+  }
+
+  // Search
+  get actionLogs() {
+    const imports = "'import fs from 'fssss'";
+    console.log(imports);
+    // Display filtered debug logs
+    if (Array.isArray(this.filteredLogs) && this._displayFilteredLogs) {
+      return this.filteredLogs;
+    }
+
+    // Display entire debug logs
+    return this.actionJson;
+  }
+
+  clearLogs() {
+    this._displayFilteredLogs = false;
+    this.actionSearchInput = '';
+    this.actionJson = [];
+  }
+
+  searchActionLogs(event) {
+    event.preventDefault();
+
+    if (event.target.value) {
+      this._displayFilteredLogs = true;
+      const valueToSearch = event.target.value.toLowerCase();
+      this.filteredLogs = this.actionJson.filter((action) => {
+        return action.title && action.title.toLowerCase().includes(valueToSearch);
+      });
+    } else {
+      // Clear filtered debug logs and set flag to display entire debug logs
+      this.filteredLogs = [];
+      this._displayFilteredLogs = false;
+    }
+  }
+}