DevTools: [CSS] promisify CSSStyleModel fetching methods

Source/devtools/front_end/audits/AuditRules.js

 /*
  * Copyright (C) 2010 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 899 matching lines @@
                 var entry = entry || result.addChild(WebInspector.UIString("A width and height should be specified for all images in order to speed up page display. The following image(s) are missing a width and/or height:"), true);
                 var format = "%r";
                 if (urlToNoDimensionCount[url] > 1)
                     format += " (%d uses)";
                 entry.addFormatted(format, url, urlToNoDimensionCount[url]);
                 result.violationCount++;
             }
             callback(entry ? result : null);
         }
 
-        function imageStylesReady(imageId, styles, isLastStyle, computedStyle)
+        function imageStylesReady(imageId, styles)
         {
             if (progress.isCanceled()) {
                 callback(null);
                 return;
             }
 
             const node = domModel.nodeForId(imageId);
             var src = node.getAttribute("src");
             if (!src.asParsedURL()) {
                 for (var frameOwnerCandidate = node; frameOwnerCandidate; frameOwnerCandidate = frameOwnerCandidate.parentNode) {
                     if (frameOwnerCandidate.baseURL) {
                         var completeSrc = WebInspector.ParsedURL.completeURL(frameOwnerCandidate.baseURL, src);
                         break;
                     }
                 }
             }
             if (completeSrc)
                 src = completeSrc;
 
-            if (computedStyle.getPropertyValue("position") === "absolute") {
-                if (isLastStyle)
-                    doneCallback();
+            if (styles.computedStyle.getPropertyValue("position") === "absolute")
                 return;
-            }
 
             if (styles.attributesStyle) {
                 var widthFound = !!styles.attributesStyle.getLiveProperty("width");
                 var heightFound = !!styles.attributesStyle.getLiveProperty("height");
             }
 
             var inlineStyle = styles.inlineStyle;
             if (inlineStyle) {
                 if (inlineStyle.getPropertyValue("width") !== "")
                     widthFound = true;
                 if (inlineStyle.getPropertyValue("height") !== "")
                     heightFound = true;
             }
 
             for (var i = styles.matchedCSSRules.length - 1; i >= 0 && !(widthFound && heightFound); --i) {
                 var style = styles.matchedCSSRules[i].style;
                 if (style.getPropertyValue("width") !== "")
                     widthFound = true;
                 if (style.getPropertyValue("height") !== "")
                     heightFound = true;
             }
 
             if (!widthFound || !heightFound) {
                 if (src in urlToNoDimensionCount)
                     ++urlToNoDimensionCount[src];
                 else
                     urlToNoDimensionCount[src] = 1;
             }
-
-            if (isLastStyle)
-                doneCallback();
         }
 
         /**
          * @param {!Array.<!DOMAgent.NodeId>=} nodeIds
          */
         function getStyles(nodeIds)
         {
             if (progress.isCanceled()) {
                 callback(null);
                 return;
@@ skipping 13 matching lines @@
 
             /**
              * @param {?WebInspector.CSSStyleModel.MatchedStyleResult} matchedStyleResult
              */
             function matchedCallback(matchedStyleResult)
             {
                 if (matchedStyleResult)
                     targetResult.matchedCSSRules = matchedStyleResult.matchedCSSRules;
             }
 
+            /**
+             * @param {?WebInspector.CSSStyleDeclaration} computedStyle
+             */
+            function computedCallback(computedStyle)
+            {
+                targetResult.computedStyle = computedStyle;
+            }
+
             if (!nodeIds || !nodeIds.length)
                 doneCallback();
 
+            var nodePromises = [];
             for (var i = 0; nodeIds && i < nodeIds.length; ++i) {
-                cssModel.getMatchedStylesAsync(nodeIds[i], false, false, matchedCallback);
-                cssModel.getInlineStylesAsync(nodeIds[i], inlineCallback);
-                cssModel.getComputedStyleAsync(nodeIds[i], imageStylesReady.bind(null, nodeIds[i], targetResult, i === nodeIds.length - 1));
+                var stylePromises = [
+                    cssModel.matchedStylesPromise(nodeIds[i], false, false).then(matchedCallback),
+                    cssModel.inlineStylesPromise(nodeIds[i]).then(inlineCallback),
+                    cssModel.computedStylePromise(nodeIds[i]).then(computedCallback)
+                ];
+                var nodePromise = Promise.all(stylePromises).then(imageStylesReady.bind(null, nodeIds[i], targetResult));
+                nodePromises.push(nodePromise);
             }
+            Promise.all(nodePromises)
+                .catchException(null)
+                .then(doneCallback);
         }
 
         function onDocumentAvailable(root)
         {
             if (progress.isCanceled()) {
                 callback(null);
                 return;
             }
             domModel.querySelectorAll(root.id, "img[src]", getStyles);
         }
@@ skipping 650 matching lines @@
         result.violationCount = badUrls.length;
     },
 
     _collectorCallback: function(matchingResourceData, request, cookie)
     {
         matchingResourceData[request.url] = (matchingResourceData[request.url] || 0) + cookie.size();
     },
 
     __proto__: WebInspector.AuditRules.CookieRuleBase.prototype
 }