Remove Modern JS to match current style guide

remove npm lodash and unused scripts directory.  Removes usage of
lodash 3.10 in node files.

.circleci/config.yml

@@ -0,0 +1,40 @@
+version: 2
+jobs:
+  build:
+    docker:
+        - image: circleci/node:8-browsers
+          environment:
+            CHROME_BIN: "/usr/bin/google-chrome"
+    steps:
+        - checkout
+        - run:
+            name: Update npm
+            command: 'sudo npm install -g npm@latest'
+        - restore_cache:
+            key: dependency-cache-{{ checksum "package.json" }}-{{ checksum "bower.json" }}
+        - run:
+            name: Installing dependencies (npm install)
+            command: npm install
+        - save_cache:
+            key: dependency-cache-{{ checksum "package.json" }}-{{ checksum "bower.json" }}
+            paths:
+              - node_modules
+              - bower_components
+        - run:
+            name: npm run test
+            command: npm run test
+        - run:
+            name: npm run lint
+            command: npm run lint
+        - run:
+            name: npm run checkstyle
+            command: npm run checkstyle
+        - store_artifacts:
+            path: dist
+            prefix: dist
+
+workflows:
+  version: 2
+  test:
+    jobs:
+      - build

API.md

@@ -37,7 +37,7 @@
     - [Time Systems and Bounds](#time-systems-and-bounds)
       - [Defining and Registering Time Systems](#defining-and-registering-time-systems)
       - [Getting and Setting the Active Time System](#getting-and-setting-the-active-time-system)
-    - [Time Bounds](#time-bounds)
+      - [Time Bounds](#time-bounds)
     - [Clocks](#clocks)
       - [Defining and registering clocks](#defining-and-registering-clocks)
       - [Getting and setting active clock](#getting-and-setting-active-clock)
@@ -48,7 +48,10 @@
     - [The Time Conductor](#the-time-conductor)
       - [Time Conductor Configuration](#time-conductor-configuration)
       - [Example conductor configuration](#example-conductor-configuration)
-  - [Included Plugins](#included-plugins)
+  - [Indicators](#indicators)
+    - [The URL Status Indicator](#the-url-status-indicator)
+    - [Creating a Simple Indicator](#creating-a-simple-indicator)
+    - [Custom Indicators](#custom-indicators)
 
 <!-- END doctoc generated TOC please keep comment here to allow auto update -->
 
@@ -688,7 +691,7 @@ openmct.time.timeSystem(utcTimeSystem, bounds);
 Setting the active time system will trigger a [`'timeSystem'`](#time-events) 
 event.  If you supplied bounds, a [`'bounds'`](#time-events) event will be triggered afterwards with your newly supplied bounds.
 
-### Time Bounds
+#### Time Bounds
 
 The TimeAPI provides a getter/setter for querying and setting time bounds. Time 
 bounds are simply an object with a `start` and an end `end` attribute.
@@ -977,58 +980,68 @@ openmct.install(openmct.plugins.Conductor({
 }));
 ```
 
-## Included Plugins
+## Indicators
 
-Open MCT is packaged along with a few general-purpose plugins:
+Indicators are small widgets that reside at the bottom of the screen and are visible from 
+every screen in Open MCT. They can be used to convey system state using an icon and text.
+Typically an indicator will display an icon (customizable with a CSS class) that will 
+reveal additional information when the mouse cursor is hovered over it.
 
-* `openmct.plugins.Conductor` provides a user interface for working with time
-within the application. If activated, configuration must be provided. This is 
-detailed in the section on [Time Conductor Configuration](#time-conductor-configuration).
-* `openmct.plugins.CouchDB` is an adapter for using CouchDB for persistence
-  of user-created objects. This is a constructor that takes the URL for the
-  CouchDB database as a parameter, e.g.
-```javascript
-openmct.install(openmct.plugins.CouchDB('http://localhost:5984/openmct'))
-```
-* `openmct.plugins.Elasticsearch` is an adapter for using Elasticsearch for
-  persistence of user-created objects. This is a
-  constructor that takes the URL for the Elasticsearch instance as a
-  parameter. eg.
-```javascript
-openmct.install(openmct.plugins.CouchDB('http://localhost:9200'))
-```
-* `openmct.plugins.Espresso` and `openmct.plugins.Snow` are two different
-  themes (dark and light) available for Open MCT. Note that at least one
-  of these themes must be installed for Open MCT to appear correctly.
-* `openmct.plugins.URLIndicatorPlugin` adds an indicator which shows the
-availability of a URL with the following options: 
-  - `url` : URL to indicate the status of
-  - `cssClass`: Icon to show in the status bar, defaults to `icon-database`, [list of all icons](https://nasa.github.io/openmct/style-guide/#/browse/styleguide:home?view=items)
-  - `interval`: Interval between checking the connection, defaults to `10000`
-  - `label` Name showing up as text in the status bar, defaults to url
-```javascript
-openmct.install(openmct.plugins.URLIndicatorPlugin({
-  url: 'http://google.com',
-  cssClass: 'check',
-  interval: 10000,
-  label: 'Google'
- })
-);
-```
-* `openmct.plugins.LocalStorage` provides persistence of user-created
-  objects in browser-local storage. This is particularly useful in
-  development environments.
-* `openmct.plugins.MyItems` adds a top-level folder named "My Items"
-  when the application is first started, providing a place for a
-  user to store created items.
-* `openmct.plugins.UTCTimeSystem` provides a default time system for Open MCT.
+### The URL Status Indicator
 
-Generally, you will want to either install these plugins, or install
-different plugins that provide persistence and an initial folder
-hierarchy.
+A common use case for indicators is to convey the state of some external system such as a 
+persistence backend or HTTP server. So long as this system is accessible via HTTP request, 
+Open MCT provides a general purpose indicator to show whether the server is available and 
+returing a 2xx status code. The URL Status Indicator is made available as a default plugin. See
+the [documentation](./src/plugins/URLIndicatorPlugin) for details on how to install and configure the 
+URL Status Indicator.
+
+### Creating a Simple Indicator
+
+A simple indicator with an icon and some text can be created and added with minimal code. An indicator 
+of this type exposes functions for customizing the text, icon, and style of the indicator.
 
 eg.
-```javascript
-openmct.install(openmct.plugins.LocalStorage());
-openmct.install(openmct.plugins.MyItems());
+``` javascript
+var myIndicator = openmct.indicators.simpleIndicator();
+myIndicator.text("Hello World!");
+openmct.indicators.add(myIndicator);
 ```
+
+This will create a new indicator and add it to the bottom of the screen in Open MCT.
+By default, the indicator will appear as an information icon. Hovering over the icon will
+reveal the text set via the call to `.text()`. The Indicator object returned by the API 
+call exposes a number of functions for customizing the content and appearance of the indicator:
+
+* `.text([text])`: Gets or sets the text shown when the user hovers over the indicator.
+Accepts an __optional__ `string` argument that, if provided, will be used to set the text. 
+Hovering over the indicator will expand it to its full size, revealing this text alongside 
+the icon. Returns the currently set text as a `string`.
+* `.description([description])`: Gets or sets the indicator's description. Accepts an 
+__optional__ `string` argument that, if provided, will be used to set the text. The description 
+allows for more detail to be provided in a tooltip when the user hovers over the indicator. 
+Returns the currently set text as a `string`.
+* `.iconClass([className])`: Gets or sets the CSS class used to define the icon. Accepts an __optional__ 
+`string` parameter to be used to set the class applied to the indicator. Any of 
+[the built-in glyphs](https://nasa.github.io/openmct/style-guide/#/browse/styleguide:home/glyphs?view=styleguide.glyphs) 
+may be used here, or a custom CSS class can be provided. Returns the currently defined CSS 
+class as a `string`.
+* `.statusClass([className])`: Gets or sets the CSS class used to determine status. Accepts an __optional __
+`string` parameter to be used to set a status class applied to the indicator. May be used to apply 
+different colors to indicate status.
+
+### Custom Indicators
+
+A completely custom indicator can be added by simple providing a DOM element to place alongside other indicators.
+
+``` javascript
+    var domNode = document.createElement('div');
+    domNode.innerText = new Date().toString();
+    setInterval(function () {
+        domNode.innerText = new Date().toString();
+    }, 1000);
+
+    openmct.indicators.add({
+        element: domNode
+    });
+```

README.md

@@ -20,14 +20,8 @@ API. Open MCT is also being refactored to minimize the dependencies that using
 Open MCT imposes on developers, such as the current requirement to use
 AngularJS.
 
-This new API has not yet been heavily used and is likely to contain defects.
-You can help by trying it out, and reporting any issues you encounter
-using our GitHub issue tracker. Such issues may include bugs, suggestions,
-missing documentation, or even just requests for help if you're having
-trouble.
-
 We want Open MCT to be as easy to use, install, run, and develop for as
-possible, and your feedback will help us get there!
+possible, and your feedback will help us get there! Feedback can be provided via [GitHub issues](https://github.com/nasa/openmct/issues), or by emailing us at [arc-dl-openmct@nasa.gov](mailto:arc-dl-openmct@nasa.gov).
 
 ## Building and Running Open MCT Locally
 

app.js

@@ -19,6 +19,7 @@
 
     // Defaults
     options.port = options.port || options.p || 8080;
+    options.host = options.host || options.h || 'localhost'
     options.directory = options.directory || options.D || '.';
     ['include', 'exclude', 'i', 'x'].forEach(function (opt) {
         options[opt] = options[opt] || [];
@@ -78,7 +79,7 @@
     app.use(express['static'](options.directory));
 
     // Finally, open the HTTP server and log the instance to the console
-    app.listen(options.port, function() {
-        console.log('Open MCT application running at localhost:' + options.port)
+    app.listen(options.port, options.host, function() {
+        console.log('Open MCT application running at %s:%s', options.host, options.port)
     });
 }());

bower.json

@@ -22,7 +22,6 @@
     "eventemitter3": "^1.2.0",
     "lodash": "3.10.1",
     "almond": "~0.3.2",
-    "html2canvas": "^0.4.1",
     "moment-timezone": "^0.5.13"
   }
-}
+}

circle.yml

@@ -1,27 +0,0 @@
-machine:
-  node:
-    version: 8.11.0
-
-dependencies:
-  pre:
-    - npm install -g npm@latest
-
-deployment:
-  production:
-    branch: master
-    commands:
-        - npm install canvas nomnoml
-        - ./build-docs.sh
-  openmctweb-staging-deux:
-    branch: mobile
-    heroku:
-      appname: openmctweb-staging-deux
-test:
-  post:
-    - gulp lint
-    - gulp checkstyle
-
-general:
-  branches:
-    ignore:
-      - gh-pages

example/eventGenerator/bundle.js

@@ -60,8 +60,8 @@ define([
                         "source": "eventGenerator",
                         "domains": [
                             {
-                                "key": "time",
-                                "name": "Time",
+                                "key": "utc",
+                                "name": "Timestamp",
                                 "format": "utc"
                             }
                         ],

example/generator/GeneratorMetadataProvider.js

@@ -30,6 +30,7 @@ define([
                 {
                     key: "sin",
                     name: "Sine",
+                    formatString: '%0.2f',
                     hints: {
                         range: 1
                     }
@@ -37,6 +38,7 @@ define([
                 {
                     key: "cos",
                     name: "Cosine",
+                    formatString: '%0.2f',
                     hints: {
                         range: 2
                     }

example/generator/StateGeneratorProvider.js

@@ -72,7 +72,7 @@ define([
         var data = [];
         while (start <= end && data.length < 5000) {
             data.push(pointForTimestamp(start, duration, domainObject.name));
-            start += 5000;
+            start += duration;
         }
         return Promise.resolve(data);
     };

example/identity/bundle.js

@@ -38,7 +38,8 @@ define([
                     "provides": "identityService",
                     "type": "provider",
                     "depends": [
-                        "dialogService"
+                        "dialogService",
+                        "$q"
                     ]
                 }
             ]

example/identity/src/ExampleIdentityService.js

@@ -55,21 +55,37 @@ define(
          * @implements {IdentityService}
          * @memberof platform/identity
          */
-        function ExampleIdentityProvider(dialogService) {
-            // Handle rejected dialog messages by treating the
-            // current user as undefined.
-            function echo(v) { return v; }
-            function giveUndefined() { return undefined; }
+        function ExampleIdentityProvider(dialogService, $q) {
+            this.dialogService = dialogService;
+            this.$q = $q;
 
-            this.userPromise =
-                dialogService.getUserInput(DIALOG_STRUCTURE, DEFAULT_IDENTITY)
-                    .then(echo, giveUndefined);
+            this.returnUser = this.returnUser.bind(this);
+            this.returnUndefined = this.returnUndefined.bind(this);
         }
 
         ExampleIdentityProvider.prototype.getUser = function () {
-            return this.userPromise;
+            if (this.user) {
+                return this.$q.when(this.user);
+            } else {
+                return this.dialogService.getUserInput(DIALOG_STRUCTURE, DEFAULT_IDENTITY)
+                    .then(this.returnUser, this.returnUndefined);
+            }
         };
 
+        /**
+         * @private
+         */
+        ExampleIdentityProvider.prototype.returnUser = function (user) {
+            return this.user = user;
+        }
+
+        /**
+         * @private
+         */
+        ExampleIdentityProvider.prototype.returnUndefined = function () {
+            return undefined;
+        }
+
         return ExampleIdentityProvider;
     }
 );

example/notifications/res/dialog-launch.html

@@ -1,9 +1,9 @@
-<span class="status block" ng-controller="DialogLaunchController">
+<span class="h-indicator" ng-controller="DialogLaunchController">
     <!-- DO NOT ADD SPACES BETWEEN THE SPANS - IT ADDS WHITE SPACE!! -->
-    <span class="status-indicator icon-box-with-arrow"></span><span class="label">
-        <a ng-click="launchProgress(true)">Known</a> |
-        <a ng-click="launchProgress(false)">Unknown</a> |
-        <a ng-click="launchError()">Error</a> |
+    <div class="ls-indicator icon-box-with-arrow s-status-available"><span class="label">
+        <a ng-click="launchProgress(true)">Known</a>
+        <a ng-click="launchProgress(false)">Unknown</a>
+        <a ng-click="launchError()">Error</a>
         <a ng-click="launchInfo()">Info</a>
-    </span><span class="count"></span>
+    </span></div>
 </span>

example/notifications/res/notification-launch.html

@@ -1,9 +1,9 @@
-<span class="status block" ng-controller="NotificationLaunchController">
+<span class="h-indicator" ng-controller="NotificationLaunchController">
     <!-- DO NOT ADD SPACES BETWEEN THE SPANS - IT ADDS WHITE SPACE!! -->
-    <span class="status-indicator icon-bell"></span><span class="label">
-        <a ng-click="newInfo()">Success</a> |
-        <a ng-click="newError()">Error</a> |
-        <a ng-click="newAlert()">Alert</a> |
+    <div class="ls-indicator icon-bell s-status-available"><span class="label">
+        <a ng-click="newInfo()">Success</a>
+        <a ng-click="newError()">Error</a>
+        <a ng-click="newAlert()">Alert</a>
         <a ng-click="newProgress()">Progress</a>
-    </span><span class="count"></span>
+    </span></div>
 </span>

example/styleguide/res/sass/_style-guide-base.scss

@@ -58,7 +58,10 @@
         position: relative;
     }
 
-    .w-mct-example > div { margin-bottom: $interiorMarginLg; }
+    .w-mct-example {
+        color: #ccc;
+        > div { margin-bottom: $interiorMarginLg; }
+    }
 
     code,
     pre {

example/styleguide/res/templates/controls.html

@@ -149,12 +149,21 @@
         <h2>Local Controls</h2>
         <div class="cols cols1-1">
             <div class="col">
-                <p>Local controls are typically buttons and selects that provide local control to an individual element. Typically, these controls are hidden in order to not block data display until the user hovers their cursor over an element, when the controls are displayed using a transition fade. Mousing out of the element fades the controls from view.</p>
+                <p>Local controls are typically buttons and selects that provide actions in close proximity to a component.</p>
+                <p>These controls can optionally be hidden to reduce clutter until the user hovers their cursor over an enclosing element. To use this approach, apply the class <code>.has-local-controls</code> to the element that should be aware of the hover and ensure that element encloses <code>.h-local-controls</code>.</p>
             </div>
-            <mct-example><div class="plot-display-area" style="height: 100px; padding: 10px; position: relative;">Hover over me
-    <div class="l-local-controls gl-plot-local-controls t-plot-display-controls">
+            <mct-example><div class="plot-display-area" style="padding: 10px; position: relative;">
+                Some content in here
+    <div class="h-local-controls h-local-controls-overlay-content l-btn-set">
         <a class="s-button icon-arrow-left" title="Restore previous pan/zoom"></a>
-        <a class="s-button icon-arrows-out" title="Reset pan/zoom"></a>
+        <a class="s-button icon-reset" title="Reset pan/zoom"></a>
+    </div>
+</div>
+<div class="plot-display-area has-local-controls" style="padding: 10px; position: relative;">
+    Hover here
+    <div class="h-local-controls h-local-controls-overlay-content local-controls-hidden l-btn-set">
+        <a class="s-button icon-arrow-left" title="Restore previous pan/zoom"></a>
+        <a class="s-button icon-reset" title="Reset pan/zoom"></a>
     </div>
 </div></mct-example>
         </div>

example/styleguide/res/templates/status.html

@@ -20,12 +20,12 @@
  at runtime from the About dialog for additional information.
 -->
 <style>
-    .w-mct-example div[class*="s-limit"],
     .w-mct-example div[class*="s-status"],
-    .w-mct-example div[class*="s-unsynced"],
+    .w-mct-example span[class*="s-status"],
+    .w-mct-example div[class*="s-limit"],
     .w-mct-example span[class*="s-limit"] {
-        border-radius: 4px;
-        padding: 3px 7px;
+        border-radius: 3px;
+        padding: 2px 5px;
     }
     .w-mct-example table {
         width: 100%;
@@ -36,65 +36,12 @@
     <h1>Status Indication</h1>
 
     <div class="l-section">
-        <h2>Overview</h2>
-        <p>Many elements in Open MCT need to articulate a dynamic status; Open MCT provides the following styles and conventions to handle this:</p>
-        <ul>
-            <li><strong>Limits</strong>: when telemetry values exceed minimum or maximum values, they can be violating limits. Limit styles include both color and iconography; color is used to indicate severity while icons are used to indicate direction, upper or lower.</li>
-            <li><strong>Status</strong>: Open MCT also provides a number or built-in Status styles allowing telemetry or other displayed information to be visually classified by type. Common uses for these classes are to visually denote event records.</li>
-            <li><strong>Synchronization</strong>: When the system is displaying real-time data, it is very important that displays clearly indicate when they are not doing so, such as when a plot if frozen while panning or zooming. Open MCT provides a style for this.</li>
-        </ul>
-    </div>
-
-    <div class="l-section">
-        <h2>Limits</h2>
+        <h2>Status Classes</h2>
         <div class="cols cols1-1">
             <div class="col">
-                <p>Limit CSS classes can be applied to any block or inline element. Open MCT limit classes set color and optionally an icon, but don't effect other properties. Yellow and red limit classes can be used as is, or allow the application of any custom icon available in Open MCT's glyphs library. &quot;Level&quot; limit classes - upper and lower - always use an icon in addition to a color; Open MCT doesn't support level limits without color.</p>
-                <ul>
-                    <li>Color only</li>
-                    <ul>
-                        <li><code>s-limit-yellow</code>: A yellow limit.</li>
-                        <li><code>s-limit-red</code>: A red limit.</li>
-                    </ul>
-                    <li>Color and icon</li>
-                    <ul>
-                        <li><code>s-limit-yellow-icon</code>: A yellow limit with icon.</li>
-                        <li><code>s-limit-red-icon</code>: A red limit with icon.</li>
-                    </ul>
-                    <li>Upper and lower limit indicators. Must be used with a color limit class to be visible.</li>
-                    <ul>
-                        <li><code>s-limit-upr</code>: Upper limit.
-                        </li>
-                        <li><code>s-limit-lwr</code>: Lower limit.
-                        </li>
-                    </ul>
-                </ul>
-            </div>
-<mct-example><div class="s-limit-yellow">Yellow limit</div>
-<div class="s-limit-red">Red limit</div>
-<div class="s-limit-yellow-icon">Yellow limit with icon</div>
-<div class="s-limit-red-icon">Red limit with icon</div>
-<div class="s-limit-yellow s-limit-lwr">Lower yellow limit</div>
-<div class="s-limit-red s-limit-upr">Upper red limit</div>
-<div class="s-limit-red icon-bell">Red Limit with a custom icon</div>
-<div>Some text with an <span class="s-limit-yellow-icon">inline element</span> showing a yellow limit.</div>
-
-<!-- Limits applied in a table -->
-<table>
-    <tr class='header'><td>Name</td><td>Value 1</td><td>Value 2</td></tr>
-    <tr><td>ENG_PWR 4991</td><td>7.023</td><td class="s-limit-yellow s-limit-upr">70.23</td></tr>
-    <tr><td>ENG_PWR 4992</td><td>49.784</td><td class="s-limit-red s-limit-lwr">-121.22</td></tr>
-    <tr><td>ENG_PWR 4993</td><td class="s-limit-yellow icon-bell">0.451</td><td>1.007</td></tr>
-</table>
-</mct-example>
-        </div>
-    </div>
-
-    <div class="l-section">
-        <h2>Status</h2>
-        <div class="cols cols1-1">
-            <div class="col">
-                <p>Classes here can be applied to elements as needed.</p>
+                <p>Status classes allow any block or inline-block element to be decorated in order to articulate a
+                    status. Provided classes include color-only and color plus icon; custom icons can easily be
+                    employed by using a color-only status class in combination with an <a class="link" href="#/browse/styleguide:home/glyphs?tc.mode=local&tc.timeSystem=utc&tc.startDelta=1800000&tc.endDelta=0&view=styleguide.glyphs">glyph</a>.</p>
                 <ul>
                     <li>Color only</li>
                     <ul>
@@ -106,37 +53,175 @@
                     </ul>
                     <li>Color and icon</li>
                     <ul>
-                        <li><code>s-status-warning-hi-icon</code></li>
-                        <li><code>s-status-warning-lo-icon</code></li>
-                        <li><code>s-status-diagnostic-icon</code></li>
-                        <li><code>s-status-info-icon</code></li>
-                        <li><code>s-status-ok-icon</code></li>
+                        <li><code>s-status-icon-warning-hi</code></li>
+                        <li><code>s-status-icon-warning-lo</code></li>
+                        <li><code>s-status-icon-diagnostic</code></li>
+                        <li><code>s-status-icon-info</code></li>
+                        <li><code>s-status-icon-ok</code></li>
                     </ul>
                 </ul>
             </div>
-<mct-example><div class="s-status-warning-hi">WARNING HI</div>
+<mct-example><!-- Color alone examples -->
+<div class="s-status-warning-hi">WARNING HI</div>
 <div class="s-status-warning-lo">WARNING LOW</div>
 <div class="s-status-diagnostic">DIAGNOSTIC</div>
 <div class="s-status-info">INFO</div>
 <div class="s-status-ok">OK</div>
-<div class="s-status-warning-hi-icon">WARNING HI with icon</div>
-<div class="s-status-warning-lo-icon">WARNING LOW with icon</div>
-<div class="s-status-diagnostic-icon">DIAGNOSTIC with icon</div>
-<div class="s-status-info-icon">INFO with icon</div>
-<div class="s-status-ok-icon">OK with icon</div>
-<div class="s-status-warning-hi icon-gear">WARNING HI with custom icon</div>
+
+<!-- Color and icon examples -->
+<div class="s-status-icon-warning-hi">WARNING HI with icon</div>
+<div class="s-status-icon-warning-lo">WARNING LOW with icon</div>
+<div class="s-status-icon-diagnostic">DIAGNOSTIC with icon</div>
+<div class="s-status-icon-info">INFO with icon</div>
+<div class="s-status-icon-ok">OK with icon</div>
+<div class="s-status-warning-hi icon-alert-triangle">WARNING HI with custom icon</div>
+<div>Some text with an <span class="s-status-icon-diagnostic">inline element</span> showing a Diagnostic status.</div>
 </mct-example>
         </div>
     </div>
 
     <div class="l-section">
-        <h2>Synchronization</h2>
+        <h2>Limit Classes</h2>
         <div class="cols cols1-1">
             <div class="col">
-                <p>When the system is operating in real-time streaming mode, it is important for views that display real-time data to clearly articulate when they are not, such as when a user zooms or pans a plot view, freezing that view. In that case, the CSS class <code>s-unsynced</code> should be applied to that view.</p>
+                <p>Limit classes are a specialized form of status, specifically meant to be applied to telemetry
+                    displays to indicate that a limit threshold has been violated. Open MCT provides both severity
+                    and direction classes; severity (yellow and red) can be used alone or in combination
+                    with direction (upper or lower). Direction classes cannot be used on their own.</p>
+                <p>Like Status classes, Limits can be used as color-only, or color plus icon. Custom icons can
+                be applied in the same fashion as described above.</p>
+                <ul>
+                    <li>Severity color alone</li>
+                    <ul>
+                        <li><code>s-limit-yellow</code>: A yellow limit.</li>
+                        <li><code>s-limit-red</code>: A red limit.</li>
+                    </ul>
+                    <li>Severity color and icon</li>
+                    <ul>
+                        <li><code>s-limit-icon-yellow</code>: A yellow limit with icon.</li>
+                        <li><code>s-limit-icon-red</code>: A red limit with icon.</li>
+                    </ul>
+                    <li>Direction indicators. MUST be used with a &quot;color alone&quot; limit class. See
+                    examples for more.</li>
+                    <ul>
+                        <li><code>s-limit-upr</code>: Upper limit.</li>
+                        <li><code>s-limit-lwr</code>: Lower limit.</li>
+                    </ul>
+                </ul>
             </div>
-<mct-example><div class="s-unsynced">This element is unsynced</div>
+<mct-example><!-- Color alone examples -->
+<div class="s-limit-yellow">Yellow limit</div>
+<div class="s-limit-red">Red limit</div>
+
+<!-- Color and icon examples -->
+<div class="s-limit-icon-yellow">Yellow limit with icon</div>
+<div class="s-limit-icon-red">Red limit with icon</div>
+<div class="s-limit-red icon-alert-rect">Red Limit with a custom icon</div>
+<div>Some text with an <span class="s-limit-icon-yellow">inline element</span> showing a yellow limit.</div>
+
+<!-- Severity and direction examples -->
+<div class="s-limit-yellow s-limit-lwr">Lower yellow limit</div>
+<div class="s-limit-red s-limit-upr">Upper red limit</div>
+
+<!-- Limits applied in a table -->
+<table>
+    <tr class='header'><td>Name</td><td>Value 1</td><td>Value 2</td></tr>
+    <tr><td>ENG_PWR 4991</td><td>7.023</td><td class="s-limit-yellow s-limit-upr">70.23</td></tr>
+    <tr><td>ENG_PWR 4992</td><td>49.784</td><td class="s-limit-red s-limit-lwr">-121.22</td></tr>
+    <tr><td>ENG_PWR 4993</td><td class="s-limit-yellow icon-alert-triangle">0.451</td><td>1.007</td></tr>
+</table>
 </mct-example>
         </div>
     </div>
-</div>
+
+    <div class="l-section">
+        <h2>Status Bar Indicators</h2>
+        <div class="cols cols1-1">
+            <div class="col">
+                <p>Indicators are small iconic notification elements that appear in the Status Bar area of
+                    the application at the window's bottom. Indicators should be used to articulate the state of a
+                    system and optionally provide gestures related to that system. They use a combination of icon and
+                    color to identify themselves and articulate a state respectively.</p>
+                <h3>Recommendations</h3>
+                <ul>
+                    <li><strong>Keep the icon consistent</strong>. The icon is the principal identifier of the system and is a valuable
+                        recall aid for the user. Don't change the icon as a system's state changes, use color and
+                        text for that purpose.</li>
+                    <li><strong>Don't use the same icon more than once</strong>. Select meaningful and distinct icons so the user
+                        will be able to quickly identify what they're looking for.</li>
+                </ul>
+
+                <h3>States</h3>
+                <ul>
+                    <li><strong>Disabled</strong>: The system is not available to the user.</li>
+                    <li><strong>Off / Available</strong>: The system is accessible to the user but is not currently
+                        &quot;On&quot; or has not been configured. If the Indicator directly provides gestures
+                        related to the system, such as opening a configuration dialog box, then use
+                        &quot;Available&quot;; if the user must act elsewhere or the system isn't user-controllable,
+                        use &quot;Off&quot;.</li>
+                    <li><strong>On</strong>: The system is enabled or configured; it is having an effect on the larger application.</li>
+                    <li><strong>Alert / Error</strong>: There has been a problem with the system. Generally, &quot;Alert&quot;
+                        should be used to call attention to an issue that isn't critical, while  &quot;Error&quot;
+                        should be used to call attention to a problem that the user should really be aware of or do
+                        something about.</li>
+                </ul>
+
+                <h3>Structure</h3>
+                <p>Indicators consist of a <code>.ls-indicator</code>
+                    wrapper element with <code>.icon-*</code> classes for the type of thing they represent and
+                    <code>.s-status-*</code> classes to articulate the current state. Title attributes should be used
+                    to provide more verbose information about the thing and/or its status.</p>
+                <p>The wrapper encloses a <code>.label</code> element that is displayed on hover. This element should
+                    include a brief statement of the current status, and can also include clickable elements
+                    as <code>&lt;a&gt;</code> tags. An optional <code>.count</code> element can be included to display
+                    information such as a number of messages.</p>
+                <p>Icon classes are as defined on the
+                    <a class="link" href="#/browse/styleguide:home/glyphs?tc.mode=local&tc.timeSystem=utc&tc.startDelta=1800000&tc.endDelta=0&view=styleguide.glyphs">
+                        Glyphs page</a>. Status classes applicable to Indicators are as follows:</p>
+                <ul>
+                    <li><code>s-status-disabled</code></li>
+                    <li><code>s-status-off</code></li>
+                    <li><code>s-status-available</code></li>
+                    <li><code>s-status-on</code></li>
+                    <li><code>s-status-alert</code></li>
+                    <li><code>s-status-error</code></li>
+                </ul>
+            </div>
+<mct-example><div class="s-ue-bottom-bar status-holder s-status-bar">
+    <span class="ls-indicator icon-database s-status-disabled" title="The system is currently disabled.">
+        <span class="label">System not enabled.</span>
+    </span>
+</div>
+
+<div class="s-ue-bottom-bar status-holder s-status-bar">
+    <span class="ls-indicator icon-database s-status-available" title="Configure data connection.">
+        <span class="label">Data connection available
+            <a class="icon-gear">Configure</a>
+        </span>
+    </span>
+</div>
+
+<div class="s-ue-bottom-bar status-holder s-status-bar">
+    <span class="ls-indicator icon-database s-status-on" title="Data connected.">
+        <span class="label">Connected to Skynet
+            <a class="icon-gear">Change</a>
+            <a>Disconnect</a>
+        </span>
+    </span>
+</div>
+
+<div class="s-ue-bottom-bar status-holder s-status-bar">
+    <span class="ls-indicator icon-database s-status-alert" title="System is self-aware.">
+        <span class="label">Skynet at Turing Level 5</span>
+    </span>
+    <span class="ls-indicator icon-bell s-status-error" title="You have alerts.">
+        <span class="label">
+            <a class="icon-alert-triangle">View Alerts</a>
+        </span>
+        <span class="count">495</span>
+    </span>
+</div>
+</mct-example>
+        </div>
+    </div>
+</div>

example/worker/src/FibonacciIndicator.js

@@ -54,7 +54,7 @@ define(
                     return "icon-object-unknown";
                 },
                 getText: function () {
-                    return latest;
+                    return "" + latest;
                 },
                 getDescription: function () {
                     return "";

gulpfile.js

@@ -31,7 +31,6 @@ var gulp = require('gulp'),
     git = require('git-rev-sync'),
     moment = require('moment'),
     project = require('./package.json'),
-    _ = require('lodash'),
     paths = {
         main: 'openmct.js',
         dist: 'dist',
@@ -140,7 +139,7 @@ gulp.task('checkstyle', function () {
     var mkdirp = require('mkdirp');
     var reportName = 'jscs-html-report.html';
     var reportPath = path.resolve(paths.reports, 'checkstyle', reportName);
-    var moveReport = fs.rename.bind(fs, reportName, reportPath, _.noop);
+    var moveReport = fs.rename.bind(fs, reportName, reportPath, function () {});
 
     mkdirp.sync(path.resolve(paths.reports, 'checkstyle'));
 
@@ -179,4 +178,4 @@ gulp.task('install', [ 'assets', 'scripts' ]);
 
 gulp.task('verify', [ 'lint', 'test', 'checkstyle' ]);
 
-gulp.task('build', [ 'verify', 'install' ]);
+gulp.task('build', [ 'verify', 'install' ]);

index.html

@@ -69,11 +69,11 @@
                     ]
                 }));
                 openmct.install(openmct.plugins.SummaryWidget());
-                openmct.install(openmct.plugins.BarGraph());
-            
+                openmct.install(openmct.plugins.Notebook());
                 openmct.time.clock('local', {start: -THIRTY_MINUTES, end: 0});
                 openmct.time.timeSystem('utc');
                 openmct.start();
+                window.openmct = openmct;
             });
         </script>
         <link rel="stylesheet" href="platform/commonUI/general/res/css/startup-base.css">
@@ -82,8 +82,6 @@
         <link rel="icon" type="image/png" href="platform/commonUI/general/res/images/favicons/favicon-96x96.png" sizes="96x96">
         <link rel="icon" type="image/png" href="platform/commonUI/general/res/images/favicons/favicon-16x16.png" sizes="16x16">
         <link rel="shortcut icon" href="platform/commonUI/general/res/images/favicons/favicon.ico">
-
-        <link rel="stylesheet" href="src/plugins/barGraph/res/styles/barGraph.css">
     </head>
     <body>
         <div class="l-splash-holder s-splash-holder">

karma.conf.js

@@ -37,7 +37,10 @@ module.exports = function(config) {
             {pattern: 'bower_components/**/*.js', included: false},
             {pattern: 'node_modules/d3-*/**/*.js', included: false},
             {pattern: 'node_modules/vue/**/*.js', included: false},
+            {pattern: 'node_modules/printj/dist/*.js', included: false},
             {pattern: 'src/**/*', included: false},
+            {pattern: 'node_modules/painterro/build/*.js', included: false},
+            {pattern: 'node_modules/html2canvas/dist/*', included: false},
             {pattern: 'example/**/*.html', included: false},
             {pattern: 'example/**/*.js', included: false},
             {pattern: 'example/**/*.json', included: false},
@@ -62,7 +65,7 @@ module.exports = function(config) {
         // Test results reporter to use
         // Possible values: 'dots', 'progress'
         // Available reporters: https://npmjs.org/browse/keyword/karma-reporter
-        reporters: ['progress', 'coverage', 'html', 'junit'],
+        reporters: ['progress', 'coverage', 'html'],
 
         // Web server port.
         port: 9876,
@@ -78,7 +81,7 @@ module.exports = function(config) {
         // Specify browsers to run tests in.
         // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
         browsers: [
-            'Chrome'
+            'ChromeHeadless'
         ],
 
         // Code coverage reporting.
@@ -101,10 +104,6 @@ module.exports = function(config) {
             foldAll: false
         },
 
-        junitReporter: {
-            outputDir: process.env.CIRCLE_TEST_REPORTS || 'dist/reports/junit'
-        },
-
         // Continuous Integration mode.
         // If true, Karma captures browsers, runs the tests and exits.
         singleRun: true

openmct.js

@@ -29,7 +29,6 @@ requirejs.config({
         "csv": "bower_components/comma-separated-values/csv.min",
         "EventEmitter": "bower_components/eventemitter3/index",
         "es6-promise": "bower_components/es6-promise/es6-promise.min",
-        "html2canvas": "bower_components/html2canvas/build/html2canvas.min",
         "moment": "bower_components/moment/moment",
         "moment-duration-format": "bower_components/moment-duration-format/lib/moment-duration-format",
         "moment-timezone": "bower_components/moment-timezone/builds/moment-timezone-with-data",
@@ -42,15 +41,17 @@ requirejs.config({
         "lodash": "bower_components/lodash/lodash",
         "d3-selection": "node_modules/d3-selection/dist/d3-selection.min",
         "d3-scale": "node_modules/d3-scale/build/d3-scale.min",
-        "d3-axis": "node_modules/d3-axis/build/d3-axis.min",
-        "d3-array": "node_modules/d3-array/build/d3-array.min",
-        "d3-collection": "node_modules/d3-collection/build/d3-collection.min",
+        "d3-axis": "node_modules/d3-axis/dist/d3-axis.min",
+        "d3-array": "node_modules/d3-array/dist/d3-array.min",
+        "d3-collection": "node_modules/d3-collection/dist/d3-collection.min",
         "d3-color": "node_modules/d3-color/build/d3-color.min",
         "d3-format": "node_modules/d3-format/build/d3-format.min",
         "d3-interpolate": "node_modules/d3-interpolate/build/d3-interpolate.min",
-        "d3-time": "node_modules/d3-time/build/d3-time.min",
-        "d3-time-format": "node_modules/d3-time-format/build/d3-time-format.min",
-        "worldwind": "node_modules/@nasaworldwind/worldwind/build/dist/worldwind.min"
+        "d3-time": "node_modules/d3-time/dist/d3-time.min",
+        "d3-time-format": "node_modules/d3-time-format/dist/d3-time-format.min",
+        "html2canvas": "node_modules/html2canvas/dist/html2canvas.min",
+        "painterro": "node_modules/painterro/build/painterro.min",
+        "printj": "node_modules/printj/dist/printj.min"
     },
     "shim": {
         "angular": {
@@ -62,12 +63,12 @@ requirejs.config({
         "EventEmitter": {
             "exports": "EventEmitter"
         },
-        "html2canvas": {
-            "exports": "html2canvas"
-        },
         "moment-duration-format": {
             "deps": ["moment"]
         },
+        "painterro": {
+            "exports": "Painterro"
+        },
         "saveAs": {
             "exports": "saveAs"
         },
@@ -89,6 +90,9 @@ requirejs.config({
         },
         "d3-axis": {
             "exports": "d3-axis"
+        },
+        "dom-to-image": {
+            "exports": "domtoimage"
         }
     }
 });

package.json

@@ -1,9 +1,8 @@
 {
   "name": "openmct",
   "version": "0.14.0-SNAPSHOT",
-  "description": "The Open MCT core platform",
+  "description": "The Open MCT core platform.",
   "dependencies": {
-    "@nasaworldwind/worldwind": "^0.9.0",
     "d3-array": "1.2.x",
     "d3-axis": "1.0.x",
     "d3-collection": "1.0.x",
@@ -15,9 +14,8 @@
     "d3-time": "1.0.x",
     "d3-time-format": "2.1.x",
     "express": "^4.13.1",
-    "install": "^0.12.1",
     "minimist": "^1.1.1",
-    "npm": "^6.1.0",
+    "painterro": "^0.2.65",
     "request": "^2.69.0",
     "vue": "^2.5.6"
   },
@@ -33,25 +31,25 @@
     "gulp-requirejs-optimize": "^0.3.1",
     "gulp-sass": "^3.1.0",
     "gulp-sourcemaps": "^1.6.0",
-    "jasmine-core": "^2.3.0",
+    "html2canvas": "^1.0.0-alpha.12",
+    "jasmine-core": "^3.1.0",
     "jscs-html-reporter": "^0.1.0",
     "jsdoc": "^3.3.2",
     "jshint": "^2.7.0",
-    "karma": "^0.13.3",
-    "karma-chrome-launcher": "^0.1.12",
-    "karma-cli": "0.0.4",
-    "karma-coverage": "^0.5.3",
+    "karma": "^2.0.3",
+    "karma-chrome-launcher": "^2.2.0",
+    "karma-cli": "^1.0.1",
+    "karma-coverage": "^1.1.2",
     "karma-html-reporter": "^0.2.7",
-    "karma-jasmine": "^0.1.5",
-    "karma-junit-reporter": "^0.3.8",
-    "karma-requirejs": "^0.2.2",
-    "lodash": "^3.10.1",
+    "karma-jasmine": "^1.1.2",
+    "karma-requirejs": "^1.1.0",
     "markdown-toc": "^0.11.7",
     "marked": "^0.3.5",
     "merge-stream": "^1.0.0",
     "mkdirp": "^0.5.1",
     "moment": "^2.11.1",
     "node-bourbon": "^4.2.3",
+    "printj": "^1.1.0",
     "requirejs": "2.1.x",
     "split": "^1.0.0",
     "v8-compile-cache": "^1.1.0"
@@ -60,6 +58,8 @@
     "start": "node app.js",
     "test": "karma start --single-run",
     "jshint": "jshint platform example",
+    "lint": "./node_modules/gulp/bin/gulp.js lint",
+    "checkstyle": "./node_modules/gulp/bin/gulp.js checkstyle",
     "watch": "karma start",
     "jsdoc": "jsdoc -c jsdoc.json -R API.md -r -d dist/docs/api",
     "otherdoc": "node docs/gendocs.js --in docs/src --out dist/docs --suppress-toc 'docs/src/index.md|docs/src/process/index.md'",

platform/commonUI/browse/res/templates/browse.html

@@ -65,7 +65,7 @@
                         <div class='split-pane-component t-object pane primary-pane left'>
                             <mct-representation mct-object="navigatedObject"
                                                 key="navigatedObject.getCapability('status').get('editing') ? 'edit-object' : 'browse-object'"
-                                                class="abs holder holder-object">
+                                                class="abs holder holder-object t-main-view">
                             </mct-representation>
                             <a class="mini-tab-icon anchor-right mobile-hide toggle-pane toggle-inspect flush-right"
                                title="{{ modelPaneInspect.visible()? 'Hide' : 'Show' }} the Inspection pane"

platform/commonUI/browse/res/templates/browse/object-properties.html

@@ -19,41 +19,46 @@
  this source code distribution or the Licensing information page available
  at runtime from the About dialog for additional information.
 -->
-<div ng-controller="ObjectInspectorController as controller">
-    <ul class="flex-elem grows l-inspector-part">
-        <li>
-            <em class="t-inspector-part-header">Properties</em>
-            <div class="inspector-properties"
-                 ng-repeat="data in metadata"
-                 ng-class="{ first:$index === 0 }">
-                <div class="label">{{ data.name }}</div>
-                <div class="value">{{ data.value }}</div>
+<div ng-controller="ObjectInspectorController as controller" class="grid-properties">
+    <ul class="l-inspector-part">
+        <h2 class="first">Properties</h2>
+        <li class="t-repeat grid-row"
+             ng-repeat="data in metadata"
+             ng-class="{ first:$index === 0 }">
+            <div class="grid-cell label">{{ data.name }}</div>
+            <div class="grid-cell value">{{ data.value }}</div>
+        </li>
+    </ul>
+
+    <ul class="l-inspector-part" ng-if="contextutalParents.length > 0">
+        <h2 title="The location of this linked object.">Location</h2>
+        <li class="grid-row">
+            <div class="label" ng-if="primaryParents.length > 0">This Link</div>
+            <div class="grid-cell value">
+                <div class="t-repeat inspector-location"
+                     ng-repeat="parent in contextutalParents"
+                     ng-class="{ last:($index + 1) === contextualParents.length }">
+                    <mct-representation key="'label'"
+                                        mct-object="parent"
+                                        ng-click="parent.getCapability('action').perform('navigate')"
+                                        class="location-item">
+                    </mct-representation>
+                </div>
             </div>
         </li>
-        <li ng-if="contextutalParents.length > 0">
-            <em class="t-inspector-part-header" title="The location of this linked object.">Location</em>
-            <div ng-if="primaryParents.length > 0" class="section-header">This Object</div>
-            <span class="inspector-location"
-                  ng-repeat="parent in contextutalParents"
-                  ng-class="{ last:($index + 1) === contextualParents.length }">
-                <mct-representation key="'label'"
-                                    mct-object="parent"
-                                    ng-click="parent.getCapability('action').perform('navigate')"
-                                    class="location-item">
-                </mct-representation>
-            </span>
-        </li>
-        <li ng-if="primaryParents.length > 0">
-            <div class="section-header">Object's Original</div>
-            <span class="inspector-location"
-                  ng-repeat="parent in primaryParents"
-                  ng-class="{ last:($index + 1) === primaryParents.length }">
-                <mct-representation key="'label'"
-                                    mct-object="parent"
-                                    ng-click="parent.getCapability('action').perform('navigate')"
-                                    class="location-item">
-                </mct-representation>
-            </span>
+        <li class="grid-row" ng-if="primaryParents.length > 0">
+            <div class="grid-cell label">Original</div>
+            <div class="grid-cell value">
+                <div class="t-repeat inspector-location value"
+                     ng-repeat="parent in primaryParents"
+                     ng-class="{ last:($index + 1) === primaryParents.length }">
+                    <mct-representation key="'label'"
+                                        mct-object="parent"
+                                        ng-click="parent.getCapability('action').perform('navigate')"
+                                        class="location-item">
+                    </mct-representation>
+                </div>
+            </div>
         </li>
     </ul>
 </div>

platform/commonUI/browse/src/BrowseController.js

@@ -47,8 +47,8 @@ define(
             urlService,
             defaultPath
         ) {
-            var initialPath = ($route.current.params.ids || defaultPath).split("/");
-            var currentIds;
+            var initialPath = ($route.current.params.ids || defaultPath).split("/"),
+                currentIds;
 
             $scope.treeModel = {
                 selectedObject: undefined,
@@ -56,7 +56,24 @@ define(
                     navigationService.setNavigation(object, true);
                 },
                 allowSelection: function (object) {
-                    return navigationService.shouldNavigate();
+                    var domainObjectInView = navigationService.getNavigation(),
+                        isInEditMode = domainObjectInView.getCapability('status').get('editing');
+
+                    if (isInEditMode) {
+
+                        var actions = object.getCapability('action'),
+                            previewAction = actions.getActions({key: 'mct-preview-action'})[0];
+
+                        if (previewAction && previewAction.perform) {
+                            previewAction.perform();
+                            return false;
+                        } else {
+                            return navigationService.shouldNavigate();
+                        }
+
+                    } else {
+                        return true;
+                    }
                 }
             };
 

platform/commonUI/browse/src/navigation/NavigationService.js

@@ -162,7 +162,6 @@ define(
          */
         NavigationService.prototype.shouldWarnBeforeNavigate = function () {
             var reasons = [];
-
             this.checks.forEach(function (checkFn) {
                 var reason = checkFn();
                 if (reason) {

platform/commonUI/browse/test/BrowseControllerSpec.js

@@ -19,6 +19,7 @@
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
+/*global console*/
 
 /**
  * MCTRepresentationSpec. Created by vwoeltje on 11/6/14.
@@ -48,9 +49,19 @@ define(
                 controller;
 
             function waitsForNavigation() {
-                var calls = mockNavigationService.setNavigation.calls.length;
-                waitsFor(function () {
-                    return mockNavigationService.setNavigation.calls.length > calls;
+                return new Promise(function (resolve) {
+                    mockNavigationService.setNavigation.and.callFake(function (obj) {
+                        var returnValue;
+                        try {
+                            returnValue = NavigationService.prototype.setNavigation.call(mockNavigationService, obj);
+                        } catch (err) {
+                            console.error(err);
+                            //Not rejecting because 'setNavigation' has been called, which is what's being tested here.
+                            //Rejecting will fail tests.
+                        }
+                        resolve();
+                        return returnValue;
+                    });
                 });
             }
 
@@ -78,7 +89,7 @@ define(
                     "urlService",
                     ["urlForLocation"]
                 );
-                mockUrlService.urlForLocation.andCallFake(function (mode, object) {
+                mockUrlService.urlForLocation.and.callFake(function (mode, object) {
                     if (object === mockDefaultRootObject) {
                         return [mode, testDefaultRoot].join('/');
                     }
@@ -106,7 +117,7 @@ define(
                     "removeListener"
                 ].forEach(function (method) {
                     spyOn(mockNavigationService, method)
-                        .andCallThrough();
+                        .and.callThrough();
                 });
                 mockRootObject = jasmine.createSpyObj(
                     "rootObjectContainer",
@@ -124,60 +135,58 @@ define(
                     "nestedDomainObject",
                     ["getId", "getCapability", "getModel", "useCapability", "hasCapability"]
                 );
-                mockObjectService.getObjects.andReturn(Promise.resolve({
+                mockObjectService.getObjects.and.returnValue(Promise.resolve({
                     ROOT: mockRootObject
                 }));
-                mockRootObject.useCapability.andReturn(Promise.resolve([
+                mockRootObject.useCapability.and.returnValue(Promise.resolve([
                     mockOtherDomainObject,
                     mockDefaultRootObject
                 ]));
-                mockRootObject.hasCapability.andReturn(true);
-                mockDefaultRootObject.useCapability.andReturn(Promise.resolve([
+                mockRootObject.hasCapability.and.returnValue(true);
+                mockDefaultRootObject.useCapability.and.returnValue(Promise.resolve([
                     mockNextObject
                 ]));
-                mockDefaultRootObject.hasCapability.andReturn(true);
-                mockOtherDomainObject.hasCapability.andReturn(false);
-                mockNextObject.useCapability.andReturn(undefined);
-                mockNextObject.hasCapability.andReturn(false);
-                mockNextObject.getId.andReturn("next");
-                mockDefaultRootObject.getId.andReturn(testDefaultRoot);
+                mockDefaultRootObject.hasCapability.and.returnValue(true);
+                mockOtherDomainObject.hasCapability.and.returnValue(false);
+                mockNextObject.useCapability.and.returnValue(undefined);
+                mockNextObject.hasCapability.and.returnValue(false);
+                mockNextObject.getId.and.returnValue("next");
+                mockDefaultRootObject.getId.and.returnValue(testDefaultRoot);
 
                 instantiateController();
-                waitsForNavigation();
+                return waitsForNavigation();
             });
 
             it("uses composition to set the navigated object, if there is none", function () {
                 instantiateController();
-                waitsForNavigation();
-                runs(function () {
+                return waitsForNavigation().then(function () {
                     expect(mockNavigationService.setNavigation)
-                        .toHaveBeenCalledWith(mockDefaultRootObject);
+                    .toHaveBeenCalledWith(mockDefaultRootObject);
                 });
             });
 
             it("navigates to a root-level object, even when default path is not found", function () {
                 mockDefaultRootObject.getId
-                    .andReturn("something-other-than-the-" + testDefaultRoot);
+                    .and.returnValue("something-other-than-the-" + testDefaultRoot);
                 instantiateController();
 
-                waitsForNavigation();
-                runs(function () {
+                return waitsForNavigation().then(function () {
                     expect(mockNavigationService.setNavigation)
-                        .toHaveBeenCalledWith(mockDefaultRootObject);
+                    .toHaveBeenCalledWith(mockDefaultRootObject);
                 });
+            });
 
-            });
-            //
             it("does not try to override navigation", function () {
-                mockNavigationService.getNavigation.andReturn(mockDefaultRootObject);
+                mockNavigationService.getNavigation.and.returnValue(mockDefaultRootObject);
                 instantiateController();
-                waitsForNavigation();
-                expect(mockScope.navigatedObject).toBe(mockDefaultRootObject);
+                return waitsForNavigation().then(function () {
+                    expect(mockScope.navigatedObject).toBe(mockDefaultRootObject);
+                });
             });
-            //
+
             it("updates scope when navigated object changes", function () {
                 // Should have registered a listener - call it
-                mockNavigationService.addListener.mostRecentCall.args[0](
+                mockNavigationService.addListener.calls.mostRecent().args[0](
                     mockOtherDomainObject
                 );
                 expect(mockScope.navigatedObject).toEqual(mockOtherDomainObject);
@@ -189,19 +198,18 @@ define(
                     "$destroy",
                     jasmine.any(Function)
                 );
-                mockScope.$on.mostRecentCall.args[1]();
+                mockScope.$on.calls.mostRecent().args[1]();
 
                 // Should remove the listener it added earlier
                 expect(mockNavigationService.removeListener).toHaveBeenCalledWith(
-                    mockNavigationService.addListener.mostRecentCall.args[0]
+                    mockNavigationService.addListener.calls.mostRecent().args[0]
                 );
             });
 
             it("uses route parameters to choose initially-navigated object", function () {
                 mockRoute.current.params.ids = testDefaultRoot + "/next";
                 instantiateController();
-                waitsForNavigation();
-                runs(function () {
+                return waitsForNavigation().then(function () {
                     expect(mockScope.navigatedObject).toBe(mockNextObject);
                     expect(mockNavigationService.setNavigation)
                         .toHaveBeenCalledWith(mockNextObject);
@@ -214,12 +222,10 @@ define(
                 // it hits an invalid ID.
                 mockRoute.current.params.ids = testDefaultRoot + "/junk";
                 instantiateController();
-                waitsForNavigation();
-                runs(function () {
+                return waitsForNavigation().then(function () {
                     expect(mockScope.navigatedObject).toBe(mockDefaultRootObject);
                     expect(mockNavigationService.setNavigation)
                         .toHaveBeenCalledWith(mockDefaultRootObject);
-
                 });
             });
 
@@ -229,8 +235,7 @@ define(
                 // should stop at it since remaining IDs cannot be loaded.
                 mockRoute.current.params.ids = testDefaultRoot + "/next/junk";
                 instantiateController();
-                waitsForNavigation();
-                runs(function () {
+                return waitsForNavigation().then(function () {
                     expect(mockScope.navigatedObject).toBe(mockNextObject);
                     expect(mockNavigationService.setNavigation)
                         .toHaveBeenCalledWith(mockNextObject);
@@ -244,11 +249,11 @@ define(
                 expect(mockRoute.current.pathParams.ids)
                     .not
                     .toBe(testDefaultRoot + '/next');
-                mockLocation.path.andCallFake(function () {
+                mockLocation.path.and.callFake(function () {
                     expect(mockRoute.current.pathParams.ids)
                         .toBe(testDefaultRoot + '/next');
                 });
-                mockNavigationService.addListener.mostRecentCall.args[0](
+                mockNavigationService.addListener.calls.mostRecent().args[0](
                     mockNextObject
                 );
                 expect(mockLocation.path).toHaveBeenCalledWith(

platform/commonUI/browse/test/BrowseObjectControllerSpec.js

@@ -20,7 +20,6 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
-
 define(
     ["../src/BrowseObjectController"],
     function (BrowseObjectController) {
@@ -33,7 +32,7 @@ define(
 
             // Utility function; look for a $watch on scope and fire it
             function fireWatch(expr, value) {
-                mockScope.$watch.calls.forEach(function (call) {
+                mockScope.$watch.calls.all().forEach(function (call) {
                     if (call.args[0] === expr) {
                         call.args[1](value);
                     }
@@ -50,7 +49,7 @@ define(
                     "$location",
                     ["path", "search"]
                 );
-                mockLocation.search.andReturn({});
+                mockLocation.search.and.returnValue({});
 
                 controller = new BrowseObjectController(
                     mockScope,
@@ -65,7 +64,7 @@ define(
 
                 // Allows the path index to be checked
                 // prior to setting $route.current
-                mockLocation.path.andReturn("/browse/");
+                mockLocation.path.and.returnValue("/browse/");
             });
 
             it("sets the active view from query parameters", function () {
@@ -79,10 +78,10 @@ define(
                         { key: 'xyz' }
                     ];
 
-                mockDomainObject.useCapability.andCallFake(function (c) {
+                mockDomainObject.useCapability.and.callFake(function (c) {
                     return (c === 'view') && testViews;
                 });
-                mockLocation.search.andReturn({ view: 'def' });
+                mockLocation.search.and.returnValue({ view: 'def' });
 
                 fireWatch('domainObject', mockDomainObject);
                 expect(mockScope.representation.selected)

platform/commonUI/browse/test/InspectorPaneControllerSpec.js

@@ -50,14 +50,14 @@ define(
                     "navigationService",
                     ["getNavigation", "addListener"]
                 );
-                mockNavigationService.addListener.andReturn(mockNavigationUnlistener);
+                mockNavigationService.addListener.and.returnValue(mockNavigationUnlistener);
 
                 mockStatusUnlistener = jasmine.createSpy("statusUnlistener");
                 mockStatusCapability = jasmine.createSpyObj(
                     "statusCapability",
                     ["listen"]
                 );
-                mockStatusCapability.listen.andReturn(mockStatusUnlistener);
+                mockStatusCapability.listen.and.returnValue(mockStatusUnlistener);
 
                 mockDomainObject = jasmine.createSpyObj(
                     'domainObject',
@@ -68,13 +68,13 @@ define(
                         'hasCapability'
                     ]
                 );
-                mockDomainObject.getId.andReturn("domainObject");
-                mockDomainObject.getModel.andReturn({});
-                mockDomainObject.hasCapability.andReturn(true);
-                mockDomainObject.getCapability.andReturn(mockStatusCapability);
+                mockDomainObject.getId.and.returnValue("domainObject");
+                mockDomainObject.getModel.and.returnValue({});
+                mockDomainObject.hasCapability.and.returnValue(true);
+                mockDomainObject.getCapability.and.returnValue(mockStatusCapability);
 
                 mockLocation = jasmine.createSpyObj('location', ['search']);
-                mockLocation.search.andReturn({});
+                mockLocation.search.and.returnValue({});
 
                 mockAttrs = {};
 
@@ -84,7 +84,7 @@ define(
             it("listens for changes to navigation and attaches a status" +
                 " listener", function () {
                 expect(mockNavigationService.addListener).toHaveBeenCalledWith(jasmine.any(Function));
-                mockNavigationService.addListener.mostRecentCall.args[0](mockDomainObject);
+                mockNavigationService.addListener.calls.mostRecent().args[0](mockDomainObject);
                 expect(mockStatusCapability.listen).toHaveBeenCalledWith(jasmine.any(Function));
             });
 
@@ -93,8 +93,8 @@ define(
                 controller.toggle();
                 // test pre-condition that inspector is hidden
                 expect(controller.visible()).toBe(false);
-                mockNavigationService.addListener.mostRecentCall.args[0](mockDomainObject);
-                mockStatusCapability.listen.mostRecentCall.args[0](["editing"]);
+                mockNavigationService.addListener.calls.mostRecent().args[0](mockDomainObject);
+                mockStatusCapability.listen.calls.mostRecent().args[0](["editing"]);
                 expect(controller.visible()).toBe(true);
             });
 

platform/commonUI/browse/test/MenuArrowControllerSpec.js

@@ -60,8 +60,8 @@ define(
                 mockActionContext.domainObject = mockDomainObject;
                 mockActionContext.event = mockEvent;
                 mockScope.domainObject = mockDomainObject;
-                mockDomainObject.getCapability.andReturn(mockContextMenuAction);
-                mockContextMenuAction.perform.andReturn(jasmine.any(Function));
+                mockDomainObject.getCapability.and.returnValue(mockContextMenuAction);
+                mockContextMenuAction.perform.and.returnValue(jasmine.any(Function));
 
                 controller = new MenuArrowController(mockScope);
             });

platform/commonUI/browse/test/ObjectHeaderControllerSpec.js

@@ -39,7 +39,7 @@ define(
                 mockMutationCapability = jasmine.createSpyObj("mutation", ["mutate"]);
                 mockTypeCapability = jasmine.createSpyObj("type", ["typeDef", "hasFeature"]);
                 mockTypeCapability.typeDef = { name: ""};
-                mockTypeCapability.hasFeature.andCallFake(function (feature) {
+                mockTypeCapability.hasFeature.and.callFake(function (feature) {
                     return feature === 'creation';
                 });
 
@@ -52,8 +52,8 @@ define(
                     name: "Test name"
                 };
                 mockDomainObject = jasmine.createSpyObj("domainObject", ["getCapability", "getModel"]);
-                mockDomainObject.getModel.andReturn(model);
-                mockDomainObject.getCapability.andCallFake(function (key) {
+                mockDomainObject.getModel.and.returnValue(model);
+                mockDomainObject.getCapability.and.callFake(function (key) {
                     return mockCapabilities[key];
                 });
 
@@ -62,7 +62,7 @@ define(
                 };
 
                 mockCurrentTarget = jasmine.createSpyObj("currentTarget", ["blur", "textContent"]);
-                mockCurrentTarget.blur.andReturn(mockCurrentTarget);
+                mockCurrentTarget.blur.and.returnValue(mockCurrentTarget);
 
                 mockEvent = {
                     which: {},
@@ -109,7 +109,7 @@ define(
 
                 expect(mockMutationCapability.mutate).toHaveBeenCalledWith(jasmine.any(Function));
 
-                mockMutationCapability.mutate.mostRecentCall.args[0](model);
+                mockMutationCapability.mutate.calls.mostRecent().args[0](model);
 
                 expect(mockDomainObject.getModel().name).toBe("New name");
             });
@@ -127,7 +127,7 @@ define(
             });
 
             it("disallows editting name when object is non-creatable", function () {
-                mockTypeCapability.hasFeature.andReturn(false);
+                mockTypeCapability.hasFeature.and.returnValue(false);
 
                 expect(controller.allowEdit()).toBe(false);
 

platform/commonUI/browse/test/PaneControllerSpec.js

@@ -53,8 +53,8 @@ define(
                         ['getId', 'getModel', 'getCapability']
                     );
 
-                    mockDomainObject.getId.andReturn(id);
-                    mockDomainObject.getModel.andReturn({});
+                    mockDomainObject.getId.and.returnValue(id);
+                    mockDomainObject.getModel.and.returnValue({});
 
                     return mockDomainObject;
                 });
@@ -65,7 +65,7 @@ define(
                 mockWindow = jasmine.createSpyObj("$window", ["open"]);
 
                 mockLocation = jasmine.createSpyObj('location', ['search']);
-                mockLocation.search.andReturn({});
+                mockLocation.search.and.returnValue({});
 
                 mockAttrs = {};
             });
@@ -83,9 +83,9 @@ define(
             });
 
             it("collapses on navigation changes on portrait-oriented phones", function () {
-                mockAgentService.isMobile.andReturn(true);
-                mockAgentService.isPhone.andReturn(true);
-                mockAgentService.isPortrait.andReturn(true);
+                mockAgentService.isMobile.and.returnValue(true);
+                mockAgentService.isPhone.and.returnValue(true);
+                mockAgentService.isPortrait.and.returnValue(true);
                 controller = instantiateController();
                 expect(controller.visible()).toBeTruthy();
 
@@ -102,13 +102,13 @@ define(
                 });
 
                 it("sets pane state to false when in location.search", function () {
-                    mockLocation.search.andReturn({'hideTree': true});
+                    mockLocation.search.and.returnValue({'hideTree': true});
                     expect(instantiateController().visible()).toBe(false);
                     expect(mockLocation.search).toHaveBeenCalledWith('hideTree', undefined);
                 });
 
                 it("sets state to true when not found in location.search", function () {
-                    mockLocation.search.andReturn({});
+                    mockLocation.search.and.returnValue({});
                     expect(instantiateController().visible()).toBe(true);
                     expect(mockLocation.search).not.toHaveBeenCalledWith('hideTree', undefined);
                 });

platform/commonUI/browse/test/navigation/NavigateActionSpec.js

@@ -34,17 +34,6 @@ define([
             mockDomainObject,
             action;
 
-
-        function waitForCall() {
-            var called = false;
-            waitsFor(function () {
-                return called;
-            });
-            return function () {
-                called = true;
-            };
-        }
-
         beforeEach(function () {
             mockNavigationService = jasmine.createSpyObj(
                 "navigationService",
@@ -63,26 +52,24 @@ define([
         });
 
         it("sets navigation if it is allowed", function () {
-            mockNavigationService.shouldNavigate.andReturn(true);
-            action.perform()
-                .then(waitForCall());
-            runs(function () {
-                expect(mockNavigationService.setNavigation)
+            mockNavigationService.shouldNavigate.and.returnValue(true);
+            return action.perform()
+                .then(function () {
+                    expect(mockNavigationService.setNavigation)
                     .toHaveBeenCalledWith(mockDomainObject, true);
-            });
+                });
         });
 
         it("does not set navigation if it is not allowed", function () {
-            mockNavigationService.shouldNavigate.andReturn(false);
+            mockNavigationService.shouldNavigate.and.returnValue(false);
             var onSuccess = jasmine.createSpy('onSuccess');
-            action.perform()
-                .then(onSuccess, waitForCall());
-            runs(function () {
-                expect(onSuccess).not.toHaveBeenCalled();
-                expect(mockNavigationService.setNavigation)
-                    .not
-                    .toHaveBeenCalledWith(mockDomainObject);
-            });
+            return action.perform()
+                .then(onSuccess, function () {
+                    expect(onSuccess).not.toHaveBeenCalled();
+                    expect(mockNavigationService.setNavigation)
+                        .not
+                        .toHaveBeenCalledWith(mockDomainObject);
+                });
         });
 
         it("is only applicable when a domain object is in context", function () {

platform/commonUI/browse/test/navigation/NavigationServiceSpec.js

@@ -69,7 +69,7 @@ define(
                 navigationService.addListener(callback);
                 navigationService.setNavigation(testObject);
                 navigationService.setNavigation(testObject);
-                expect(callback.calls.length).toEqual(1);
+                expect(callback.calls.count()).toEqual(1);
             });
 
             it("stops notifying listeners after removal", function () {

platform/commonUI/browse/test/navigation/OrphanNavigationHandlerSpec.js

@@ -65,34 +65,35 @@ define([
             mockActionCapability = jasmine.createSpyObj('action', ['perform']);
             mockEditor = jasmine.createSpyObj('editor', ['isEditContextRoot']);
 
-            mockThrottle.andCallFake(function (fn) {
+            mockThrottle.and.callFake(function (fn) {
                 var mockThrottledFn =
                     jasmine.createSpy('throttled-' + mockThrottledFns.length);
-                mockThrottledFn.andCallFake(fn);
+                mockThrottledFn.and.callFake(fn);
                 mockThrottledFns.push(mockThrottledFn);
                 return mockThrottledFn;
             });
-            mockTopic.andReturn(mockMutationTopic);
-            mockDomainObject.getId.andReturn(testId);
-            mockDomainObject.getCapability.andCallFake(function (c) {
+            mockTopic.and.returnValue(mockMutationTopic);
+            mockDomainObject.getId.and.returnValue(testId);
+            mockDomainObject.getCapability.and.callFake(function (c) {
                 return {
                     context: mockContext,
                     editor: mockEditor
                 }[c];
             });
-            mockDomainObject.hasCapability.andCallFake(function (c) {
+            mockDomainObject.hasCapability.and.callFake(function (c) {
                 return !!mockDomainObject.getCapability(c);
             });
-            mockParentObject.getCapability.andCallFake(function (c) {
+            mockParentObject.getCapability.and.callFake(function (c) {
                 return {
                     action: mockActionCapability
                 }[c];
             });
             testParentComposition = [];
-            mockParentObject.useCapability.andReturn(Promise.resolve(testParentComposition));
-            mockContext.getParent.andReturn(mockParentObject);
-            mockNavigationService.getNavigation.andReturn(mockDomainObject);
-            mockEditor.isEditContextRoot.andReturn(false);
+            mockParentObject.useCapability.and.returnValue(Promise.resolve(testParentComposition));
+
+            mockContext.getParent.and.returnValue(mockParentObject);
+            mockNavigationService.getNavigation.and.returnValue(mockDomainObject);
+            mockEditor.isEditContextRoot.and.returnValue(false);
 
             return new OrphanNavigationHandler(
                 mockThrottle,
@@ -106,7 +107,7 @@ define([
             expect(mockMutationTopic.listen)
                 .toHaveBeenCalledWith(jasmine.any(Function));
             expect(mockThrottledFns.indexOf(
-                mockMutationTopic.listen.mostRecentCall.args[0]
+                mockMutationTopic.listen.calls.mostRecent().args[0]
             )).not.toEqual(-1);
         });
 
@@ -114,7 +115,7 @@ define([
             expect(mockNavigationService.addListener)
                 .toHaveBeenCalledWith(jasmine.any(Function));
             expect(mockThrottledFns.indexOf(
-                mockNavigationService.addListener.mostRecentCall.args[0]
+                mockNavigationService.addListener.calls.mostRecent().args[0]
             )).not.toEqual(-1);
         });
 
@@ -134,28 +135,14 @@ define([
                     function itNavigatesAsExpected() {
                         if (isOrphan && !isEditRoot) {
                             it("navigates to the parent", function () {
-                                var done = false;
-                                waitsFor(function () {
-                                    return done;
-                                });
-                                setTimeout(function () {
-                                    done = true;
-                                }, 5);
-                                runs(function () {
+                                return Promise.resolve().then(function () {
                                     expect(mockActionCapability.perform)
                                         .toHaveBeenCalledWith('navigate');
                                 });
                             });
                         } else {
                             it("does nothing", function () {
-                                var done = false;
-                                waitsFor(function () {
-                                    return done;
-                                });
-                                setTimeout(function () {
-                                    done = true;
-                                }, 5);
-                                runs(function () {
+                                return Promise.resolve().then(function () {
                                     expect(mockActionCapability.perform)
                                         .not.toHaveBeenCalled();
                                 });
@@ -165,12 +152,12 @@ define([
 
                     describe(caseName, function () {
                         beforeEach(function () {
-                            mockEditor.isEditContextRoot.andReturn(isEditRoot);
+                            mockEditor.isEditContextRoot.and.returnValue(isEditRoot);
                         });
 
                         describe("when navigation changes", function () {
                             beforeEach(function () {
-                                mockNavigationService.addListener.mostRecentCall
+                                mockNavigationService.addListener.calls.mostRecent()
                                     .args[0](mockDomainObject);
                             });
                             itNavigatesAsExpected();
@@ -178,7 +165,7 @@ define([
 
                         describe("when mutation occurs", function () {
                             beforeEach(function () {
-                                mockMutationTopic.listen.mostRecentCall
+                                mockMutationTopic.listen.calls.mostRecent()
                                     .args[0](mockParentObject);
                             });
 

platform/commonUI/browse/test/windowing/WindowTitlerSpec.js

@@ -49,8 +49,8 @@ define(
                 );
                 mockDocument = [{}];
 
-                mockDomainObject.getModel.andReturn({ name: 'Test name' });
-                mockNavigationService.getNavigation.andReturn(mockDomainObject);
+                mockDomainObject.getModel.and.returnValue({ name: 'Test name' });
+                mockNavigationService.getNavigation.and.returnValue(mockDomainObject);
 
                 titler = new WindowTitler(
                     mockNavigationService,
@@ -64,12 +64,12 @@ define(
                     jasmine.any(Function),
                     jasmine.any(Function)
                 );
-                expect(mockRootScope.$watch.mostRecentCall.args[0]())
+                expect(mockRootScope.$watch.calls.mostRecent().args[0]())
                     .toEqual('Test name');
             });
 
             it("sets the title to the name of the navigated object", function () {
-                mockRootScope.$watch.mostRecentCall.args[1]("Some name");
+                mockRootScope.$watch.calls.mostRecent().args[1]("Some name");
                 expect(mockDocument[0].title).toEqual("Some name");
             });
 

platform/commonUI/dialog/res/templates/message.html

@@ -4,7 +4,10 @@
         <div class="top-bar">
             <div class="title">{{ngModel.title}}</div>
         </div>
-        <div class="hint" ng-hide="ngModel.hint === undefined">{{ngModel.hint}}</div>
+        <div class="hint" ng-hide="ngModel.hint === undefined">
+            {{ngModel.hint}}
+            <span ng-if="ngModel.timestamp !== undefined">[{{ngModel.timestamp}}]</span>
+        </div>
         <div class="message-body">
             <div class="message-action">
                 {{ngModel.actionText}}

platform/commonUI/dialog/test/DialogServiceSpec.js

@@ -63,12 +63,12 @@ define(
                   ["find"]
                 );
                 mockBody = jasmine.createSpyObj('body', ['on', 'off']);
-                mockDocument.find.andReturn(mockBody);
+                mockDocument.find.and.returnValue(mockBody);
 
                 mockDeferred.promise = "mock promise";
 
-                mockQ.defer.andReturn(mockDeferred);
-                mockOverlayService.createOverlay.andReturn(mockOverlay);
+                mockQ.defer.and.returnValue(mockDeferred);
+                mockOverlayService.createOverlay.and.returnValue(mockOverlay);
 
                 dialogService = new DialogService(
                     mockOverlayService,
@@ -85,7 +85,7 @@ define(
 
             it("allows user input to be canceled", function () {
                 dialogService.getUserInput({}, { someKey: "some value" });
-                mockOverlayService.createOverlay.mostRecentCall.args[1].cancel();
+                mockOverlayService.createOverlay.calls.mostRecent().args[1].cancel();
                 expect(mockDeferred.reject).toHaveBeenCalled();
                 expect(mockDeferred.resolve).not.toHaveBeenCalled();
             });
@@ -93,7 +93,7 @@ define(
             it("passes back the result of user input when confirmed", function () {
                 var value = { someKey: 42 };
                 dialogService.getUserInput({}, value);
-                mockOverlayService.createOverlay.mostRecentCall.args[1].confirm();
+                mockOverlayService.createOverlay.calls.mostRecent().args[1].confirm();
                 expect(mockDeferred.reject).not.toHaveBeenCalled();
                 expect(mockDeferred.resolve).toHaveBeenCalledWith(value);
             });
@@ -109,7 +109,7 @@ define(
             it("can show multiple dialogs if prior ones are dismissed", function () {
                 dialogService.getUserInput({}, {});
                 expect(mockLog.warn).not.toHaveBeenCalled();
-                mockOverlayService.createOverlay.mostRecentCall.args[1].confirm();
+                mockOverlayService.createOverlay.calls.mostRecent().args[1].confirm();
                 dialogService.getUserInput({}, {});
                 expect(mockLog.warn).not.toHaveBeenCalled();
                 expect(mockDeferred.reject).not.toHaveBeenCalled();
@@ -148,13 +148,13 @@ define(
 
             it("destroys the event listener when the dialog is cancelled", function () {
                 dialogService.getUserInput({}, {});
-                mockOverlayService.createOverlay.mostRecentCall.args[1].cancel();
+                mockOverlayService.createOverlay.calls.mostRecent().args[1].cancel();
                 expect(mockBody.off).toHaveBeenCalledWith("keydown", jasmine.any(Function));
             });
 
             it("cancels the dialog when an escape keydown event is triggered", function () {
                 dialogService.getUserInput({}, {});
-                mockBody.on.mostRecentCall.args[1]({
+                mockBody.on.calls.mostRecent().args[1]({
                     keyCode: 27
                 });
                 expect(mockDeferred.reject).toHaveBeenCalled();
@@ -163,7 +163,7 @@ define(
 
             it("ignores non escape keydown events", function () {
                 dialogService.getUserInput({}, {});
-                mockBody.on.mostRecentCall.args[1]({
+                mockBody.on.calls.mostRecent().args[1]({
                     keyCode: 13
                 });
                 expect(mockDeferred.reject).not.toHaveBeenCalled();
@@ -197,7 +197,7 @@ define(
                         "overlay",
                         ["dismiss"]
                     );
-                    mockOverlayService.createOverlay.andReturn(secondMockOverlay);
+                    mockOverlayService.createOverlay.and.returnValue(secondMockOverlay);
                     secondDialogHandle = dialogService.showBlockingMessage(dialogModel);
 
                     //Dismiss the first dialog. It should only dismiss if it

platform/commonUI/dialog/test/OverlayServiceSpec.js

@@ -46,10 +46,10 @@ define(
                 mockElement = jasmine.createSpyObj("element", ["remove"]);
                 mockScope = jasmine.createSpyObj("scope", ["$destroy"]);
 
-                mockDocument.find.andReturn(mockBody);
-                mockCompile.andReturn(mockTemplate);
-                mockRootScope.$new.andReturn(mockScope);
-                mockTemplate.andReturn(mockElement);
+                mockDocument.find.and.returnValue(mockBody);
+                mockCompile.and.returnValue(mockTemplate);
+                mockRootScope.$new.and.returnValue(mockScope);
+                mockTemplate.and.returnValue(mockElement);
 
                 overlayService = new OverlayService(
                     mockDocument,
@@ -61,7 +61,7 @@ define(
             it("prepends an mct-include to create overlays", function () {
                 overlayService.createOverlay("test", {});
                 expect(mockCompile).toHaveBeenCalled();
-                expect(mockCompile.mostRecentCall.args[0].indexOf("mct-include"))
+                expect(mockCompile.calls.mostRecent().args[0].indexOf("mct-include"))
                     .not.toEqual(-1);
             });
 

platform/commonUI/edit/bundle.js

@@ -39,7 +39,6 @@ define([
     "./src/policies/EditableMovePolicy",
     "./src/policies/EditContextualActionPolicy",
     "./src/representers/EditRepresenter",
-    "./src/representers/EditToolbarRepresenter",
     "./src/capabilities/EditorCapability",
     "./src/capabilities/TransactionCapabilityDecorator",
     "./src/services/TransactionManager",
@@ -78,7 +77,6 @@ define([
     EditableMovePolicy,
     EditContextualActionPolicy,
     EditRepresenter,
-    EditToolbarRepresenter,
     EditorCapability,
     TransactionCapabilityDecorator,
     TransactionManager,
@@ -190,6 +188,7 @@ define([
                     "name": "Remove",
                     "description": "Remove this object from its containing object.",
                     "depends": [
+                        "dialogService",
                         "navigationService"
                     ]
                 },
@@ -381,12 +380,6 @@ define([
                     "depends": [
                         "$log"
                     ]
-                },
-                {
-                    "implementation": EditToolbarRepresenter,
-                    "depends": [
-                        "openmct"
-                    ]
                 }
             ],
             "constants": [
@@ -424,6 +417,17 @@ define([
                         "transactionService"
                     ]
                 }
+            ],
+            "runs": [
+                {
+                    depends: [
+                        "toolbars[]",
+                        "openmct"
+                    ],
+                    implementation: function (toolbars, openmct) {
+                        toolbars.forEach(openmct.toolbars.addProvider, openmct.toolbars);
+                    }
+                }
             ]
         }
     });

platform/commonUI/edit/res/templates/edit-object.html

@@ -24,7 +24,8 @@
         <div class="items-select left flex-elem l-flex-row grows">
             <mct-representation key="'back-arrow'"
                                 mct-object="domainObject"
-                                class="flex-elem l-back"></mct-representation>
+                                class="flex-elem l-back">
+            </mct-representation>
             <mct-representation key="'object-header'"
                                 mct-object="domainObject"
                                 class="l-flex-row flex-elem grows object-header">
@@ -48,8 +49,8 @@
             <!-- Toolbar and Save/Cancel buttons -->
             <div class="l-edit-controls flex-elem l-flex-row flex-align-end">
                 <mct-toolbar name="mctToolbar"
-                             structure="toolbar.structure"
-                             ng-model="toolbar.state"
+                             structure="editToolbar.structure"
+                             ng-model="editToolbar.state"
                              class="flex-elem grows">
                 </mct-toolbar>
                 <mct-representation key="'edit-action-buttons'"
@@ -61,7 +62,6 @@
             <mct-representation key="representation.selected.key"
                                 mct-object="representation.selected.key && domainObject"
                                 class="abs flex-elem grows object-holder-main scroll"
-                                toolbar="toolbar"
                                 mct-selectable="{
                                     item: domainObject.useCapability('adapter'),
                                     oldItem: domainObject

platform/commonUI/edit/res/templates/elements.html

@@ -24,7 +24,7 @@
                  class="flex-elem holder"
                  ng-model="filterBy">
     </mct-include>
-    <div class="flex-elem grows vscroll">
+    <div class="flex-elem grows vscroll scroll-pad">
         <ul class="tree" id="inspector-elements-tree"
             ng-if="composition.length > 0">
             <li ng-repeat="containedObject in composition | filter:searchElements">

platform/commonUI/edit/src/actions/RemoveAction.js

@@ -23,111 +23,125 @@
 /**
  * Module defining RemoveAction. Created by vwoeltje on 11/17/14.
  */
-define(
-    [],
-    function () {
+define([
+    './RemoveDialog'
+], function (
+    RemoveDialog
+) {
 
-        /**
-         * Construct an action which will remove the provided object manifestation.
-         * The object will be removed from its parent's composition; the parent
-         * is looked up via the "context" capability (so this will be the
-         * immediate ancestor by which this specific object was reached.)
-         *
-         * @param {DomainObject} object the object to be removed
-         * @param {ActionContext} context the context in which this action is performed
-         * @memberof platform/commonUI/edit
-         * @constructor
-         * @implements {Action}
+    /**
+     * Construct an action which will remove the provided object manifestation.
+     * The object will be removed from its parent's composition; the parent
+     * is looked up via the "context" capability (so this will be the
+     * immediate ancestor by which this specific object was reached.)
+     *
+     * @param {DialogService} dialogService a service which will show the dialog
+     * @param {NavigationService} navigationService a service that maintains the current navigation state
+     * @param {ActionContext} context the context in which this action is performed
+     * @memberof platform/commonUI/edit
+     * @constructor
+     * @implements {Action}
+     */
+    function RemoveAction(dialogService, navigationService, context) {
+        this.domainObject = (context || {}).domainObject;
+        this.dialogService = dialogService;
+        this.navigationService = navigationService;
+    }
+
+    /**
+     * Perform this action.
+     */
+    RemoveAction.prototype.perform = function (skipWarning) {
+        var dialog,
+            dialogService = this.dialogService,
+            domainObject = this.domainObject,
+            navigationService = this.navigationService;
+        /*
+         * Check whether an object ID matches the ID of the object being
+         * removed (used to filter a parent's composition to handle the
+         * removal.)
          */
-        function RemoveAction(navigationService, context) {
-            this.domainObject = (context || {}).domainObject;
-            this.navigationService = navigationService;
+        function isNotObject(otherObjectId) {
+            return otherObjectId !== domainObject.getId();
         }
 
-        /**
-         * Perform this action.
-         * @return {Promise} a promise which will be
-         *         fulfilled when the action has completed.
+        /*
+         * Mutate a parent object such that it no longer contains the object
+         * which is being removed.
          */
-        RemoveAction.prototype.perform = function () {
-            var navigationService = this.navigationService,
-                domainObject = this.domainObject;
-            /*
-             * Check whether an object ID matches the ID of the object being
-             * removed (used to filter a parent's composition to handle the
-             * removal.)
-             */
-            function isNotObject(otherObjectId) {
-                return otherObjectId !== domainObject.getId();
-            }
+        function doMutate(model) {
+            model.composition = model.composition.filter(isNotObject);
+        }
 
-            /*
-             * Mutate a parent object such that it no longer contains the object
-             * which is being removed.
-             */
-            function doMutate(model) {
-                model.composition = model.composition.filter(isNotObject);
-            }
+        /*
+         * Checks current object and ascendants of current
+         * object with object being removed, if the current
+         * object or any in the current object's path is being removed,
+         * navigate back to parent of removed object.
+         */
+        function checkObjectNavigation(object, parentObject) {
+            // Traverse object starts at current location
+            var traverseObject = (navigationService).getNavigation(),
+                context;
 
-            /*
-             * Checks current object and ascendants of current
-             * object with object being removed, if the current
-             * object or any in the current object's path is being removed,
-             * navigate back to parent of removed object.
-             */
-            function checkObjectNavigation(object, parentObject) {
-                // Traverse object starts at current location
-                var traverseObject = (navigationService).getNavigation(),
-                    context;
-
-                // Stop when object is not defined (above ROOT)
-                while (traverseObject) {
-                    // If object currently traversed to is object being removed
-                    // navigate to parent of current object and then exit loop
-                    if (traverseObject.getId() === object.getId()) {
-                        navigationService.setNavigation(parentObject);
-                        return;
-                    }
-                    // Traverses to parent of current object, moving
-                    // up the ascendant path
-                    context = traverseObject.getCapability('context');
-                    traverseObject = context && context.getParent();
+            // Stop when object is not defined (above ROOT)
+            while (traverseObject) {
+                // If object currently traversed to is object being removed
+                // navigate to parent of current object and then exit loop
+                if (traverseObject.getId() === object.getId()) {
+                    navigationService.setNavigation(parentObject);
+                    return;
                 }
+                // Traverses to parent of current object, moving
+                // up the ascendant path
+                context = traverseObject.getCapability('context');
+                traverseObject = context && context.getParent();
             }
+        }
 
+        /*
+         * Remove the object from its parent, as identified by its context
+         * capability. Based on object's location and selected object's location
+         * user may be navigated to existing parent object
+         */
+        function removeFromContext(object) {
+            var contextCapability = object.getCapability('context'),
+                parent = contextCapability.getParent();
+
+            // If currently within path of removed object(s),
+            // navigates to existing object up tree
+            checkObjectNavigation(object, parent);
+
+            return parent.useCapability('mutation', doMutate);
+        }
+
+        if (skipWarning) {
+
+            removeFromContext(domainObject);
+
+        } else {
             /*
-             * Remove the object from its parent, as identified by its context
-             * capability. Based on object's location and selected object's location
-             * user may be navigated to existing parent object
-             */
-            function removeFromContext(object) {
-                var contextCapability = object.getCapability('context'),
-                    parent = contextCapability.getParent();
+            * Pass in the function to remove the domain object so it can be
+            * associated with an 'OK' button press
+            */
+            dialog = new RemoveDialog(dialogService, domainObject, removeFromContext);
+            dialog.show();
+        }
+    };
 
-                // If currently within path of removed object(s),
-                // navigates to existing object up tree
-                checkObjectNavigation(object, parent);
+    // Object needs to have a parent for Remove to be applicable
+    RemoveAction.appliesTo = function (context) {
+        var object = (context || {}).domainObject,
+            contextCapability = object && object.getCapability("context"),
+            parent = contextCapability && contextCapability.getParent(),
+            parentType = parent && parent.getCapability('type'),
+            parentCreatable = parentType && parentType.hasFeature('creation');
 
-                return parent.useCapability('mutation', doMutate);
-            }
+        // Only creatable types should be modifiable
+        return parent !== undefined &&
+                Array.isArray(parent.getModel().composition) &&
+                parentCreatable;
+    };
 
-            return removeFromContext(domainObject);
-        };
-
-        // Object needs to have a parent for Remove to be applicable
-        RemoveAction.appliesTo = function (context) {
-            var object = (context || {}).domainObject,
-                contextCapability = object && object.getCapability("context"),
-                parent = contextCapability && contextCapability.getParent(),
-                parentType = parent && parent.getCapability('type'),
-                parentCreatable = parentType && parentType.hasFeature('creation');
-
-            // Only creatable types should be modifiable
-            return parent !== undefined &&
-                    Array.isArray(parent.getModel().composition) &&
-                    parentCreatable;
-        };
-
-        return RemoveAction;
-    }
-);
+    return RemoveAction;
+});

platform/commonUI/edit/src/actions/RemoveDialog.js

@@ -0,0 +1,77 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2017, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+define([], function () {
+
+    /**
+     * @callback removeCallback
+     * @param {DomainObject} domainObject the domain object to be removed
+     */
+
+    /**
+     * Construct a new Remove dialog.
+     *
+     * @param {DialogService} dialogService the service that shows the dialog
+     * @param {DomainObject} domainObject the domain object to be removed
+     * @param {removeCallback} removeCallback callback that handles removal of the domain object
+     * @memberof platform/commonUI/edit
+     * @constructor
+     */
+    function RemoveDialog(dialogService, domainObject, removeCallback) {
+        this.dialogService = dialogService;
+        this.domainObject = domainObject;
+        this.removeCallback = removeCallback;
+    }
+
+    /**
+     * Display a dialog to confirm the removal of a domain object.
+     */
+    RemoveDialog.prototype.show = function () {
+        var dialog,
+            domainObject = this.domainObject,
+            removeCallback = this.removeCallback,
+            model = {
+                title: 'Remove ' + domainObject.getModel().name,
+                actionText: 'Warning! This action will permanently remove this object. Are you sure you want to continue?',
+                severity: 'alert',
+                primaryOption: {
+                    label: 'OK',
+                    callback: function () {
+                        removeCallback(domainObject);
+                        dialog.dismiss();
+                    }
+                },
+                options: [
+                    {
+                        label: 'Cancel',
+                        callback: function () {
+                            dialog.dismiss();
+                        }
+                    }
+                ]
+            };
+
+        dialog = this.dialogService.showBlockingMessage(model);
+    };
+
+    return RemoveDialog;
+});

platform/commonUI/edit/src/representers/EditToolbar.js

@@ -20,192 +20,110 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 define(
-    [],
-    function () {
-
-        // Utility functions for reducing truth arrays
-        function and(a, b) {
-            return a && b;
-        }
-        function or(a, b) {
-            return a || b;
-        }
-
+    [
+        '../../../../../src/api/objects/object-utils',
+        'lodash'
+    ],
+    function (
+        objectUtils,
+        _
+    ) {
 
         /**
          * Provides initial structure and state (as suitable for provision
-         * to the `mct-toolbar` directive) for a view's tool bar, based on
-         * that view's declaration of what belongs in its tool bar and on
+         * to the `mct-toolbar` directive) for a view's toolbar, based on
+         * that view's declaration of what belongs in its toolbar and on
          * the current selection.
          *
-         * @param structure toolbar structure, as provided by view definition
-         * @param {Function} commit callback to invoke after changes
+         * @param $scope the Angular scope
+         * @param {Object} openmct the openmct object
+         * @param structure the toolbar structure
          * @memberof platform/commonUI/edit
          * @constructor
          */
-        function EditToolbar(structure, commit) {
+        function EditToolbar($scope, openmct, structure) {
+            this.toolbarStructure = [];
+            this.properties = [];
+            this.toolbarState = [];
+            this.openmct = openmct;
+            this.domainObjectsById = {};
+            this.unobserveObjects = [];
+            this.stateTracker = [];
+
+            $scope.$watchCollection(this.getState.bind(this), this.handleStateChanges.bind(this));
+            $scope.$on("$destroy", this.destroy.bind(this));
+
+            this.updateToolbar(structure);
+            this.registerListeners(structure);
+        }
+
+        /**
+         * Updates the toolbar with a new structure.
+         *
+         * @param {Array} structure the toolbar structure
+         */
+        EditToolbar.prototype.updateToolbar = function (structure) {
             var self = this;
 
-            // Generate a new key for an item's property
-            function addKey(property) {
-                self.properties.push(property);
+            function addKey(item) {
+                self.stateTracker.push({
+                    id: objectUtils.makeKeyString(item.domainObject.identifier),
+                    domainObject: item.domainObject,
+                    property: item.property
+                });
+                self.properties.push(item.property);
+
                 return self.properties.length - 1; // Return index of property
             }
 
-            // Invoke all functions in selections with the given name
-            function invoke(method, value) {
-                if (method) {
-                    // Make the change in the selection
-                    self.selection.forEach(function (selected) {
-                        if (typeof selected[method] === 'function') {
-                            selected[method](value);
-                        }
-                    });
-                    // ...and commit!
-                    commit();
-                }
-            }
-
-            // Prepare a toolbar item based on current selection
             function convertItem(item) {
                 var converted = Object.create(item || {});
+
                 if (item.property) {
-                    converted.key = addKey(item.property);
+                    converted.key = addKey(item);
                 }
+
                 if (item.method) {
-                    converted.click = function (v) {
-                        invoke(item.method, v);
+                    converted.click = function (value) {
+                        item.method(value);
                     };
                 }
+
                 return converted;
             }
 
-            // Prepare a toolbar section
-            function convertSection(section) {
-                var converted = Object.create(section || {});
-                converted.items =
-                    ((section || {}).items || [])
-                            .map(convertItem);
-                return converted;
-            }
-
-            this.toolbarState = [];
-            this.selection = undefined;
-            this.properties = [];
-            this.toolbarStructure = Object.create(structure || {});
-            this.toolbarStructure.sections =
-                ((structure || {}).sections || []).map(convertSection);
-        }
-
-        // Check if all elements of the selection which have this
-        // property have the same value for this property.
-        EditToolbar.prototype.isConsistent = function (property) {
-            var self = this,
-                consistent = true,
-                observed = false,
-                state;
-
-            // Check if a given element of the selection is consistent
-            // with previously-observed elements for this property.
-            function checkConsistency(selected) {
-                var next;
-                // Ignore selections which don't have this property
-                if (selected[property] !== undefined) {
-                    // Look up state of this element in the selection
-                    next = self.lookupState(property, selected);
-                    // Detect inconsistency
-                    if (observed) {
-                        consistent = consistent && (next === state);
-                    }
-                    // Track state for next iteration
-                    state = next;
-                    observed = true;
-                }
-            }
-
-            // Iterate through selections
-            self.selection.forEach(checkConsistency);
-
-            return consistent;
-        };
-
-        // Used to filter out items which are applicable (or not)
-        // to the current selection.
-        EditToolbar.prototype.isApplicable = function (item) {
-            var property = (item || {}).property,
-                method = (item || {}).method,
-                exclusive = !!(item || {}).exclusive;
-
-            // Check if a selected item defines this property
-            function hasProperty(selected) {
-                return (property && (selected[property] !== undefined)) ||
-                    (method && (typeof selected[method] === 'function'));
-            }
-
-            return this.selection.map(hasProperty).reduce(
-                    exclusive ? and : or,
-                    exclusive
-                ) && this.isConsistent(property);
-        };
-
-
-        // Look up the current value associated with a property
-        EditToolbar.prototype.lookupState = function (property, selected) {
-            var value = selected[property];
-            return (typeof value === 'function') ? value() : value;
-        };
-
-        /**
-         * Set the current selection. Visibility of sections
-         * and items in the toolbar will be updated to match this.
-         * @param {Array} s the new selection
-         */
-        EditToolbar.prototype.setSelection = function (s) {
-            var self = this;
-
-            // Show/hide controls in this section per applicability
-            function refreshSectionApplicability(section) {
-                var count = 0;
-                // Show/hide each item
-                (section.items || []).forEach(function (item) {
-                    item.hidden = !self.isApplicable(item);
-                    count += item.hidden ? 0 : 1;
-                });
-                // Hide this section if there are no applicable items
-                section.hidden = !count;
-            }
-
             // Get initial value for a given property
             function initializeState(property) {
                 var result;
-                // Look through all selections for this property;
-                // values should all match by the time we perform
-                // this lookup anyway.
-                self.selection.forEach(function (selected) {
-                    result = (selected[property] !== undefined) ?
-                        self.lookupState(property, selected) :
-                        result;
+                structure.forEach(function (item) {
+                    if (item.property === property) {
+                        result = _.get(item.domainObject, item.property);
+                    }
                 });
+
                 return result;
             }
 
-            this.selection = s;
-            this.toolbarStructure.sections.forEach(refreshSectionApplicability);
+            // Tracks the domain object and property for every element in the state array
+            this.stateTracker = [];
+            this.toolbarStructure = structure.map(convertItem);
             this.toolbarState = this.properties.map(initializeState);
         };
 
         /**
-         * Get the structure of the toolbar, as appropriate to
+         * Gets the structure of the toolbar, as appropriate to
          * pass to `mct-toolbar`.
-         * @returns the toolbar structure
+         *
+         * @returns {Array} the toolbar structure
          */
         EditToolbar.prototype.getStructure = function () {
             return this.toolbarStructure;
         };
 
         /**
-         * Get the current state of the toolbar, as appropriate
+         * Gets the current state of the toolbar, as appropriate
          * to two-way bind to the state handled by `mct-toolbar`.
+         *
          * @returns {Array} state of the toolbar
          */
         EditToolbar.prototype.getState = function () {
@@ -213,48 +131,124 @@ define(
         };
 
         /**
-         * Update state within the current selection.
+         * Mutates the domain object's property with a new value.
+         *
+         * @param {Object} dominObject the domain object
+         * @param {string} property the domain object's property to update
+         * @param value the property's new value
+         */
+        EditToolbar.prototype.updateDomainObject = function (domainObject, property, value) {
+            this.openmct.objects.mutate(domainObject, property, value);
+        };
+
+        /**
+         * Updates state with the new value.
+         *
          * @param {number} index the index of the corresponding
          *        element in the state array
-         * @param value the new value to convey to the selection
+         * @param value the new value to update the state array with
          */
         EditToolbar.prototype.updateState = function (index, value) {
+            this.toolbarState[index] = value;
+        };
+
+        /**
+         * Register listeners for domain objects to watch for updates.
+         *
+         * @param {Array} the toolbar structure
+         */
+        EditToolbar.prototype.registerListeners = function (structure) {
             var self = this;
 
-            // Update value for this property in all elements of the
-            // selection which have this property.
-            function updateProperties(property, val) {
-                var changed = false;
-
-                // Update property in a selected element
-                function updateProperty(selected) {
-                    // Ignore selected elements which don't have this property
-                    if (selected[property] !== undefined) {
-                        // Check if this is a setter, or just assignable
-                        if (typeof selected[property] === 'function') {
-                            changed =
-                                changed || (selected[property]() !== val);
-                            selected[property](val);
-                        } else {
-                            changed =
-                                changed || (selected[property] !== val);
-                            selected[property] = val;
-                        }
-                    }
-                }
-
-                // Update property in all selected elements
-                self.selection.forEach(updateProperty);
-
-                // Return whether or not anything changed
-                return changed;
+            function observeObject(domainObject, id) {
+                var unobserveObject = self.openmct.objects.observe(domainObject, '*', function (newObject) {
+                    self.domainObjectsById[id].newObject = JSON.parse(JSON.stringify(newObject));
+                    self.scheduleStateUpdate();
+                });
+                self.unobserveObjects.push(unobserveObject);
             }
 
-            return updateProperties(this.properties[index], value);
+            structure.forEach(function (item) {
+                var domainObject = item.domainObject;
+                var id = objectUtils.makeKeyString(domainObject.identifier);
+
+                if (!self.domainObjectsById[id]) {
+                    self.domainObjectsById[id] = {
+                        domainObject: domainObject,
+                        properties: []
+                    };
+                    observeObject(domainObject, id);
+                }
+
+                self.domainObjectsById[id].properties.push(item.property);
+            });
+        };
+
+        /**
+         * Delays updating the state.
+         */
+        EditToolbar.prototype.scheduleStateUpdate = function () {
+            if (this.stateUpdateScheduled) {
+                return;
+            }
+
+            this.stateUpdateScheduled = true;
+            setTimeout(this.updateStateAfterMutation.bind(this));
+        };
+
+        EditToolbar.prototype.updateStateAfterMutation = function () {
+            this.stateTracker.forEach(function (state, index) {
+                if (!this.domainObjectsById[state.id].newObject) {
+                    return;
+                }
+
+                var domainObject = this.domainObjectsById[state.id].domainObject;
+                var newObject = this.domainObjectsById[state.id].newObject;
+                var currentValue = _.get(domainObject, state.property);
+                var newValue = _.get(newObject, state.property);
+
+                state.domainObject = newObject;
+
+                if (currentValue !== newValue) {
+                    this.updateState(index, newValue);
+                }
+            }, this);
+
+            Object.values(this.domainObjectsById).forEach(function (tracker) {
+                if (tracker.newObject) {
+                    tracker.domainObject = tracker.newObject;
+                }
+                delete tracker.newObject;
+            });
+            this.stateUpdateScheduled = false;
+        };
+
+        /**
+         * Removes the listeners.
+         */
+        EditToolbar.prototype.deregisterListeners = function () {
+            this.unobserveObjects.forEach(function (unobserveObject) {
+                unobserveObject();
+            });
+            this.unobserveObjects = [];
+        };
+
+        EditToolbar.prototype.handleStateChanges = function (state) {
+            (state || []).map(function (newValue, index) {
+                var domainObject = this.stateTracker[index].domainObject;
+                var property = this.stateTracker[index].property;
+                var currentValue = _.get(domainObject, property);
+
+                if (currentValue !== newValue) {
+                    this.updateDomainObject(domainObject, property, newValue);
+                }
+            }, this);
+        };
+
+        EditToolbar.prototype.destroy = function () {
+            this.deregisterListeners();
         };
 
         return EditToolbar;
     }
 );
-
-

platform/commonUI/edit/src/representers/EditToolbarRepresenter.js

@@ -1,154 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2018, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-define(
-    ['./EditToolbar', './EditToolbarSelection'],
-    function (EditToolbar, EditToolbarSelection) {
-
-        // No operation
-        var NOOP_REPRESENTER = {
-            represent: function () {},
-            destroy: function () {}
-        };
-
-        /**
-         * The EditToolbarRepresenter populates the toolbar in Edit mode
-         * based on a view's definition.
-         * @param {Scope} scope the Angular scope of the representation
-         * @memberof platform/commonUI/edit
-         * @constructor
-         * @implements {Representer}
-         */
-        function EditToolbarRepresenter(openmct, scope, element, attrs) {
-            var self = this;
-
-            // Mark changes as ready to persist
-            function commit(message) {
-                if (scope.commit) {
-                    scope.commit(message);
-                }
-            }
-
-            // Handle changes to the current selection
-            function updateSelection(selection) {
-                // Only update if there is a toolbar to update
-                if (self.toolbar) {
-                    // Make sure selection is array-like
-                    selection = Array.isArray(selection) ?
-                            selection :
-                            (selection ? [selection] : []);
-
-                    // Update the toolbar's selection
-                    self.toolbar.setSelection(selection);
-
-                    // ...and expose its structure/state
-                    self.toolbarObject.structure =
-                        self.toolbar.getStructure();
-                    self.toolbarObject.state =
-                        self.toolbar.getState();
-                }
-            }
-
-            // Get state (to watch it)
-            function getState() {
-                return self.toolbarObject.state;
-            }
-
-            // Update selection models to match changed toolbar state
-            function updateState(state) {
-                // Update underlying state based on toolbar changes
-                var changed = (state || []).map(function (value, index) {
-                    return self.toolbar.updateState(index, value);
-                }).reduce(function (a, b) {
-                    return a || b;
-                }, false);
-
-                // Only commit if something actually changed
-                if (changed) {
-                    // Commit the changes.
-                    commit("Changes from toolbar.");
-                }
-            }
-            this.clearExposedToolbar = function () {
-                // Clear exposed toolbar state (if any)
-                if (attrs.toolbar) {
-                    delete scope.$parent[attrs.toolbar];
-                }
-            };
-            this.exposeToolbar = function () {
-                scope.$parent[self.attrs.toolbar] = self.toolbarObject;
-            };
-
-            this.commit = commit;
-            this.attrs = attrs;
-            this.updateSelection = updateSelection;
-            this.toolbar = undefined;
-            this.toolbarObject = {};
-            this.openmct = openmct;
-            this.scope = scope;
-
-            // If this representation exposes a toolbar, set up watches
-            // to synchronize with it.
-            if (attrs && attrs.toolbar) {
-                // Detect and handle changes to state from the toolbar
-                scope.$watchCollection(getState, updateState);
-                // Watch for changes in the current selection state
-                scope.$watchCollection("selection.all()", updateSelection);
-                // Expose toolbar state under that name
-                scope.$parent[attrs.toolbar] = this.toolbarObject;
-            } else {
-                // No toolbar declared, so do nothing.
-                return NOOP_REPRESENTER;
-            }
-
-        }
-
-        // Represent a domain object using this definition
-        EditToolbarRepresenter.prototype.represent = function (representation) {
-            // Get the newest toolbar definition from the view
-            var definition = (representation || {}).toolbar || {};
-
-            // If we have been asked to expose toolbar state...
-            if (this.attrs.toolbar) {
-                // Initialize toolbar object
-                this.toolbar = new EditToolbar(definition, this.commit);
-                // Ensure toolbar state is exposed
-                this.exposeToolbar();
-            }
-
-            // Add toolbar selection to scope.
-            this.scope.selection = new EditToolbarSelection(
-                this.scope,
-                this.openmct
-            );
-            // Initialize toolbar to current selection
-            this.updateSelection(this.scope.selection.all());
-        };
-
-        // Destroy; remove toolbar object from parent scope
-        EditToolbarRepresenter.prototype.destroy = function () {
-            this.clearExposedToolbar();
-        };
-
-        return EditToolbarRepresenter;
-    }
-);

platform/commonUI/edit/src/representers/EditToolbarSelection.js

@@ -1,157 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2018, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is licensed under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * http://www.apache.org/licenses/LICENSE-2.0.
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
- * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
- * License for the specific language governing permissions and limitations
- * under the License.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-define(
-    [],
-    function () {
-
-        /**
-         * Tracks selection state for editable views. Selection is
-         * implemented such that (from the toolbar's perspective)
-         * up to two objects can be "selected" at any given time:
-         *
-         * * The view proxy (see the `proxy` method), which provides
-         *   an interface for interacting with the view itself (e.g.
-         *   for buttons like "Add")
-         * * The selection, for single selected elements within the
-         *   view.
-         *
-         * @memberof platform/commonUI/edit
-         * @constructor
-         */
-        function EditToolbarSelection($scope, openmct) {
-            this.selection = [{}];
-            this.selecting = false;
-            this.selectedObj = undefined;
-            this.openmct = openmct;
-            var self = this;
-
-            function setSelection(selection) {
-                var selected = selection[0];
-
-                if (selected && selected.context.toolbar) {
-                    self.select(selected.context.toolbar);
-                } else {
-                    self.deselect();
-                }
-
-                if (selected && selected.context.viewProxy) {
-                    self.proxy(selected.context.viewProxy);
-                }
-
-                setTimeout(function () {
-                    $scope.$apply();
-                });
-            }
-
-            $scope.$on("$destroy", function () {
-                self.openmct.selection.off('change', setSelection);
-            });
-
-            this.openmct.selection.on('change', setSelection);
-            setSelection(this.openmct.selection.get());
-        }
-
-        /**
-         * Check if an object is currently selected.
-         * @param {*} obj the object to check for selection
-         * @returns {boolean} true if selected, otherwise false
-         */
-        EditToolbarSelection.prototype.selected = function (obj) {
-            return (obj === this.selectedObj) || (obj === this.selection[0]);
-        };
-
-        /**
-         * Select an object.
-         * @param obj the object to select
-         * @returns {boolean} true if selection changed
-         */
-        EditToolbarSelection.prototype.select = function (obj) {
-            // Proxy is always selected
-            if (obj === this.selection[0]) {
-                return false;
-            }
-
-            // Clear any existing selection
-            this.deselect();
-
-            // Note the current selection state
-            this.selectedObj = obj;
-            this.selecting = true;
-
-            // Add the selection
-            this.selection.push(obj);
-        };
-
-        /**
-         * Clear the current selection.
-         * @returns {boolean} true if selection changed
-         */
-        EditToolbarSelection.prototype.deselect = function () {
-            // Nothing to do if we don't have a selected object
-            if (this.selecting) {
-                // Clear state tracking
-                this.selecting = false;
-                this.selectedObj = undefined;
-
-                // Remove the selection
-                this.selection.pop();
-
-                return true;
-            }
-            return false;
-        };
-
-        /**
-         * Get the currently-selected object.
-         * @returns the currently selected object
-         */
-        EditToolbarSelection.prototype.get = function () {
-            return this.selectedObj;
-        };
-
-        /**
-         * Get/set the view proxy (for toolbar actions taken upon
-         * the view itself.)
-         * @param [proxy] the view proxy (if setting)
-         * @returns the current view proxy
-         */
-        EditToolbarSelection.prototype.proxy = function (p) {
-            if (arguments.length > 0) {
-                this.selection[0] = p;
-            }
-            return this.selection[0];
-        };
-
-        /**
-         * Get an array containing all selections, including the
-         * selection proxy. It is generally not advisable to
-         * mutate this array directly.
-         * @returns {Array} all selections
-         */
-        EditToolbarSelection.prototype.all = function () {
-            return this.selection;
-        };
-
-        return EditToolbarSelection;
-    }
-);

platform/commonUI/edit/test/actions/CancelActionSpec.js

@@ -49,7 +49,7 @@ define(
                         "getModel"
                     ]
                 );
-                mockDomainObject.getModel.andReturn({});
+                mockDomainObject.getModel.and.returnValue({});
 
                 mockParentObject = jasmine.createSpyObj(
                     "parentObject",
@@ -57,7 +57,7 @@ define(
                         "getCapability"
                     ]
                 );
-                mockParentObject.getCapability.andCallFake(function (name) {
+                mockParentObject.getCapability.and.callFake(function (name) {
                     return parentCapabilities[name];
                 });
 
@@ -77,14 +77,14 @@ define(
                         "getOriginal"
                     ]
                 );
-                capabilities.location.getOriginal.andReturn(mockPromise(mockDomainObject));
+                capabilities.location.getOriginal.and.returnValue(mockPromise(mockDomainObject));
                 capabilities.context = jasmine.createSpyObj(
                     "contextCapability",
                     [
                         "getParent"
                     ]
                 );
-                capabilities.context.getParent.andReturn(mockParentObject);
+                capabilities.context.getParent.and.returnValue(mockParentObject);
 
                 parentCapabilities.action = jasmine.createSpyObj(
                     "actionCapability",
@@ -97,37 +97,37 @@ define(
                     domainObject: mockDomainObject
                 };
 
-                mockDomainObject.getCapability.andCallFake(function (name) {
+                mockDomainObject.getCapability.and.callFake(function (name) {
                     return capabilities[name];
                 });
 
-                mockDomainObject.hasCapability.andCallFake(function (name) {
+                mockDomainObject.hasCapability.and.callFake(function (name) {
                     return !!capabilities[name];
                 });
 
-                capabilities.editor.finish.andReturn(mockPromise(true));
+                capabilities.editor.finish.and.returnValue(mockPromise(true));
 
                 action = new CancelAction(actionContext);
 
             });
 
             it("only applies to domain object that is being edited", function () {
-                capabilities.editor.isEditContextRoot.andReturn(true);
+                capabilities.editor.isEditContextRoot.and.returnValue(true);
                 expect(CancelAction.appliesTo(actionContext)).toBeTruthy();
                 expect(mockDomainObject.hasCapability).toHaveBeenCalledWith("editor");
 
-                capabilities.editor.isEditContextRoot.andReturn(false);
+                capabilities.editor.isEditContextRoot.and.returnValue(false);
                 expect(CancelAction.appliesTo(actionContext)).toBeFalsy();
 
-                mockDomainObject.hasCapability.andReturn(false);
+                mockDomainObject.hasCapability.and.returnValue(false);
                 expect(CancelAction.appliesTo(actionContext)).toBeFalsy();
             });
 
             it("invokes the editor capability's cancel functionality when" +
                 " performed", function () {
-                mockDomainObject.getModel.andReturn({persisted: 1});
+                mockDomainObject.getModel.and.returnValue({persisted: 1});
                 //Return true from navigate action
-                capabilities.action.perform.andReturn(mockPromise(true));
+                capabilities.action.perform.and.returnValue(mockPromise(true));
                 action.perform();
 
                 // Should have called finish
@@ -138,15 +138,15 @@ define(
             });
 
             it("navigates to object if existing using navigate action", function () {
-                mockDomainObject.getModel.andReturn({persisted: 1});
+                mockDomainObject.getModel.and.returnValue({persisted: 1});
                 //Return true from navigate action
-                capabilities.action.perform.andReturn(mockPromise(true));
+                capabilities.action.perform.and.returnValue(mockPromise(true));
                 action.perform();
                 expect(capabilities.action.perform).toHaveBeenCalledWith("navigate");
             });
 
             it("navigates to parent if new using navigate action", function () {
-                mockDomainObject.getModel.andReturn({persisted: undefined});
+                mockDomainObject.getModel.and.returnValue({persisted: undefined});
                 action.perform();
                 expect(parentCapabilities.action.perform).toHaveBeenCalledWith("navigate");
             });

platform/commonUI/edit/test/actions/EditActionSpec.js

@@ -66,11 +66,11 @@ define(
                     editor: mockEditor
                 };
 
-                mockDomainObject.getCapability.andCallFake(function (name) {
+                mockDomainObject.getCapability.and.callFake(function (name) {
                     return capabilities[name];
                 });
-                mockDomainObject.hasCapability.andReturn(true);
-                mockType.hasFeature.andReturn(true);
+                mockDomainObject.hasCapability.and.returnValue(true);
+                mockType.hasFeature.and.returnValue(true);
 
                 actionContext = { domainObject: mockDomainObject };
 
@@ -92,9 +92,9 @@ define(
             });
 
             it("is only applicable to objects not already in edit mode", function () {
-                mockEditor.isEditContextRoot.andReturn(false);
+                mockEditor.isEditContextRoot.and.returnValue(false);
                 expect(EditAction.appliesTo(actionContext)).toBe(true);
-                mockEditor.isEditContextRoot.andReturn(true);
+                mockEditor.isEditContextRoot.and.returnValue(true);
                 expect(EditAction.appliesTo(actionContext)).toBe(false);
             });
 

platform/commonUI/edit/test/actions/EditAndComposeActionSpec.js

@@ -71,14 +71,14 @@ define(
                 mockActionCapability = jasmine.createSpyObj("actionCapability", ["getActions"]);
                 mockEditAction = jasmine.createSpyObj("editAction", ["perform"]);
 
-                mockDomainObject.getId.andReturn("test");
-                mockDomainObject.getCapability.andReturn(mockContext);
-                mockContext.getParent.andReturn(mockParent);
-                mockType.hasFeature.andReturn(true);
-                mockType.getKey.andReturn("layout");
-                mockComposition.invoke.andReturn(mockPromise(true));
-                mockComposition.add.andReturn(mockPromise(true));
-                mockActionCapability.getActions.andReturn([]);
+                mockDomainObject.getId.and.returnValue("test");
+                mockDomainObject.getCapability.and.returnValue(mockContext);
+                mockContext.getParent.and.returnValue(mockParent);
+                mockType.hasFeature.and.returnValue(true);
+                mockType.getKey.and.returnValue("layout");
+                mockComposition.invoke.and.returnValue(mockPromise(true));
+                mockComposition.add.and.returnValue(mockPromise(true));
+                mockActionCapability.getActions.and.returnValue([]);
 
                 capabilities = {
                     composition: mockComposition,
@@ -105,14 +105,14 @@ define(
             });
 
             it("enables edit mode for objects that have an edit action", function () {
-                mockActionCapability.getActions.andReturn([mockEditAction]);
+                mockActionCapability.getActions.and.returnValue([mockEditAction]);
                 action.perform();
                 expect(mockEditAction.perform).toHaveBeenCalled();
             });
 
             it("Does not enable edit mode for objects that do not have an" +
                 " edit action", function () {
-                mockActionCapability.getActions.andReturn([]);
+                mockActionCapability.getActions.and.returnValue([]);
                 action.perform();
                 expect(mockEditAction.perform).not.toHaveBeenCalled();
                 expect(mockComposition.add)

platform/commonUI/edit/test/actions/PropertiesActionSpec.js

@@ -71,8 +71,8 @@ define(
                     }
                 };
 
-                capabilities.type.hasFeature.andReturn(true);
-                capabilities.mutation.andReturn(true);
+                capabilities.type.hasFeature.and.returnValue(true);
+                capabilities.mutation.and.returnValue(true);
 
                 action = new PropertiesAction(dialogService, context);
             });
@@ -80,7 +80,7 @@ define(
             it("mutates an object when performed", function () {
                 action.perform();
                 expect(capabilities.mutation).toHaveBeenCalled();
-                capabilities.mutation.mostRecentCall.args[0]({});
+                capabilities.mutation.calls.mostRecent().args[0]({});
             });
 
             it("does not muate object upon cancel", function () {

platform/commonUI/edit/test/actions/RemoveActionSpec.js

@@ -25,50 +25,37 @@ define(
     function (RemoveAction) {
 
         describe("The Remove action", function () {
-            var mockQ,
-                mockNavigationService,
-                mockDomainObject,
-                mockParent,
-                mockChildObject,
-                mockGrandchildObject,
-                mockRootObject,
-                mockContext,
-                mockChildContext,
-                mockGrandchildContext,
-                mockRootContext,
-                mockMutation,
-                mockType,
+            var action,
                 actionContext,
-                model,
                 capabilities,
-                action;
-
-            function mockPromise(value) {
-                return {
-                    then: function (callback) {
-                        return mockPromise(callback(value));
-                    }
-                };
-            }
+                mockContext,
+                mockDialogService,
+                mockDomainObject,
+                mockMutation,
+                mockNavigationService,
+                mockParent,
+                mockType,
+                model;
 
             beforeEach(function () {
                 mockDomainObject = jasmine.createSpyObj(
                     "domainObject",
-                    ["getId", "getCapability"]
+                    ["getId", "getCapability", "getModel"]
                 );
-                mockChildObject = jasmine.createSpyObj(
-                    "domainObject",
-                    ["getId", "getCapability"]
-                );
-                mockGrandchildObject = jasmine.createSpyObj(
-                    "domainObject",
-                    ["getId", "getCapability"]
-                );
-                mockRootObject = jasmine.createSpyObj(
-                    "domainObject",
-                    ["getId", "getCapability"]
-                );
-                mockQ = { when: mockPromise };
+
+                mockMutation = jasmine.createSpyObj("mutation", ["invoke"]);
+                mockType = jasmine.createSpyObj("type", ["hasFeature"]);
+                mockType.hasFeature.and.returnValue(true);
+
+                capabilities = {
+                    mutation: mockMutation,
+                    type: mockType
+                };
+
+                model = {
+                    composition: ["a", "test", "b"]
+                };
+
                 mockParent = {
                     getModel: function () {
                         return model;
@@ -80,12 +67,12 @@ define(
                         return capabilities[k].invoke(v);
                     }
                 };
-                mockContext = jasmine.createSpyObj("context", ["getParent"]);
-                mockChildContext = jasmine.createSpyObj("context", ["getParent"]);
-                mockGrandchildContext = jasmine.createSpyObj("context", ["getParent"]);
-                mockRootContext = jasmine.createSpyObj("context", ["getParent"]);
-                mockMutation = jasmine.createSpyObj("mutation", ["invoke"]);
-                mockType = jasmine.createSpyObj("type", ["hasFeature"]);
+
+                mockDialogService = jasmine.createSpyObj(
+                    "dialogService",
+                    ["showBlockingMessage"]
+                );
+
                 mockNavigationService = jasmine.createSpyObj(
                     "navigationService",
                     [
@@ -95,31 +82,27 @@ define(
                         "removeListener"
                     ]
                 );
-                mockNavigationService.getNavigation.andReturn(mockDomainObject);
+                mockNavigationService.getNavigation.and.returnValue(mockDomainObject);
 
+                mockContext = jasmine.createSpyObj("context", ["getParent"]);
+                mockContext.getParent.and.returnValue(mockParent);
 
-                mockDomainObject.getId.andReturn("test");
-                mockDomainObject.getCapability.andReturn(mockContext);
-                mockContext.getParent.andReturn(mockParent);
-                mockType.hasFeature.andReturn(true);
+                mockDomainObject.getId.and.returnValue("test");
+                mockDomainObject.getCapability.and.returnValue(mockContext);
+                mockDomainObject.getModel.and.returnValue({name: 'test object'});
 
-                capabilities = {
-                    mutation: mockMutation,
-                    type: mockType
-                };
-                model = {
-                    composition: ["a", "test", "b"]
-                };
+                mockContext.getParent.and.returnValue(mockParent);
+                mockType.hasFeature.and.returnValue(true);
 
                 actionContext = { domainObject: mockDomainObject };
 
-                action = new RemoveAction(mockNavigationService, actionContext);
+                action = new RemoveAction(mockDialogService, mockNavigationService, actionContext);
             });
 
             it("only applies to objects with parents", function () {
                 expect(RemoveAction.appliesTo(actionContext)).toBeTruthy();
 
-                mockContext.getParent.andReturn(undefined);
+                mockContext.getParent.and.returnValue(undefined);
 
                 expect(RemoveAction.appliesTo(actionContext)).toBeFalsy();
 
@@ -127,83 +110,157 @@ define(
                 expect(mockType.hasFeature).toHaveBeenCalledWith('creation');
             });
 
-            it("mutates the parent when performed", function () {
-                action.perform();
-                expect(mockMutation.invoke)
-                    .toHaveBeenCalledWith(jasmine.any(Function));
-            });
-
-            it("changes composition from its mutation function", function () {
-                var mutator, result;
-                action.perform();
-                mutator = mockMutation.invoke.mostRecentCall.args[0];
-                result = mutator(model);
-
-                // Should not have cancelled the mutation
-                expect(result).not.toBe(false);
-
-                // Simulate mutate's behavior (remove can either return a
-                // new model or modify this one in-place)
-                result = result || model;
-
-                // Should have removed "test" - that was our
-                // mock domain object's id.
-                expect(result.composition).toEqual(["a", "b"]);
-            });
-
-            it("removes parent of object currently navigated to", function () {
-                // Navigates to child object
-                mockNavigationService.getNavigation.andReturn(mockChildObject);
-
-                // Test is id of object being removed
-                // Child object has different id
-                mockDomainObject.getId.andReturn("test");
-                mockChildObject.getId.andReturn("not test");
-
-                // Sets context for the child and domainObject
-                mockDomainObject.getCapability.andReturn(mockContext);
-                mockChildObject.getCapability.andReturn(mockChildContext);
-
-                // Parents of child and domainObject are set
-                mockContext.getParent.andReturn(mockParent);
-                mockChildContext.getParent.andReturn(mockDomainObject);
-
-                mockType.hasFeature.andReturn(true);
+            it("shows a blocking message dialog", function () {
+                mockParent = jasmine.createSpyObj(
+                    "parent",
+                    ["getModel", "getCapability", "useCapability"]
+                );
 
                 action.perform();
 
-                // Expects navigation to parent of domainObject (removed object)
-                expect(mockNavigationService.setNavigation).toHaveBeenCalledWith(mockParent);
+                expect(mockDialogService.showBlockingMessage).toHaveBeenCalled();
+
+                // Also check that no mutation happens at this point
+                expect(mockParent.useCapability).not.toHaveBeenCalledWith("mutation", jasmine.any(Function));
             });
 
-            it("checks if removing object not in ascendent path (reaches ROOT)", function () {
-                // Navigates to grandchild of ROOT
-                mockNavigationService.getNavigation.andReturn(mockGrandchildObject);
+            it("does not show a blocking message dialog when true is passed to perform", function () {
+                mockParent = jasmine.createSpyObj(
+                    "parent",
+                    ["getModel", "getCapability", "useCapability"]
+                );
 
-                // domainObject (grandparent) is set as ROOT, child and grandchild
-                // are set objects not being removed
-                mockDomainObject.getId.andReturn("test 1");
-                mockRootObject.getId.andReturn("ROOT");
-                mockChildObject.getId.andReturn("not test 2");
-                mockGrandchildObject.getId.andReturn("not test 3");
+                action.perform(true);
 
-                // Sets context for the grandchild, child, and domainObject
-                mockRootObject.getCapability.andReturn(mockRootContext);
-                mockChildObject.getCapability.andReturn(mockChildContext);
-                mockGrandchildObject.getCapability.andReturn(mockGrandchildContext);
-
-                // Parents of grandchild and child are set
-                mockChildContext.getParent.andReturn(mockRootObject);
-                mockGrandchildContext.getParent.andReturn(mockChildObject);
-
-                mockType.hasFeature.andReturn(true);
-
-                action.perform();
-
-                // Expects no navigation to occur
-                expect(mockNavigationService.setNavigation).not.toHaveBeenCalled();
+                expect(mockDialogService.showBlockingMessage).not.toHaveBeenCalled();
             });
 
+            describe("after the remove callback is triggered", function () {
+                var mockChildContext,
+                    mockChildObject,
+                    mockDialogHandle,
+                    mockGrandchildContext,
+                    mockGrandchildObject,
+                    mockRootContext,
+                    mockRootObject;
+
+                beforeEach(function () {
+                    mockChildObject = jasmine.createSpyObj(
+                        "domainObject",
+                        ["getId", "getCapability"]
+                    );
+
+                    mockDialogHandle = jasmine.createSpyObj(
+                        "dialogHandle",
+                        ["dismiss"]
+                    );
+
+                    mockGrandchildObject = jasmine.createSpyObj(
+                        "domainObject",
+                        ["getId", "getCapability"]
+                    );
+
+                    mockRootObject = jasmine.createSpyObj(
+                        "domainObject",
+                        ["getId", "getCapability"]
+                    );
+
+                    mockChildContext = jasmine.createSpyObj("context", ["getParent"]);
+                    mockGrandchildContext = jasmine.createSpyObj("context", ["getParent"]);
+                    mockRootContext = jasmine.createSpyObj("context", ["getParent"]);
+
+                    mockDialogService.showBlockingMessage.and.returnValue(mockDialogHandle);
+                });
+
+                it("mutates the parent when performed", function () {
+                    action.perform();
+                    mockDialogService.showBlockingMessage.calls.mostRecent().args[0]
+                        .primaryOption.callback();
+
+                    expect(mockMutation.invoke)
+                        .toHaveBeenCalledWith(jasmine.any(Function));
+                });
+
+                it("changes composition from its mutation function", function () {
+                    var mutator, result;
+
+                    action.perform();
+                    mockDialogService.showBlockingMessage.calls.mostRecent().args[0]
+                        .primaryOption.callback();
+
+                    mutator = mockMutation.invoke.calls.mostRecent().args[0];
+                    result = mutator(model);
+
+                    // Should not have cancelled the mutation
+                    expect(result).not.toBe(false);
+
+                    // Simulate mutate's behavior (remove can either return a
+                    // new model or modify this one in-place)
+                    result = result || model;
+
+                    // Should have removed "test" - that was our
+                    // mock domain object's id.
+                    expect(result.composition).toEqual(["a", "b"]);
+                });
+
+                it("removes parent of object currently navigated to", function () {
+                    // Navigates to child object
+                    mockNavigationService.getNavigation.and.returnValue(mockChildObject);
+
+                    // Test is id of object being removed
+                    // Child object has different id
+                    mockDomainObject.getId.and.returnValue("test");
+                    mockChildObject.getId.and.returnValue("not test");
+
+                    // Sets context for the child and domainObject
+                    mockDomainObject.getCapability.and.returnValue(mockContext);
+                    mockChildObject.getCapability.and.returnValue(mockChildContext);
+
+                    // Parents of child and domainObject are set
+                    mockContext.getParent.and.returnValue(mockParent);
+                    mockChildContext.getParent.and.returnValue(mockDomainObject);
+
+                    mockType.hasFeature.and.returnValue(true);
+
+                    action.perform();
+                    mockDialogService.showBlockingMessage.calls.mostRecent().args[0]
+                        .primaryOption.callback();
+
+                    // Expects navigation to parent of domainObject (removed object)
+                    expect(mockNavigationService.setNavigation).toHaveBeenCalledWith(mockParent);
+                });
+
+                it("checks if removing object not in ascendent path (reaches ROOT)", function () {
+                    // Navigates to grandchild of ROOT
+                    mockNavigationService.getNavigation.and.returnValue(mockGrandchildObject);
+
+                    // domainObject (grandparent) is set as ROOT, child and grandchild
+                    // are set objects not being removed
+                    mockDomainObject.getId.and.returnValue("test 1");
+                    mockRootObject.getId.and.returnValue("ROOT");
+                    mockChildObject.getId.and.returnValue("not test 2");
+                    mockGrandchildObject.getId.and.returnValue("not test 3");
+
+                    // Sets context for the grandchild, child, and domainObject
+                    mockRootObject.getCapability.and.returnValue(mockRootContext);
+                    mockChildObject.getCapability.and.returnValue(mockChildContext);
+                    mockGrandchildObject.getCapability.and.returnValue(mockGrandchildContext);
+
+                    // Parents of grandchild and child are set
+                    mockChildContext.getParent.and.returnValue(mockRootObject);
+                    mockGrandchildContext.getParent.and.returnValue(mockChildObject);
+
+                    mockType.hasFeature.and.returnValue(true);
+
+                    action.perform();
+                    mockDialogService.showBlockingMessage.calls.mostRecent().args[0]
+                        .primaryOption.callback();
+
+                    // Expects no navigation to occur
+                    expect(mockNavigationService.setNavigation).not.toHaveBeenCalled();
+                });
+
+            });
         });
     }
 );

platform/commonUI/edit/test/actions/SaveActionSpec.js

@@ -19,7 +19,7 @@
  * this source code distribution or the Licensing information page available
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
-/*global describe,it,expect,beforeEach,jasmine,waitsFor,runs*/
+/*global describe,it,expect,beforeEach,jasmine*/
 
 define(
     ["../../src/actions/SaveAction"],
@@ -81,13 +81,13 @@ define(
                     ["info", "error"]
                 );
 
-                mockDomainObject.hasCapability.andReturn(true);
-                mockDomainObject.getCapability.andCallFake(function (capability) {
+                mockDomainObject.hasCapability.and.returnValue(true);
+                mockDomainObject.getCapability.and.callFake(function (capability) {
                     return capabilities[capability];
                 });
-                mockDomainObject.getModel.andReturn({persisted: 0});
-                mockEditorCapability.save.andReturn(mockPromise(true));
-                mockEditorCapability.isEditContextRoot.andReturn(true);
+                mockDomainObject.getModel.and.returnValue({persisted: 0});
+                mockEditorCapability.save.and.returnValue(mockPromise(true));
+                mockEditorCapability.isEditContextRoot.and.returnValue(true);
 
                 action = new SaveAction(mockDialogService, mockNotificationService, actionContext);
             });
@@ -96,14 +96,14 @@ define(
                 expect(SaveAction.appliesTo(actionContext)).toBe(true);
                 expect(mockDomainObject.hasCapability).toHaveBeenCalledWith("editor");
 
-                mockDomainObject.hasCapability.andReturn(false);
-                mockDomainObject.getCapability.andReturn(undefined);
+                mockDomainObject.hasCapability.and.returnValue(false);
+                mockDomainObject.getCapability.and.returnValue(undefined);
                 expect(SaveAction.appliesTo(actionContext)).toBe(false);
             });
 
             it("only applies to domain object that has already been persisted",
                 function () {
-                    mockDomainObject.getModel.andReturn({persisted: undefined});
+                    mockDomainObject.getModel.and.returnValue({persisted: undefined});
                     expect(SaveAction.appliesTo(actionContext)).toBe(false);
                 });
 
@@ -118,11 +118,11 @@ define(
 
                 beforeEach(function () {
                     mockDialogHandle = jasmine.createSpyObj("dialogHandle", ["dismiss"]);
-                    mockDialogService.showBlockingMessage.andReturn(mockDialogHandle);
+                    mockDialogService.showBlockingMessage.and.returnValue(mockDialogHandle);
                 });
 
                 it("shows a dialog while saving", function () {
-                    mockEditorCapability.save.andReturn(new Promise(function () {
+                    mockEditorCapability.save.and.returnValue(new Promise(function () {
                     }));
                     action.perform();
                     expect(mockDialogService.showBlockingMessage).toHaveBeenCalled();
@@ -137,12 +137,8 @@ define(
 
                 it("notifies if saving succeeded", function () {
                     var mockCallback = jasmine.createSpy("callback");
-                    mockEditorCapability.save.andReturn(Promise.resolve("success"));
-                    action.perform().then(mockCallback);
-                    waitsFor(function () {
-                        return mockCallback.calls.length > 0;
-                    });
-                    runs(function () {
+                    mockEditorCapability.save.and.returnValue(Promise.resolve());
+                    return action.perform().then(mockCallback).then(function () {
                         expect(mockNotificationService.info).toHaveBeenCalled();
                         expect(mockNotificationService.error).not.toHaveBeenCalled();
                     });
@@ -150,12 +146,8 @@ define(
 
                 it("notifies if saving failed", function () {
                     var mockCallback = jasmine.createSpy("callback");
-                    mockEditorCapability.save.andReturn(Promise.reject("some failure reason"));
-                    action.perform().then(mockCallback);
-                    waitsFor(function () {
-                        return mockCallback.calls.length > 0;
-                    });
-                    runs(function () {
+                    mockEditorCapability.save.and.returnValue(Promise.reject("some failure reason"));
+                    return action.perform().then(mockCallback).then(function () {
                         expect(mockNotificationService.error).toHaveBeenCalled();
                         expect(mockNotificationService.info).not.toHaveBeenCalled();
                     });