Try to make loadCostume more readable, and revert deserializeCostume to changing the costume object directly

src/import/load-costume.js

@@ -152,6 +152,12 @@ const loadCostumeFromAsset = function (costume, costumeAsset, runtime, optVersio
  * @returns {?Promise} - a promise which will resolve after skinId is set, or null on error.
  */
 const loadCostume = function (md5ext, costume, runtime, optVersion) {
+    let costumePromise;
+    if (costume.asset) {
+        // Costume comes with asset. It could be coming from camera, image upload, drag and drop, or sb file
+        costumePromise = Promise.resolve(costume.asset);
+    } else {
+        // Need to load the costume from storage. The server should have a reference to this md5.
         if (!runtime.storage) {
             log.error('No storage module present; cannot load costume asset: ', md5ext);
             return Promise.resolve(costume);
@@ -163,10 +169,14 @@ const loadCostume = function (md5ext, costume, runtime, optVersion) {
         const ext = idParts[1].toLowerCase();
         const assetType = (ext === 'svg') ? AssetType.ImageVector : AssetType.ImageBitmap;
         costume.dataFormat = ext;
-    return (
+        costumePromise = runtime.storage.load(assetType, md5, ext);
-        (costume.asset && Promise.resolve(costume.asset)) ||
+        if (!costumePromise) {
-        runtime.storage.load(assetType, md5, ext)
+            log.error(`Couldn't fetch costume asset: ${md5ext}`);
-    ).then(costumeAsset => {
+            return;
+        }
+    }
+
+    return costumePromise.then(costumeAsset => {
         costume.asset = costumeAsset;
         return loadCostumeFromAsset(costume, costumeAsset, runtime, optVersion);
     })

src/serialization/deserialize-assets.js

@@ -79,7 +79,10 @@ const deserializeCostume = function (costume, runtime, zip, assetFileName) {
             costume.asset.dataFormat,
             new Uint8Array(Object.keys(costume.asset.data).map(key => costume.asset.data[key])),
             costume.asset.assetId
-        ));
+        ))
+        .then(asset => {
+            costume.asset = asset;
+        });
     }
 
     if (!zip) {
@@ -112,7 +115,10 @@ const deserializeCostume = function (costume, runtime, zip, assetFileName) {
         costumeFormat,
         data,
         assetId
-    ));
+    ))
+    .then(asset => {
+        costume.asset = asset;
+    });
 };
 
 module.exports = {

src/serialization/sb2.js

@@ -413,10 +413,7 @@ const parseScratchObject = function (object, runtime, extensions, topLevel, zip)
             // the file name of the costume should be the baseLayerID followed by the file ext
             const assetFileName = `${costumeSource.baseLayerID}.${ext}`;
             costumePromises.push(deserializeCostume(costume, runtime, zip, assetFileName)
-                .then(asset => {
+                .then(() => loadCostume(costume.md5, costume, runtime, 2 /* optVersion */))
-                    costume.asset = asset;
-                    return loadCostume(costume.md5, costume, runtime, 2 /* optVersion */);
-                })
             );
         }
     }

src/serialization/sb3.js

@@ -847,10 +847,7 @@ const parseScratchObject = function (object, runtime, extensions, zip) {
         // any translation that needs to happen will happen in the process
         // of building up the costume object into an sb3 format
         return deserializeCostume(costume, runtime, zip)
-            .then(asset => {
+            .then(() => loadCostume(costumeMd5Ext, costume, runtime));
-                costume.asset = asset;
-                return loadCostume(costumeMd5Ext, costume, runtime);
-            });
         // Only attempt to load the costume after the deserialization
         // process has been completed
     });