Importing htmldiff via import statement.

As recommended by the webpack documentation.
Sedeniono · Mar 23, 2024 · ac80bf4 · ac80bf4
1 parent 72b3e1c
commit ac80bf4
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 16 deletions.
diff --git a/src/Globals.js b/src/Globals.js
@@ -3,8 +3,6 @@
 
 // @ts-check
 
-export var gHtmlDiff;
-
 // WorkItemTrackingRestClient: https://learn.microsoft.com/en-us/javascript/api/azure-devops-extension-api/workitemtrackingrestclient
 export var gWorkItemRESTClient;
 
@@ -20,9 +18,8 @@ export var gLocationService;
 export var gFieldTypeEnum;
 
 
-export async function InitSharedGlobals(adoSDK, adoAPI, adoCommonServices, workItemTracking, htmldiff)
+export async function InitSharedGlobals(adoSDK, adoAPI, adoCommonServices, workItemTracking)
 {
-    gHtmlDiff = htmldiff;
     gFieldTypeEnum = workItemTracking.FieldType;
 
     gLocationService = await adoSDK.getService(adoCommonServices.CommonServiceIds.LocationService);

diff --git a/src/HistoryDiffPageScript.js b/src/HistoryDiffPageScript.js
@@ -319,7 +319,7 @@ function CreateWorkItemPageEvents()
 // encountered. For example, if there are two successive bugs, the user shows the history diff on the first bug,
 // then moves on to the next bug, ADO will show immediately our history diff tab, but this function is not called
 // again. Instead, the 'onUnloaded' and 'onLoaded' events are called (see CreateWorkItemPageEvents()).
-async function InitializeHistoryDiff(adoSDK, adoAPI, workItemTracking, adoCommonServices, htmldiff)
+async function InitializeHistoryDiff(adoSDK, adoAPI, workItemTracking, adoCommonServices)
 {
     // Called by the ADO API after the client received and applied the ADO theme. Also called when the user changes the theme
     // while our extension is already loaded. The event doesn't seem to be documented, but it can be seen in the source:
@@ -347,7 +347,7 @@ async function InitializeHistoryDiff(adoSDK, adoAPI, workItemTracking, adoCommon
     gAdoAPI = adoAPI;
     gWorkItemFormServiceId = workItemTracking.WorkItemTrackingServiceIds.WorkItemFormService;
 
-    await InitSharedGlobals(adoSDK, adoAPI, adoCommonServices, workItemTracking, htmldiff);
+    await InitSharedGlobals(adoSDK, adoAPI, adoCommonServices, workItemTracking);
 
     // We first get the work item revisions from ADO, and only then tell ADO that we have loaded successfully.
     // This causes ADO to show the 'spinning loading indicator' until we are ready.
@@ -360,11 +360,10 @@ async function InitializeHistoryDiff(adoSDK, adoAPI, workItemTracking, adoCommon
 require(['azure-devops-extension-sdk', 
          'azure-devops-extension-api', 
          'azure-devops-extension-api/WorkItemTracking',
-         'azure-devops-extension-api/Common/CommonServices',
-         'node-htmldiff'
+         'azure-devops-extension-api/Common/CommonServices'
         ], 
         // @ts-ignore
-        function (adoSDK, adoAPI, workItemTracking, adoCommonServices, htmldiff) {
-            InitializeHistoryDiff(adoSDK, adoAPI, workItemTracking, adoCommonServices, htmldiff);
+        function (adoSDK, adoAPI, workItemTracking, adoCommonServices) {
+            InitializeHistoryDiff(adoSDK, adoAPI, workItemTracking, adoCommonServices);
         }
 );
diff --git a/src/RevisionUpdates.js b/src/RevisionUpdates.js
@@ -4,8 +4,10 @@
 // @ts-check
 
 import { TryGetHTMLLinkNameAndUrlForArtifactLink } from "./ArtifactLinkToURL";
-import { gHtmlDiff, gFieldTypeEnum, gWorkItemRESTClient } from "./Globals";
+import { gFieldTypeEnum, gWorkItemRESTClient } from "./Globals";
 import { EscapeHtml, FormatDate, GetIdentityAvatarHtml, GetIdentityName, RemoveStyle } from "./Utils";
+// @ts-ignore
+import * as htmldiff from 'node-htmldiff';
 
 
 export async function GetTableInfosForEachRevisionUpdate(revisionUpdates, fieldsPropertiesMap, currentProjectName) 
@@ -230,7 +232,7 @@ function DiffHtmlText(oldValue, newValue)
     // <style> tag when loading a work item in the UI.
     const oldValueFixed = RemoveStyle(oldValue ?? '');
     const newValueFixed = RemoveStyle(newValue ?? '');
-    return gHtmlDiff(oldValueFixed, newValueFixed, 'diffCls'); 
+    return htmldiff(oldValueFixed, newValueFixed, 'diffCls'); 
 }
 
 
@@ -303,7 +305,7 @@ function GetDiffFromUpdatedField(fieldsPropertiesMap, fieldReferenceName, value)
             const newLineRegex = /(?:\r\n|\r|\n)/g;
             const oldValue = EscapeHtml(value.oldValue ?? '').replace(newLineRegex, '<br>');
             const newValue = EscapeHtml(value.newValue ?? '').replace(newLineRegex, '<br>');
-            const diff = gHtmlDiff(oldValue, newValue, 'diffCls');
+            const diff = htmldiff(oldValue, newValue, 'diffCls');
             return diff;
         }
 

diff --git a/src/Utils.js b/src/Utils.js
@@ -3,7 +3,9 @@
 
 // @ts-check
 
-import { gHtmlDiff } from "./Globals";
+
+// @ts-ignore
+import * as htmldiff from 'node-htmldiff';
 
 
 const gReplaceEntityMap = {
@@ -68,5 +70,5 @@ export function DiffHtmlText(oldValue, newValue)
     // <style> tag when loading a work item in the UI.
     const oldValueFixed = RemoveStyle(oldValue ?? '');
     const newValueFixed = RemoveStyle(newValue ?? '');
-    return gHtmlDiff(oldValueFixed, newValueFixed, 'diffCls'); 
+    return htmldiff(oldValueFixed, newValueFixed, 'diffCls'); 
 }
diff --git a/vss-extension.json b/vss-extension.json
@@ -2,7 +2,7 @@
     "manifestVersion": 1,
     "id": "HistoryDiff",
     "publisher": "Sedenion",
-    "version": "1.3.0.18",
+    "version": "1.3.0.33",
     "name": "History Diff",
     "description": "Azure DevOps extension to show the history of work item fields with proper diffs.",
     "public": true,