fix(interim): add hide queue to prevent multiple interims at same time

After this patch, the interim stack will pick up the latest element which
is not in hide process. At the moment we always take the first, but this
one can be in hide progress.

Fixes angular#6633 Fixes angular#4822

Author: devversion

src/core/services/interimElement/interimElement.js

@@ -257,7 +257,7 @@ function InterimElementProvider() {
        * A service used to control inserting and removing an element into the DOM.
        *
        */
-      var service, stack = [];
+      var service, stack = [], hideQueue = 0;
 
       // Publish instance $$interimElement service;
       // ... used as $mdDialog, $mdToast, $mdMenu, and $mdSelect
@@ -291,6 +291,12 @@ function InterimElementProvider() {
         // This hide()s only the current interim element before showing the next, new one
         // NOTE: this is not reversible (e.g. interim elements are not stackable)
 
+        if (!hideExisting) {
+          return $q(function(resolve, reject) {
+            reject("Too many interim elements in queue!");
+          })
+        }
+
         hideExisting.finally(function() {
 
           stack.push(interimElement);
@@ -323,30 +329,40 @@ function InterimElementProvider() {
        */
       function hide(reason, options) {
         if ( !stack.length ) return $q.when(reason);
+        if (hideQueue >= stack.length) return;
         options = options || {};
 
         if (options.closeAll) {
-          var promise = $q.all(stack.reverse().map(closeElement));
-          stack = [];
-          return promise;
+          return $q.all(stack.reverse().map(closeElement));
         } else if (options.closeTo !== undefined) {
-          return $q.all(stack.splice(options.closeTo).map(closeElement));
+          return $q.all(stack.slice(options.closeTo).map(closeElement));
         } else {
-          var interim = stack.pop();
-          return closeElement(interim);
+          return closeElement(stack[hideQueue]);
         }
 
         function closeElement(interim) {
+          hideQueue++;
           interim
             .remove(reason, false, options || { })
             .catch(function( reason ) {
               //$log.error("InterimElement.hide() error: " + reason );
               return reason;
+            })
+            .finally(function() {
+              handleElementHide(interim);
             });
           return interim.deferred.promise;
         }
       }
 
+      function handleElementHide(element) {
+        var index = stack.indexOf(element);
+        if (index != -1) {
+          stack.splice(index, 1);
+        }
+        hideQueue--;
+      }
+
       /*
        * @ngdoc method
        * @name $$interimElement.$service#cancel
@@ -363,11 +379,15 @@ function InterimElementProvider() {
         var interim = stack.shift();
         if ( !interim ) return $q.when(reason);
 
+        hideQueue++;
         interim
           .remove(reason, true, options || { })
           .catch(function( reason ) {
             //$log.error("InterimElement.cancel() error: " + reason );
             return reason;
+          })
+          .finally(function() {
+            hideQueue--;
           });
 
         return interim.deferred.promise;
@@ -378,7 +398,7 @@ function InterimElementProvider() {
        * Note: interim elements are in "interim containers"
        */
       function destroy(target) {
-        var interim = !target ? stack.shift() : null;
+        var interim = !target ? stack.splice(hideQueue, 1)[0] : null;
         var cntr = angular.element(target).length ? angular.element(target)[0].parentNode : null;
 
         if (cntr) {