Add loadAsDataUrl to ThumbnailLoader.

ui/file_manager/file_manager/foreground/js/thumbnail_loader_unittest.js

Index: ui/file_manager/file_manager/foreground/js/thumbnail_loader_unittest.js
diff --git a/ui/file_manager/file_manager/foreground/js/thumbnail_loader_unittest.js b/ui/file_manager/file_manager/foreground/js/thumbnail_loader_unittest.js
index b306b668b37432f12e317daa29818b1a41d13a85..e9f0d04cabc7243b8f4fa0ec6aa0478bf50161dd 100644
--- a/ui/file_manager/file_manager/foreground/js/thumbnail_loader_unittest.js
+++ b/ui/file_manager/file_manager/foreground/js/thumbnail_loader_unittest.js
@@ -6,6 +6,26 @@ function getLoadTarget(entry, metadata) {
   return new ThumbnailLoader(entry, null, metadata).getLoadTarget();
 }
 
+/**
+ * Generates a data url of a sample image for testing.
+ *
+ * @param {number} width Width.
+ * @param {number} height Height.
+ * @return {string} Data url of a sample image.
+ */
+function generateSampleImageDataUrl(width, height) {
+  var canvas = document.createElement('canvas');
+  canvas.width = width;
+  canvas.height = height;
+
+  var context = canvas.getContext('2d');
+  context.fillStyle = 'black';
+  context.fillRect(0, 0, width / 2, height / 2);
+  context.fillRect(width / 2, height / 2, width / 2, height / 2);
+
+  return canvas.toDataURL('image/png');
+}
+
 function testShouldUseMetadataThumbnail() {
   var mockFileSystem = new MockFileSystem('volumeId');
   var imageEntry = new MockEntry(mockFileSystem, '/test.jpg');
@@ -33,3 +53,108 @@ function testShouldUseMetadataThumbnail() {
       getLoadTarget(
           pdfEntry, {external: {thumbnailUrl: 'url', dirty: true}}));
 }
+
+function testLoadAsDataUrlFromImageClient(callback) {
+  ImageLoaderClient.getInstance = function() {
+    return {
+      load: function(url, callback, opt_option) {
+        callback({
+          status: 'success', data: 'imageDataUrl', width: 32, height: 32});
+      }
+    };
+  };
+
+  var fileSystem = new MockFileSystem('volume-id');
+  var entry = new MockEntry(fileSystem, '/Test1.jpg');
+  var thumbnailLoader = new ThumbnailLoader(entry);
+  reportPromise(thumbnailLoader.loadAsDataUrl().then(function(result) {
+    assertEquals('imageDataUrl', result.data);
+  }), callback);
+}
+
+function testLoadAsDataUrlFromExifThumbnail(callback) {
+  ImageLoaderClient.getInstance = function() {
+    return {
+      load: function(url, callback, opt_option) {
+        // Assert that data url is passed.
+        assertTrue(/^data:/i.test(url));
+        callback({status: 'success', data: url, width: 32, height: 32});
+      }
+    };
+  };
+
+  var metadata = {
+    thumbnail: {
+      url: generateSampleImageDataUrl(32, 32)
+    }
+  };
+
+  var fileSystem = new MockFileSystem('volume-id');
+  var entry = new MockEntry(fileSystem, '/Test1.jpg');
+  var thumbnailLoader = new ThumbnailLoader(entry, undefined, metadata);
+  reportPromise(thumbnailLoader.loadAsDataUrl().then(function(result) {
+    assertEquals(metadata.thumbnail.url, result.data);
+  }), callback);
+}
+
+function testLoadAsDataUrlFromExifThumbnailRotate(callback) {
+  ImageLoaderClient.getInstance = function() {
+    return {
+      load: function(url, callback, opt_option) {
+        // Assert that data url is passed.
+        assertTrue(/^data:/i.test(url));
+        callback({status: 'success', data: url, width: 64, height: 32});
+      }
+    };
+  };
+
+  var metadata = {
+    thumbnail: {
+      url: generateSampleImageDataUrl(64, 32),
+      transform: {
+        rotate90: 1,
+        scaleX: 1,
+        scaleY: -1,
+      }
+    }
+  };
+
+  var fileSystem = new MockFileSystem('volume-id');
+  var entry = new MockEntry(fileSystem, '/Test1.jpg');
+  var thumbnailLoader = new ThumbnailLoader(entry, undefined, metadata);
+  reportPromise(thumbnailLoader.loadAsDataUrl().then(function(result) {
+    assertEquals(32, result.width);
+    assertEquals(64, result.height);
+    // For test image, transformed image should become equal to the following
+    // generated sample image.
+    assertEquals(generateSampleImageDataUrl(32, 64), result.data);
+  }), callback);
+}
+
+function testLoadAsDataUrlFromExternal(callback) {
+  var externalThumbnailUrl = 'https://external-thumbnail-url/';
+  var externalThumbnailDataUrl = generateSampleImageDataUrl(32, 32);
+
+  ImageLoaderClient.getInstance = function() {
+    return {
+      load: function(url, callback, opt_option) {
+        assertEquals(externalThumbnailUrl, url);
+        callback({status: 'success', data: externalThumbnailDataUrl,
+          width: 32, height: 32});
+      }
+    };
+  };
+
+  var metadata = {
+    external: {
+      thumbnailUrl: externalThumbnailUrl
+    }
+  }
+
+  var fileSystem = new MockFileSystem('volume-id');
+  var entry = new MockEntry(fileSystem, '/Test1.jpg');
+  var thumbnailLoader = new ThumbnailLoader(entry, undefined, metadata);
+  reportPromise(thumbnailLoader.loadAsDataUrl().then(function(result) {
+    assertEquals(externalThumbnailDataUrl, result.data);
+  }), callback);
+}