MDL-67264 lib modal: Add deffered promises to content promises

lib/amd/src/modal.js

@@ -74,9 +74,13 @@ define([
         this.root = $(root);
         this.modal = this.root.find(SELECTORS.MODAL);
         this.header = this.modal.find(SELECTORS.HEADER);
+        this.headerPromise = $.Deferred();
         this.title = this.header.find(SELECTORS.TITLE);
+        this.titlePromise = $.Deferred();
         this.body = this.modal.find(SELECTORS.BODY);
+        this.bodyPromise = $.Deferred();
         this.footer = this.modal.find(SELECTORS.FOOTER);
+        this.footerPromise = $.Deferred();
         this.hiddenSiblings = [];
         this.isAttached = false;
         this.bodyJS = null;
@@ -229,6 +233,36 @@ define([
         return this.footer;
     };
 
+    /**
+     * Get a promise resolving to the title region.
+     *
+     * @method getTitlePromise
+     * @return {Promise}
+     */
+    Modal.prototype.getTitlePromise = function() {
+        return this.titlePromise;
+    };
+
+    /**
+     * Get a promise resolving to the body region.
+     *
+     * @method getBodyPromise
+     * @return {object} jQuery object
+     */
+    Modal.prototype.getBodyPromise = function() {
+        return this.bodyPromise;
+    };
+
+    /**
+     * Get a promise resolving to the footer region.
+     *
+     * @method getFooterPromise
+     * @return {object} jQuery object
+     */
+    Modal.prototype.getFooterPromise = function() {
+        return this.footerPromise;
+    };
+
     /**
      * Get the unique modal count.
      *
@@ -250,8 +284,13 @@ define([
      */
     Modal.prototype.setTitle = function(value) {
         var title = this.getTitle();
+        this.titlePromise = $.Deferred();
 
-        this.asyncSet(value, title.html.bind(title));
+        this.asyncSet(value, title.html.bind(title))
+        .then(function() {
+            this.titlePromise.resolve(title);
+        }.bind(this))
+        .catch(Notification.exception);
     };
 
     /**
@@ -264,6 +303,8 @@ define([
      * @param {(string|object)} value The body string or jQuery promise which resolves to the body.
      */
     Modal.prototype.setBody = function(value) {
+        this.bodyPromise = $.Deferred();
+
         var body = this.getBody();
 
         if (typeof value === 'string') {
@@ -271,6 +312,7 @@ define([
             body.html(value);
             Event.notifyFilterContentUpdated(body);
             this.getRoot().trigger(ModalEvents.bodyRendered, this);
+            this.bodyPromise.resolve(body);
         } else {
             var jsPendingId = 'amd-modal-js-pending-id-' + this.getModalCount();
             M.util.js_pending(jsPendingId);
@@ -360,6 +402,10 @@ define([
                 this.getRoot().trigger(ModalEvents.bodyRendered, this);
                 return result;
             }.bind(this))
+            .then(function() {
+                this.bodyPromise.resolve(body);
+                return;
+            }.bind(this))
             .fail(Notification.exception)
             .always(function() {
                 // When we're done displaying all of the content we need
@@ -389,32 +435,43 @@ define([
     Modal.prototype.setFooter = function(value) {
         // Make sure the footer is visible.
         this.showFooter();
+        this.footerPromise = $.Deferred();
 
         var footer = this.getFooter();
 
         if (typeof value === 'string') {
             // Just set the value if it's a string.
             footer.html(value);
+            this.footerPromise.resolve(footer);
         } else {
             // Otherwise we assume it's a promise to be resolved with
             // html and javascript.
-            Templates.render(TEMPLATES.LOADING, {}).done(function(html) {
+            Templates.render(TEMPLATES.LOADING, {})
+            .then(function(html) {
                 footer.html(html);
 
-                value.done(function(html, js) {
+                return value;
-                    footer.html(html);
+            })
+            .then(function(html, js) {
+                footer.html(html);
 
-                    if (js) {
+                if (js) {
-                        if (this.isAttached) {
+                    if (this.isAttached) {
-                            // If we're in the DOM then run the JS immediately.
+                        // If we're in the DOM then run the JS immediately.
-                            Templates.runTemplateJS(js);
+                        Templates.runTemplateJS(js);
-                        } else {
+                    } else {
-                            // Otherwise cache it to be run when we're attached.
+                        // Otherwise cache it to be run when we're attached.
-                            this.footerJS = js;
+                        this.footerJS = js;
-                        }
                     }
-                }.bind(this));
+                }
-            }.bind(this));
+
+                return footer;
+            }.bind(this))
+            .then(function(footer) {
+                this.footerPromise.resolve(footer);
+                return;
+            }.bind(this))
+            .catch(Notification.exception);
         }
     };