ODP-2169|[SPARK-39740][UI] Upgrade vis timeline to 7.7.2 to fix CVE-2020-28487

### What changes were proposed in this pull request?
Upgrade vis timeline to 7.7.2
Have to add xss option with whitelisting to make the timeline work after the xss protection was added in vis-timeline.
(Refer to visjs/vis-timeline#1010)

### Why are the changes needed?
To remediate CVE-2020-28487
GHSA-9mrv-456v-pf22

### Does this PR introduce _any_ user-facing change?
No

### How was this patch tested?
Manually by running spark-shell and checking History Server UI.
Timeline rendered successfully and no change in style.
Even after following operation:
(1 to 1000).foreach(_ => sc.parallelize(1 to 10).collect)
UI loaded in 3 seconds faster than it loaded with 4.21.

Closes apache#41613 from shrprasa/upgrade_vis.

Authored-by: Shrikant Prasad <[email protected]>
Signed-off-by: Sean Owen <[email protected]>

(cherry picked from commit a8ea35f)

Author: shrprasa

core/src/main/resources/org/apache/spark/ui/static/timeline-view.js

@@ -33,14 +33,18 @@ function drawApplicationTimeline(groupArray, eventObjArray, startTime, offset) {
     locale: "en",
     moment: function (date) {
       return vis.moment(date).utcOffset(offset);
+    },
+    xss: {
+      disabled: false,
+      filterOptions: {
+        whiteList: { svg: ['width', 'height', 'class'], div: ['class', 'style', 'data-toggle', 'data-placement',
+          'data-html', 'data-container', 'data-title', 'data-original-title', 'title'],
+        text: ['x', 'y'], rect: ['x', 'y', 'class', 'width', 'height', 'rx', 'ry'],},
+      },
     }
   };
 
-  var applicationTimeline = new vis.Timeline(container);
-  applicationTimeline.setOptions(options);
-  applicationTimeline.setGroups(groups);
-  applicationTimeline.setItems(items);
-
+  var applicationTimeline = new vis.Timeline(container, items, groups, options);
   setupZoomable("#application-timeline-zoom-lock", applicationTimeline);
   setupExecutorEventAction();
 
@@ -121,13 +125,18 @@ function drawJobTimeline(groupArray, eventObjArray, startTime, offset) {
     locale: "en",
     moment: function (date) {
       return vis.moment(date).utcOffset(offset);
+    },
+    xss: {
+      disabled: false,
+      filterOptions: {
+        whiteList: { svg: ['width', 'height', 'class'], div: ['class', 'style', 'data-toggle', 'data-placement',
+          'data-html', 'data-container', 'data-title', 'data-original-title', 'title'],
+        text: ['x', 'y'], rect: ['x', 'y', 'class', 'width', 'height', 'rx', 'ry'],},
+      },
     }
   };
 
-  var jobTimeline = new vis.Timeline(container);
-  jobTimeline.setOptions(options);
-  jobTimeline.setGroups(groups);
-  jobTimeline.setItems(items);
+  var jobTimeline = new vis.Timeline(container, items, groups, options);
 
   setupZoomable("#job-timeline-zoom-lock", jobTimeline);
   setupExecutorEventAction();
@@ -214,13 +223,18 @@ function drawTaskAssignmentTimeline(groupArray, eventObjArray, minLaunchTime, ma
     locale: "en",
     moment: function (date) {
       return vis.moment(date).utcOffset(offset);
+    },
+    xss: {
+      disabled: false,
+      filterOptions: {
+        whiteList: { svg: ['width', 'height', 'class'], div: ['class', 'style', 'data-toggle', 'data-placement',
+          'data-html', 'data-container', 'data-title', 'data-original-title', 'title'],
+        text: ['x', 'y'], rect: ['x', 'y', 'class', 'width', 'height', 'rx', 'ry'],},
+      },
     }
   };
 
-  var taskTimeline = new vis.Timeline(container);
-  taskTimeline.setOptions(options);
-  taskTimeline.setGroups(groups);
-  taskTimeline.setItems(items);
+  var taskTimeline = new vis.Timeline(container, items, groups, options);
 
   // If a user zooms while a tooltip is displayed, the user may zoom such that the cursor is no
   // longer over the task that the tooltip corresponds to. So, when a user zooms, we should hide

core/src/main/resources/org/apache/spark/ui/static/vis-timeline-graph2d.min.css

@@ -32,7 +32,9 @@ dagre-d3.min.js
 graphlib-dot.min.js
 sorttable.js
 vis-timeline-graph2d.min.js
+vis-timeline-graph2d.min.js.map
 vis-timeline-graph2d.min.css
+vis-timeline-graph2d.min.css.map
 dataTables.bootstrap4.1.10.25.min.css
 dataTables.bootstrap4.1.10.25.min.js
 dataTables.rowsGroup.js

core/src/main/resources/org/apache/spark/ui/static/vis-timeline-graph2d.min.css.map

@@ -1,22 +1,23 @@
-vis.js
-https://github.com/almende/vis
+vis-timeline
+https://visjs.github.io/vis-timeline/
 
-A dynamic, browser-based visualization library.
+Create a fully customizable, interactive timeline with items and ranges.
 
-@version 4.20.1-SNAPSHOT
-@date    2017-10-12
+@version 7.7.2
+@date    2023-03-22T11:14:31.874Z
 
-@license
-Copyright (C) 2011-2017 Almende B.V, http://almende.com
+@copyright (c) 2011-2017 Almende B.V, http://almende.com
+@copyright (c) 2017-2019 visjs contributors, https://github.com/visjs
 
-Vis.js is dual licensed under both
+@license
+vis.js is dual licensed under both
 
-* The Apache 2.0 License
-  http://www.apache.org/licenses/LICENSE-2.0
+ 1. The Apache 2.0 License
+      http://www.apache.org/licenses/LICENSE-2.0
 
-and
+   and
 
-* The MIT License
-  http://opensource.org/licenses/MIT
+ 2. The MIT License
+      http://opensource.org/licenses/MIT
 
-Vis.js may be distributed under either license.
+vis.js may be distributed under either license.

core/src/main/resources/org/apache/spark/ui/static/vis-timeline-graph2d.min.js

@@ -1,22 +1,23 @@
-vis.js
-https://github.com/almende/vis
+vis-timeline
+https://visjs.github.io/vis-timeline/
 
-A dynamic, browser-based visualization library.
+Create a fully customizable, interactive timeline with items and ranges.
 
-@version 4.20.1-SNAPSHOT
-@date    2017-10-12
+@version 7.7.2
+@date    2023-03-22T11:14:31.874Z
 
-@license
-Copyright (C) 2011-2017 Almende B.V, http://almende.com
+@copyright (c) 2011-2017 Almende B.V, http://almende.com
+@copyright (c) 2017-2019 visjs contributors, https://github.com/visjs
 
-Vis.js is dual licensed under both
+@license
+vis.js is dual licensed under both
 
-* The Apache 2.0 License
-  http://www.apache.org/licenses/LICENSE-2.0
+ 1. The Apache 2.0 License
+      http://www.apache.org/licenses/LICENSE-2.0
 
-and
+   and
 
-* The MIT License
-  http://opensource.org/licenses/MIT
+ 2. The MIT License
+      http://opensource.org/licenses/MIT
 
-Vis.js may be distributed under either license.
+vis.js may be distributed under either license.