Testing with non-reactive API

* If there is a pending create request for an id, queue a duplicate request.
* Fix downsteam errors when objects are missing
* Changed error logging from console.log to console.warn

platform/forms/src/MCTFileInput.js

@@ -44,9 +44,11 @@ define(
                         setText(result.name);
                         scope.ngModel[scope.field] = result;
                         control.$setValidity("file-input", true);
+                        scope.$digest();
                     }, function () {
                         setText('Select File');
                         control.$setValidity("file-input", false);
+                        scope.$digest();
                     });
                 }
 

src/MCT.js

@@ -288,6 +288,8 @@ define([
         this.install(this.plugins.ObjectInterceptors());
         this.install(this.plugins.NonEditableFolder());
         this.install(this.plugins.DeviceClassifier());
+
+        this._isVue = true;
     }
 
     MCT.prototype = Object.create(EventEmitter.prototype);

src/adapter/services/MissingModelCompatibilityDecorator.js

@@ -81,14 +81,8 @@ define([
                     return models;
                 }
 
-                return this.apiFetch(missingIds)
+                //Temporary fix for missing models - don't retry using this.apiFetch
-                    .then(function (apiResults) {
+                return models;
-                        Object.keys(apiResults).forEach(function (k) {
-                            models[k] = apiResults[k];
-                        });
-
-                        return models;
-                    });
             }.bind(this));
     };
 

src/api/actions/ActionsAPI.js

@@ -110,7 +110,7 @@ class ActionsAPI extends EventEmitter {
         return actionsObject;
     }
 
-    _groupAndSortActions(actionsArray) {
+    _groupAndSortActions(actionsArray = []) {
         if (!Array.isArray(actionsArray) && typeof actionsArray === 'object') {
             actionsArray = Object.keys(actionsArray).map(key => actionsArray[key]);
         }

src/api/objects/ObjectAPI.js

@@ -190,6 +190,14 @@ ObjectAPI.prototype.get = function (identifier, abortSignal) {
 
         result = this.applyGetInterceptors(identifier, result);
 
+        return result;
+    }).catch((result) => {
+        console.warn(`Failed to retrieve ${keystring}:`, result);
+
+        delete this.cache[keystring];
+
+        result = this.applyGetInterceptors(identifier);
+
         return result;
     });
 

src/api/telemetry/TelemetryAPI.js

@@ -483,6 +483,10 @@ define([
      * @returns {Object<String, {TelemetryValueFormatter}>}
      */
     TelemetryAPI.prototype.getFormatMap = function (metadata) {
+        if (!metadata) {
+            return {};
+        }
+
         if (!this.formatMapCache.has(metadata)) {
             const formatMap = metadata.values().reduce(function (map, valueMetadata) {
                 map[valueMetadata.key] = this.getValueFormatter(valueMetadata);

src/api/telemetry/TelemetryCollection.js

@@ -130,8 +130,13 @@ export class TelemetryCollection extends EventEmitter {
         this.options.onPartialResponse = this._processNewTelemetry.bind(this);
 
         try {
+            if (this.requestAbort) {
+                this.requestAbort.abort();
+            }
+
             this.requestAbort = new AbortController();
             this.options.signal = this.requestAbort.signal;
+            this.emit('requestStarted');
             historicalData = await this.historicalProvider.request(this.domainObject, this.options);
         } catch (error) {
             if (error.name !== 'AbortError') {
@@ -140,6 +145,7 @@ export class TelemetryCollection extends EventEmitter {
             }
         }
 
+        this.emit('requestEnded');
         this.requestAbort = undefined;
 
         this._processNewTelemetry(historicalData);

src/plugins/LADTable/components/LADRow.vue

@@ -96,11 +96,11 @@ export default {
 
         this.timestampKey = this.openmct.time.timeSystem().key;
 
-        this.valueMetadata = this
+        this.valueMetadata = this.metadata ? this
             .metadata
-            .valuesForHints(['range'])[0];
+            .valuesForHints(['range'])[0] : undefined;
 
-        this.valueKey = this.valueMetadata.key;
+        this.valueKey = this.valueMetadata ? this.valueMetadata.key : undefined;
 
         this.unsubscribe = this.openmct
             .telemetry
@@ -151,7 +151,10 @@ export default {
                     size: 1,
                     strategy: 'latest'
                 })
-                .then((array) => this.updateValues(array[array.length - 1]));
+                .then((array) => this.updateValues(array[array.length - 1]))
+                .catch((error) => {
+                    console.warn('Error fetching data', error);
+                });
         },
         updateBounds(bounds, isTick) {
             this.bounds = bounds;

src/plugins/LADTable/components/LADTable.vue

@@ -73,8 +73,9 @@ export default {
         hasUnits() {
             let itemsWithUnits = this.items.filter((item) => {
                 let metadata = this.openmct.telemetry.getMetadata(item.domainObject);
+                const valueMetadatas = metadata ? metadata.valueMetadatas : [];
 
-                return this.metadataHasUnits(metadata.valueMetadatas);
+                return this.metadataHasUnits(valueMetadatas);
 
             });
 

src/plugins/filters/components/FiltersView.vue

@@ -101,7 +101,7 @@ export default {
         addChildren(domainObject) {
             let keyString = this.openmct.objects.makeKeyString(domainObject.identifier);
             let metadata = this.openmct.telemetry.getMetadata(domainObject);
-            let metadataWithFilters = metadata.valueMetadatas.filter(value => value.filters);
+            let metadataWithFilters = metadata ? metadata.valueMetadatas.filter(value => value.filters) : [];
             let hasFiltersWithKeyString = this.persistedFilters[keyString] !== undefined;
             let mutateFilters = false;
             let childObject = {

src/plugins/notebook/components/NotebookEmbed.vue

@@ -180,9 +180,13 @@ export default {
                 this.openmct.notifications.alert(message);
             }
 
-            const relativeHash = hash.slice(hash.indexOf('#'));
+            if (this.openmct.editor.isEditing()) {
-            const url = new URL(relativeHash, `${location.protocol}//${location.host}${location.pathname}`);
+                this.previewEmbed();
-            this.openmct.router.navigate(url.hash);
+            } else {
+                const relativeHash = hash.slice(hash.indexOf('#'));
+                const url = new URL(relativeHash, `${location.protocol}//${location.host}${location.pathname}`);
+                this.openmct.router.navigate(url.hash);
+            }
         },
         formatTime(unixTime, timeFormat) {
             return Moment.utc(unixTime).format(timeFormat);

src/plugins/plot/ColorSwatch.vue

@@ -21,67 +21,57 @@
 -->
 <template>
 <div class="u-contents">
-    <ul v-if="canEdit"
+    <div v-if="canEdit"
-        class="l-inspector-part"
+         class="grid-row"
     >
-        <h2 v-if="heading"
+        <div class="grid-cell label"
-            :title="heading"
+             :title="editTitle"
-        >{{ heading }}</h2>
+        >{{ shortLabel }}</div>
-        <li class="grid-row">
+        <div class="grid-cell value">
-            <div class="grid-cell label"
+            <div class="c-click-swatch c-click-swatch--menu"
-                 :title="editTitle"
+                 @click="toggleSwatch()"
-            >{{ shortLabel }}</div>
+            >
-            <div class="grid-cell value">
+                <span class="c-color-swatch"
-                <div class="c-click-swatch c-click-swatch--menu"
+                      :style="{ background: currentColor }"
-                     @click="toggleSwatch()"
                 >
-                    <span class="c-color-swatch"
+                </span>
-                          :style="{ background: currentColor }"
+            </div>
+            <div class="c-palette c-palette--color">
+                <div v-show="swatchActive"
+                     class="c-palette__items"
+                >
+                    <div v-for="group in colorPaletteGroups"
+                         :key="group.id"
+                         class="u-contents"
                     >
-                    </span>
+                        <div v-for="color in group"
-                </div>
+                             :key="color.id"
-                <div class="c-palette c-palette--color">
+                             class="c-palette__item"
-                    <div v-show="swatchActive"
+                             :class="{ 'selected': currentColor === color.hexString }"
-                         class="c-palette__items"
+                             :style="{ background: color.hexString }"
-                    >
+                             @click="setColor(color)"
-                        <div v-for="group in colorPaletteGroups"
-                             :key="group.id"
-                             class="u-contents"
                         >
-                            <div v-for="color in group"
-                                 :key="color.id"
-                                 class="c-palette__item"
-                                 :class="{ 'selected': currentColor === color.hexString }"
-                                 :style="{ background: color.hexString }"
-                                 @click="setColor(color)"
-                            >
-                            </div>
                         </div>
                     </div>
                 </div>
             </div>
-        </li>
+        </div>
-    </ul>
+    </div>
-    <ul v-else
+    <div v-else
-        class="l-inspector-part"
+         class="grid-row"
     >
-        <h2 v-if="heading"
+        <div class="grid-cell label"
-            :title="heading"
+             :title="viewTitle"
-        >{{ heading }}</h2>
+        >{{ shortLabel }}</div>
-        <li class="grid-row">
+        <div class="grid-cell value">
-            <div class="grid-cell label"
+            <span class="c-color-swatch"
-                 :title="viewTitle"
+                  :style="{
-            >{{ shortLabel }}</div>
+                      'background': currentColor
-            <div class="grid-cell value">
+                  }"
-                <span class="c-color-swatch"
+            >
-                      :style="{
+            </span>
-                          'background': currentColor
+        </div>
-                      }"
+    </div>
-                >
-                </span>
-            </div>
-        </li>
-    </ul>
 </div>
 </template>
 
@@ -114,12 +104,6 @@ export default {
             default() {
                 return 'Color';
             }
-        },
-        heading: {
-            type: String,
-            default() {
-                return '';
-            }
         }
     },
     data() {

src/plugins/plot/barGraph/BarGraphView.vue

@@ -107,7 +107,7 @@ export default {
                 };
                 this.openmct.objects.mutate(
                     this.domainObject,
-                    `configuration.barStyles[${this.key}]`,
+                    `configuration.barStyles[${key}]`,
                     this.domainObject.configuration.barStyles[key]
                 );
             } else {
@@ -150,6 +150,10 @@ export default {
         },
         getAxisMetadata(telemetryObject) {
             const metadata = this.openmct.telemetry.getMetadata(telemetryObject);
+            if (!metadata) {
+                return {};
+            }
+
             const yAxisMetadata = metadata.valuesForHints(['range'])[0];
             //Exclude 'name' and 'time' based metadata specifically, from the x-Axis values by using range hints only
             const xAxisMetadata = metadata.valuesForHints(['range']);
@@ -255,6 +259,9 @@ export default {
                     data.forEach((datum) => {
                         this.processData(telemetryObject, datum, axisMetadata);
                     });
+                })
+                .catch((error) => {
+                    console.warn(`Error fetching data`, error);
                 });
         },
         subscribeToObject(telemetryObject) {

src/plugins/plot/barGraph/inspector/BarGraphOptions.vue

@@ -33,9 +33,9 @@
     </li>
     <ColorSwatch v-if="expanded"
                  :current-color="currentColor"
-                 title="Manually set the color for this bar graph."
+                 title="Manually set the color for this bar graph series."
-                 edit-title="Manually set the color for this bar graph"
+                 edit-title="Manually set the color for this bar graph series"
-                 view-title="The color for this bar graph."
+                 view-title="The color for this bar graph series."
                  short-label="Color"
                  class="grid-properties"
                  @colorSet="setColor"

src/plugins/plot/barGraph/inspector/Options.vue

@@ -20,15 +20,13 @@
  at runtime from the About dialog for additional information.
 -->
 <template>
-<div>
+<ul class="c-tree">
-    <ul class="c-tree">
+    <h2 title="Display properties for this object">Bar Graph Series</h2>
-        <li v-for="series in domainObject.composition"
+    <bar-graph-options v-for="series in domainObject.composition"
-            :key="series.key"
+                       :key="series.key"
-        >
+                       :item="series"
-            <bar-graph-options :item="series" />
+    />
-        </li>
+</ul>
-    </ul>
-</div>
 </template>
 
 <script>

src/plugins/plot/configuration/PlotSeries.js

@@ -82,12 +82,17 @@ export default class PlotSeries extends Model {
             .openmct
             .telemetry
             .getMetadata(options.domainObject);
+
         this.formats = options
             .openmct
             .telemetry
             .getFormatMap(this.metadata);
 
-        const range = this.metadata.valuesForHints(['range'])[0];
+        //if the object is missing or doesn't have metadata for some reason
+        let range = {};
+        if (this.metadata) {
+            range = this.metadata.valuesForHints(['range'])[0];
+        }
 
         return {
             name: options.domainObject.name,
@@ -191,7 +196,10 @@ export default class PlotSeries extends Model {
                     .uniq(true, point => [this.getXVal(point), this.getYVal(point)].join())
                     .value();
                 this.reset(newPoints);
-            }.bind(this));
+            }.bind(this))
+            .catch((error) => {
+                console.warn('Error fetching data', error);
+            });
         /* eslint-enable you-dont-need-lodash-underscore/concat */
     }
     /**
@@ -199,7 +207,9 @@ export default class PlotSeries extends Model {
      */
     onXKeyChange(xKey) {
         const format = this.formats[xKey];
-        this.getXVal = format.parse.bind(format);
+        if (format) {
+            this.getXVal = format.parse.bind(format);
+        }
     }
     /**
      * Update y formatter on change, default to stepAfter interpolation if

src/plugins/plot/configuration/YAxisModel.js

@@ -184,7 +184,7 @@ export default class YAxisModel extends Model {
         this.set('values', yMetadata.values);
         if (!label) {
             const labelName = series.map(function (s) {
-                return s.metadata.value(s.get('yKey')).name;
+                return s.metadata ? s.metadata.value(s.get('yKey')).name : '';
             }).reduce(function (a, b) {
                 if (a === undefined) {
                     return b;
@@ -204,7 +204,7 @@ export default class YAxisModel extends Model {
             }
 
             const labelUnits = series.map(function (s) {
-                return s.metadata.value(s.get('yKey')).units;
+                return s.metadata ? s.metadata.value(s.get('yKey')).units : '';
             }).reduce(function (a, b) {
                 if (a === undefined) {
                     return b;

src/plugins/telemetryTable/TelemetryTable.js

@@ -60,18 +60,17 @@ define([
             this.addTelemetryObject = this.addTelemetryObject.bind(this);
             this.removeTelemetryObject = this.removeTelemetryObject.bind(this);
             this.removeTelemetryCollection = this.removeTelemetryCollection.bind(this);
+            this.incrementOutstandingRequests = this.incrementOutstandingRequests.bind(this);
+            this.decrementOutstandingRequests = this.decrementOutstandingRequests.bind(this);
             this.resetRowsFromAllData = this.resetRowsFromAllData.bind(this);
             this.isTelemetryObject = this.isTelemetryObject.bind(this);
-            this.refreshData = this.refreshData.bind(this);
             this.updateFilters = this.updateFilters.bind(this);
+            this.clearData = this.clearData.bind(this);
             this.buildOptionsFromConfiguration = this.buildOptionsFromConfiguration.bind(this);
 
             this.filterObserver = undefined;
 
             this.createTableRowCollections();
-
-            openmct.time.on('bounds', this.refreshData);
-            openmct.time.on('timeSystem', this.refreshData);
         }
 
         /**
@@ -141,8 +140,6 @@ define([
             let columnMap = this.getColumnMapForObject(keyString);
             let limitEvaluator = this.openmct.telemetry.limitEvaluator(telemetryObject);
 
-            this.incrementOutstandingRequests();
-
             const telemetryProcessor = this.getTelemetryProcessor(keyString, columnMap, limitEvaluator);
             const telemetryRemover = this.getTelemetryRemover();
 
@@ -151,13 +148,13 @@ define([
             this.telemetryCollections[keyString] = this.openmct.telemetry
                 .requestCollection(telemetryObject, requestOptions);
 
+            this.telemetryCollections[keyString].on('requestStarted', this.incrementOutstandingRequests);
+            this.telemetryCollections[keyString].on('requestEnded', this.decrementOutstandingRequests);
             this.telemetryCollections[keyString].on('remove', telemetryRemover);
             this.telemetryCollections[keyString].on('add', telemetryProcessor);
-            this.telemetryCollections[keyString].on('clear', this.tableRows.clear);
+            this.telemetryCollections[keyString].on('clear', this.clearData);
             this.telemetryCollections[keyString].load();
 
-            this.decrementOutstandingRequests();
-
             this.telemetryObjects[keyString] = {
                 telemetryObject,
                 keyString,
@@ -268,17 +265,6 @@ define([
             this.emit('object-removed', objectIdentifier);
         }
 
-        refreshData(bounds, isTick) {
-            if (!isTick && this.tableRows.outstandingRequests === 0) {
-                this.tableRows.clear();
-                this.tableRows.sortBy({
-                    key: this.openmct.time.timeSystem().key,
-                    direction: 'asc'
-                });
-                this.tableRows.resubscribe();
-            }
-        }
-
         clearData() {
             this.tableRows.clear();
             this.emit('refresh');
@@ -378,9 +364,6 @@ define([
             let keystrings = Object.keys(this.telemetryCollections);
             keystrings.forEach(this.removeTelemetryCollection);
 
-            this.openmct.time.off('bounds', this.refreshData);
-            this.openmct.time.off('timeSystem', this.refreshData);
-
             if (this.filterObserver) {
                 this.filterObserver();
             }

src/plugins/telemetryTable/components/table-configuration.vue

@@ -131,7 +131,8 @@ export default {
             objects.forEach(object => this.addColumnsForObject(object, false));
         },
         addColumnsForObject(telemetryObject) {
-            let metadataValues = this.openmct.telemetry.getMetadata(telemetryObject).values();
+            const metadata = this.openmct.telemetry.getMetadata(telemetryObject);
+            let metadataValues = metadata ? metadata.values() : [];
             metadataValues.forEach(metadatum => {
                 let column = new TelemetryTableColumn(this.openmct, metadatum);
                 this.tableConfiguration.addSingleColumnForObject(telemetryObject, column);

src/plugins/telemetryTable/components/table-footer-indicator.vue

@@ -105,7 +105,8 @@ export default {
                 composition.load().then((domainObjects) => {
                     domainObjects.forEach(telemetryObject => {
                         let keyString = this.openmct.objects.makeKeyString(telemetryObject.identifier);
-                        let metadataValues = this.openmct.telemetry.getMetadata(telemetryObject).values();
+                        const metadata = this.openmct.telemetry.getMetadata(telemetryObject);
+                        let metadataValues = metadata ? metadata.values() : [];
                         let filters = this.filteredTelemetry[keyString];
 
                         if (filters !== undefined) {

src/plugins/telemetryTable/components/table.vue

@@ -125,7 +125,6 @@
     <div
         class="c-table c-telemetry-table c-table--filterable c-table--sortable has-control-bar u-style-receiver js-style-receiver"
         :class="{
-            'loading': loading,
             'is-paused' : paused
         }"
     >
@@ -362,7 +361,7 @@ export default {
             autoScroll: true,
             sortOptions: {},
             filters: {},
-            loading: true,
+            loading: false,
             scrollable: undefined,
             tableEl: undefined,
             headersHolderEl: undefined,
@@ -422,6 +421,14 @@ export default {
         }
     },
     watch: {
+        loading: {
+            handler(isLoading) {
+                if (this.viewActionsCollection) {
+                    let action = isLoading ? 'disable' : 'enable';
+                    this.viewActionsCollection[action](['export-csv-all']);
+                }
+            }
+        },
         markedRows: {
             handler(newVal, oldVal) {
                 this.$emit('marked-rows-updated', newVal, oldVal);
@@ -1020,6 +1027,12 @@ export default {
                 this.viewActionsCollection.disable(['export-csv-marked', 'unmark-all-rows']);
             }
 
+            if (this.loading) {
+                this.viewActionsCollection.disable(['export-csv-all']);
+            } else {
+                this.viewActionsCollection.enable(['export-csv-all']);
+            }
+
             if (this.paused) {
                 this.viewActionsCollection.hide(['pause-data']);
                 this.viewActionsCollection.show(['play-data']);

src/plugins/timeConductor/independent/IndependentTimeConductor.vue

@@ -151,29 +151,22 @@ export default {
             this.stopFollowingTimeContext();
             this.timeContext = this.openmct.time.getContextForView([this.domainObject]);
             this.timeContext.on('timeContext', this.setTimeContext);
-            this.timeContext.on('clock', this.setViewFromClock);
+            this.timeContext.on('clock', this.setTimeOptions);
         },
         stopFollowingTimeContext() {
             if (this.timeContext) {
                 this.timeContext.off('timeContext', this.setTimeContext);
-                this.timeContext.off('clock', this.setViewFromClock);
+                this.timeContext.off('clock', this.setTimeOptions);
             }
         },
-        setViewFromClock(clock) {
+        setTimeOptions(clock) {
-            if (!this.timeOptions.mode) {
+            this.timeOptions.clockOffsets = this.timeOptions.clockOffsets || this.timeContext.clockOffsets();
-                this.setTimeOptions(clock);
+            this.timeOptions.fixedOffsets = this.timeOptions.fixedOffsets || this.timeContext.bounds();
-            }
-        },
-        setTimeOptions() {
-            if (!this.timeOptions || !this.timeOptions.mode) {
-                this.mode = this.timeContext.clock() === undefined ? { key: 'fixed' } : { key: Object.create(this.timeContext.clock()).key};
-                this.timeOptions = {
-                    clockOffsets: this.timeContext.clockOffsets(),
-                    fixedOffsets: this.timeContext.bounds()
-                };
-            }
 
-            this.registerIndependentTimeOffsets();
+            if (!this.timeOptions.mode) {
+                this.mode = this.timeContext.clock() === undefined ? {key: 'fixed'} : {key: Object.create(this.timeContext.clock()).key};
+                this.registerIndependentTimeOffsets();
+            }
         },
         saveFixedOffsets(offsets) {
             const newOptions = Object.assign({}, this.timeOptions, {

src/plugins/timeConductor/independent/Mode.vue

@@ -20,7 +20,8 @@
 * at runtime from the About dialog for additional information.
 *****************************************************************************/
 <template>
-<div ref="modeMenuButton"
+<div v-if="modes.length > 1"
+     ref="modeMenuButton"
      class="c-ctrl-wrapper c-ctrl-wrapper--menus-up"
 >
     <div class="c-menu-button c-ctrl-wrapper c-ctrl-wrapper--menus-left">

src/ui/components/ObjectFrame.vue

@@ -160,7 +160,9 @@ export default {
         this.status = this.openmct.status.get(this.domainObject.identifier);
         this.removeStatusListener = this.openmct.status.observe(this.domainObject.identifier, this.setStatus);
         const provider = this.openmct.objectViews.get(this.domainObject, this.objectPath)[0];
-        this.$refs.objectView.show(this.domainObject, provider.key, false, this.objectPath);
+        if (provider) {
+            this.$refs.objectView.show(this.domainObject, provider.key, false, this.objectPath);
+        }
     },
     beforeDestroy() {
         this.removeStatusListener();
@@ -193,8 +195,10 @@ export default {
         },
         showMenuItems(event) {
             const sortedActions = this.openmct.actions._groupAndSortActions(this.menuActionItems);
-            const menuItems = this.openmct.menus.actionsToMenuItems(sortedActions, this.actionCollection.objectPath, this.actionCollection.view);
+            if (sortedActions.length) {
-            this.openmct.menus.showMenu(event.x, event.y, menuItems);
+                const menuItems = this.openmct.menus.actionsToMenuItems(sortedActions, this.actionCollection.objectPath, this.actionCollection.view);
+                this.openmct.menus.showMenu(event.x, event.y, menuItems);
+            }
         },
         setStatus(status) {
             this.status = status;