DevTools: fix race when revealing formatted source code

third_party/WebKit/Source/devtools/front_end/sources/SourceFormatter.js

 // Copyright 2017 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 Sources.SourceFormatData = class {
   /**
    * @param {!Workspace.UISourceCode} originalSourceCode
    * @param {!Workspace.UISourceCode} formattedSourceCode
    * @param {!Sources.FormatterSourceMapping} mapping
    */
@@ skipping 18 matching lines @@
 
 Sources.SourceFormatData._formatDataSymbol = Symbol('formatData');
 
 Sources.SourceFormatter = class {
   constructor() {
     this._projectId = 'formatter:';
     this._project = new Bindings.ContentProviderBasedProject(
         Workspace.workspace, this._projectId, Workspace.projectTypes.Formatter, 'formatter',
         true /* isServiceProject */);
 
-    /** @type {!Map<string, !Workspace.UISourceCode>} */
+    /** @type {!Map<string, !Promise<!Sources.SourceFormatData>>} */
     this._formattedPaths = new Map();
     this._scriptMapping = new Sources.SourceFormatter.ScriptMapping();
     this._styleMapping = new Sources.SourceFormatter.StyleMapping();
     Workspace.workspace.addEventListener(
         Workspace.Workspace.Events.UISourceCodeRemoved, this._onUISourceCodeRemoved, this);
   }
 
   /**
    * @param {!Common.Event} event
    */
   _onUISourceCodeRemoved(event) {
     var uiSourceCode = /** @type {!Workspace.UISourceCode} */ (event.data);
-    var formattedUISourceCode = this._formattedPaths.get(uiSourceCode.project().id() + ':' + uiSourceCode.url());
-    if (formattedUISourceCode)
-      this.discardFormattedUISourceCode(formattedUISourceCode);
+    var formatDataPromise = this._formattedPaths.get(uiSourceCode.project().id() + ':' + uiSourceCode.url());
+    if (formatDataPromise)
+      formatDataPromise.then(formatData => this.discardFormattedUISourceCode(formatData.formattedSourceCode));

[lushnikov, 2017/05/17 23:39:08]

Since you're caching per projectId + uiSourceCodeURL, do you expect the
_uiSourceCodeRemoved to happen multiple times?

In this case, the discardFormattedUISourceCode might be called multiple times,
which you probably don't want.

(However, caching by project.id() + url is almost the same as caching by
UISourceCode instance itself)

[lushnikov, 2017/05/17 23:57:32]

this._formattedPath.delete(path);

   }
 
   /**
    * @param {!Workspace.UISourceCode} formattedUISourceCode
    * @return {?Workspace.UISourceCode}
    */
   discardFormattedUISourceCode(formattedUISourceCode) {
     var formatData = Sources.SourceFormatData._for(formattedUISourceCode);
     if (!formatData)
       return null;
 
     delete formattedUISourceCode[Sources.SourceFormatData._formatDataSymbol];
     this._scriptMapping._setSourceMappingEnabled(formatData, false);
     this._styleMapping._setSourceMappingEnabled(formatData, false);
     this._project.removeFile(formattedUISourceCode.url());
-    this._formattedPaths.remove(formatData.originalPath());
-    return formatData.originalSourceCode;
+    var originalSourceCode = formatData.originalSourceCode;
+    this._formattedPaths.remove(originalSourceCode.project().id() + ':' + originalSourceCode.url());
+    return originalSourceCode;
   }
 
   /**
    * @param {!Workspace.UISourceCode} uiSourceCode
    * @return {boolean}
    */
   hasFormatted(uiSourceCode) {
     return this._formattedPaths.has(uiSourceCode.project().id() + ':' + uiSourceCode.url());
   }
 
   /**
    * @param {!Workspace.UISourceCode} uiSourceCode
    * @return {!Promise<!Sources.SourceFormatData>}
    */
   async format(uiSourceCode) {
-    var formattedUISourceCode = this._formattedPaths.get(uiSourceCode.project().id() + ':' + uiSourceCode.url());
-    if (formattedUISourceCode)
-      return Sources.SourceFormatData._for(formattedUISourceCode);
+    var path = uiSourceCode.project().id() + ':' + uiSourceCode.url();
+    var resultPromise = this._formattedPaths.get(path);
+    if (resultPromise)
+      return resultPromise;
 
+    var fulfillFormatPromise;
+    resultPromise = new Promise(fulfill => {
+      fulfillFormatPromise = fulfill;
+    });
+    this._formattedPaths.set(path, resultPromise);
     var content = await uiSourceCode.requestContent();
     var highlighterType = Bindings.NetworkProject.uiSourceCodeMimeType(uiSourceCode);
-    var fulfillFormatPromise;
-    var resultPromise = new Promise(fulfill => {
-      fulfillFormatPromise = fulfill;
-    });
     Sources.Formatter.format(uiSourceCode.contentType(), highlighterType, content || '', innerCallback.bind(this));
     return resultPromise;
 
     /**
      * @this Sources.SourceFormatter
      * @param {string} formattedContent
      * @param {!Sources.FormatterSourceMapping} formatterMapping
      */
     function innerCallback(formattedContent, formatterMapping) {
       var formattedURL = uiSourceCode.url() + ':formatted';

[lushnikov, 2017/05/17 23:57:32]

if (this._formattedPaths.get(path) !== resultPromise)
    return;

[caseq, 2017/05/18 02:04:37]

Done.

       var contentProvider =
           Common.StaticContentProvider.fromString(formattedURL, uiSourceCode.contentType(), formattedContent);
       var formattedUISourceCode = this._project.addContentProvider(formattedURL, contentProvider);
       var formatData = new Sources.SourceFormatData(uiSourceCode, formattedUISourceCode, formatterMapping);
       formattedUISourceCode[Sources.SourceFormatData._formatDataSymbol] = formatData;
       this._scriptMapping._setSourceMappingEnabled(formatData, true);
       this._styleMapping._setSourceMappingEnabled(formatData, true);
 
-      var path = formatData.originalPath();
-      this._formattedPaths.set(path, formattedUISourceCode);
-
       for (var decoration of uiSourceCode.allDecorations()) {
         var range = decoration.range();
         var startLocation = formatterMapping.originalToFormatted(range.startLine, range.startColumn);
         var endLocation = formatterMapping.originalToFormatted(range.endLine, range.endColumn);
 
         formattedUISourceCode.addDecoration(
             new TextUtils.TextRange(startLocation[0], startLocation[1], endLocation[0], endLocation[1]),
             /** @type {string} */ (decoration.type()), decoration.data());
       }
 
@@ skipping 155 matching lines @@
       return;
     if (enable)
       styleHeader[Sources.SourceFormatData._formatDataSymbol] = formatData;
     else
       delete styleHeader[Sources.SourceFormatData._formatDataSymbol];
     Bindings.cssWorkspaceBinding.updateLocations(styleHeader);
   }
 };
 
 Sources.sourceFormatter = new Sources.SourceFormatter();