DevTools: Get rid of synchronous XHRs in the frontend code

Source/devtools/front_end/sources/ScriptFormatter.js

 /*
  * Copyright (C) 2011 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 87 matching lines @@
      * @param {string} mimeType
      * @param {string} content
      * @param {function(string, !WebInspector.FormatterSourceMapping)} callback
      */
     formatContent: function(mimeType, content, callback)
     {
         content = content.replace(/\r\n?|[\n\u2028\u2029]/g, "\n").replace(/^\uFEFF/, '');
         const method = "format";
         var parameters = { mimeType: mimeType, content: content, indentString: WebInspector.settings.textEditorIndent.get() };
         this._tasks.push({ data: parameters, callback: callback });
-        this._worker.postMessage({ method: method, params: parameters });
+        this._postMessage({ method: method, params: parameters });
     },
 
     _didFormatContent: function(event)
     {
         var task = this._tasks.shift();
         var originalContent = task.data.content;
         var formattedContent = event.data.content;
         var mapping = event.data["mapping"];
         var sourceMapping = new WebInspector.FormatterSourceMappingImpl(originalContent.lineEndings(), formattedContent.lineEndings(), mapping);
         task.callback(formattedContent, sourceMapping);
     },
 
     /**
-     * @return {!Worker}
+     * @param {!Object} message
      */
-    get _worker()
+    _postMessage: function(message)
     {
-        if (!this._cachedWorker) {
-            this._cachedWorker = Runtime.startWorker("script_formatter_worker");
+        this._workerPromise().then(postMessage.bind(this));
+
+        /**
+         * @this {WebInspector.ScriptFormatter}
+         */
+        function postMessage()
+        {
+            this._cachedWorker.postMessage(message);
+        }
+    },
+
+    /**
+     * @return {!Promise.<undefined>}
+     */
+    _workerPromise: function()
+    {
+        if (this._cachedWorker)
+            return Promise.resolve(this._cachedWorker);
+
+        return Runtime.startWorker("script_formatter_worker").then(started.bind(this));

[pfeldman, 2014/11/07 14:51:17]

You want to store this resulting promise and return it to subsequent calls.

[apavlov, 2014/11/10 07:44:12]

Done.

+
+        /**
+         * @param {!Worker} worker
+         * @this {WebInspector.ScriptFormatter}
+         */
+        function started(worker)
+        {
+            this._cachedWorker = worker;
             this._cachedWorker.onmessage = /** @type {function(this:Worker)} */ (this._didFormatContent.bind(this));
         }
-        return this._cachedWorker;
     }
 }
 
 /**
  * @constructor
  * @implements {WebInspector.Formatter}
  */
 WebInspector.IdentityFormatter = function()
 {
     this._tasks = [];
@@ skipping 120 matching lines @@
      */
     _convertPosition: function(positions1, positions2, position)
     {
         var index = positions1.upperBound(position) - 1;
         var convertedPosition = positions2[index] + position - positions1[index];
         if (index < positions2.length - 1 && convertedPosition > positions2[index + 1])
             convertedPosition = positions2[index + 1];
         return convertedPosition;
     }
 }