Replace Angular code that synchronizes URL parameters with Time API (#3089)

* Added new test to telemetry tables to check that telemetry data is correctly rendered in rows

* Added test tools for mocking builtins

* Changed order that promises are resolved to address race condition

* Remove duplicate installation of UTC Time System

* Added additional test telemetry

* Start Open MCT headless

* Added headless mode start option. Fixes #3064

* Added new non-angular URL handler

* Removed legacy Angular TimeSettingsURLHandler

* Added function to testTools to reset application state

* Use resetApplicationState function from telemetry table spec

* Added new TimeSettingsURLHandler to plugins

* Added missing semicolons

* #2826 Refactored code into separate class

* Handling of hash-relative URLs

* Refactoring URL sync code

* Refactored to external class

* Moved utils to new 'utils' directory. Refactored location util functions from class to exported functions

* Added test specs for openmctLocation

* Added new function to destroy instances of Open MCT between test runs

* Ensure test specs are cleaning up after themselves

* Added test spec for new URLTimeSettingsSynchronizer

* Removed use of shell script as it doesn't work in windows

* Pushed test coverage to 100%

* Added missing copyright statement

* Removed debugging output

* Fixed linting error

* Upgrade node version

* Clear cache

* Re-enabled tests

Co-authored-by: Melanie Lean <melanielean@Melanies-MacBook-Pro.local>
Co-authored-by: Shefali Joshi <simplyrender@gmail.com>
Co-authored-by: Deep Tailor <deep.j.tailor@nasa.gov>

src/plugins/telemetryTable/pluginSpec.js

@@ -23,8 +23,10 @@ import TablePlugin from './plugin.js';
 import Vue from 'vue';
 import {
     createOpenMct,
-    createMouseEvent
-} from 'testUtils';
+    createMouseEvent,
+    spyOnBuiltins,
+    resetApplicationState
+} from 'utils/testing';
 
 describe("the plugin", () => {
     let openmct;
@@ -32,6 +34,10 @@ describe("the plugin", () => {
     let element;
     let child;
 
+    beforeAll(() => {
+        resetApplicationState();
+    })
+
     beforeEach((done) => {
         openmct = createOpenMct();
 
@@ -40,16 +46,27 @@ describe("the plugin", () => {
         tablePlugin = new TablePlugin();
         openmct.install(tablePlugin);
 
+        spyOn(openmct.telemetry, 'request').and.returnValue(Promise.resolve([]));
+
         element = document.createElement('div');
         child = document.createElement('div');
         element.appendChild(child);
 
-        spyOn(openmct.telemetry, 'request').and.returnValue(Promise.resolve([]));
+        openmct.time.timeSystem('utc', {start: 0, end: 4});
+
+        spyOnBuiltins(['requestAnimationFrame']);
+        window.requestAnimationFrame.and.callFake((callBack) => {
+            callBack();
+        });
 
         openmct.on('start', done);
         openmct.startHeadless();
     });
 
+    afterEach(() => {
+        resetApplicationState(openmct);
+    });
+
     describe("defines a table object", function () {
         it("that is creatable", () => {
             let tableType = openmct.types.get('table');
@@ -86,32 +103,73 @@ describe("the plugin", () => {
                 name: "Test Object",
                 telemetry: {
                     values: [{
+                        key: "utc",
+                        format: "utc",
+                        name: "Time",
+                        hints: {
+                            domain: 1
+                        }
+                    },{
                         key: "some-key",
                         name: "Some attribute",
                         hints: {
-                            domain: 1
+                            range: 1
                         }
                     }, {
                         key: "some-other-key",
                         name: "Another attribute",
                         hints: {
-                            range: 1
+                            range: 2
                         }
                     }]
                 }
             };
+            const testTelemetry = [
+                {
+                    'utc': 1,
+                    'some-key': 'some-value 1',
+                    'some-other-key' : 'some-other-value 1'
+                },
+                {
+                    'utc': 2,
+                    'some-key': 'some-value 2',
+                    'some-other-key' : 'some-other-value 2'
+                },
+                {
+                    'utc': 3,
+                    'some-key': 'some-value 3',
+                    'some-other-key' : 'some-other-value 3'
+                }
+            ];
+            let telemetryPromiseResolve;
+            let telemetryPromise = new Promise((resolve) => {
+                telemetryPromiseResolve = resolve;
+            });
+            openmct.telemetry.request.and.callFake(() => {
+                telemetryPromiseResolve(testTelemetry);
+                return telemetryPromise;
+            });
+
             applicableViews = openmct.objectViews.get(testTelemetryObject);
             tableViewProvider = applicableViews.find((viewProvider) => viewProvider.key === 'table');
-            tableView = tableViewProvider.view(testTelemetryObject, true, [testTelemetryObject]);
+            tableView = tableViewProvider.view(testTelemetryObject, [testTelemetryObject]);
             tableView.show(child, true);
-            return Vue.nextTick();
+
+            return telemetryPromise.then(() => Vue.nextTick());
         });
 
+        it("Renders a row for every telemetry datum returned",() => {
+            let rows = element.querySelectorAll('table.c-telemetry-table__body tr');
+            expect(rows.length).toBe(3);
+        });
+
+
         it("Renders a column for every item in telemetry metadata",() => {
             let headers = element.querySelectorAll('span.c-telemetry-table__headers__label');
-            expect(headers.length).toBe(2);
-            expect(headers[0].innerText).toBe('Some attribute');
-            expect(headers[1].innerText).toBe('Another attribute');
+            expect(headers.length).toBe(3);
+            expect(headers[0].innerText).toBe('Time');
+            expect(headers[1].innerText).toBe('Some attribute');
+            expect(headers[2].innerText).toBe('Another attribute');
         });
 
         it("Supports column reordering via drag and drop",() => {