[CCA] Convert type.js into ES6 module.

Add types in type.js into cca namespace and transform it into ES6 module.

Bug: 141518780
Test: Pass closure compiler check, tast run <DUT> 'camera.CCAUI*' and
validate all function of CCA on HALv1/v3 device works correctly.

Change-Id: I38d88a8900bb29de258591ba4eaa07ac49314eb5
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1975690Reviewed-by: Shik Chen <shik@chromium.org>
Commit-Queue: Kuo Jen Wei <inker@chromium.org>
Auto-Submit: Kuo Jen Wei <inker@chromium.org>
Cr-Commit-Position: refs/heads/master@{#727355}

chrome/browser/resources/chromeos/camera/.eslintrc.js

@@ -376,6 +376,7 @@ module.exports = {
     // BigInt64Array as a defined type.
     'BigInt64Array': 'readable',
     'chromeosCamera': 'readable',
+    'cca': 'readable', // TODO(inker): remove this after resolving b/141518780.
     'cros': 'readable',
     'webkitRequestFileSystem': 'readable',
   },

chrome/browser/resources/chromeos/camera/src/js/BUILD.gn

@@ -67,6 +67,9 @@ js_library("sound") {
 }
 
 js_library("type") {
+  deps = [
+    ":namespace",
+  ]
 }
 
 js_library("main") {

chrome/browser/resources/chromeos/camera/src/js/device/camera3_device_info.js

@@ -14,11 +14,6 @@ var cca = cca || {};
  */
 cca.device = cca.device || {};
 
-/**
- * import {Resolution} from '../type.js';
- */
-var Resolution = Resolution || {};
-
 /**
  * Video device information queried from HALv3 mojo private API.
  */
@@ -27,11 +22,12 @@ cca.device.Camera3DeviceInfo = class {
    * @public
    * @param {!MediaDeviceInfo} deviceInfo Information of the video device.
    * @param {!cros.mojom.CameraFacing} facing Camera facing of the video device.
-   * @param {!ResolutionList} photoResols Supported available photo resolutions
-   *     of the video device.
-   * @param {!Array<!VideoConfig>} videoResolFpses Supported available video
+   * @param {!cca.ResolutionList} photoResols Supported available photo
+   *     resolutions of the video device.
+   * @param {!Array<!cca.VideoConfig>} videoResolFpses Supported available video
    *     resolutions and maximal capture fps of the video device.
-   * @param {!FpsRangeList} fpsRanges Supported fps ranges of the video device.
+   * @param {!cca.FpsRangeList} fpsRanges Supported fps ranges of the video
+   *     device.
    */
   constructor(deviceInfo, facing, photoResols, videoResolFpses, fpsRanges) {
     /**
@@ -47,32 +43,32 @@ cca.device.Camera3DeviceInfo = class {
     this.facing = facing;
 
     /**
-     * @type {!ResolutionList}
+     * @type {!cca.ResolutionList}
      * @public
      */
     this.photoResols = photoResols;
 
     /**
-     * @type {!ResolutionList}
+     * @type {!cca.ResolutionList}
      * @public
      */
     this.videoResols = [];
 
     /**
-     * @type {!MaxFpsInfo}
+     * @type {!cca.MaxFpsInfo}
      * @public
      */
     this.videoMaxFps = {};
 
     /**
-     * @type {!FpsRangeList}
+     * @type {!cca.FpsRangeList}
      * @public
      */
     this.fpsRanges = fpsRanges;
 
     videoResolFpses.filter(({maxFps}) => maxFps >= 24)
         .forEach(({width, height, maxFps}) => {
-          const r = new Resolution(width, height);
+          const r = new cca.Resolution(width, height);
           this.videoResols.push(r);
           this.videoMaxFps[r] = maxFps;
         });

chrome/browser/resources/chromeos/camera/src/js/device/constraints_preferrer.js

@@ -14,11 +14,6 @@ var cca = cca || {};
  */
 cca.device = cca.device || {};
 
-/**
- * import {Mode, Resolution} from '../type.js';
- */
-var {Mode, Resolution} = {Mode, Resolution};
-
 /* eslint-disable no-unused-vars */
 
 /**
@@ -27,7 +22,7 @@ var {Mode, Resolution} = {Mode, Resolution};
  * Video/photo capture resolution and the constraints-candidates of its
  * corresponding preview stream.
  * @typedef {{
- *   resolution: !Resolution,
+ *   resolution: !cca.Resolution,
  *   previewCandidates: !Array<!MediaStreamConstraints>
  * }}
  */
@@ -56,7 +51,7 @@ cca.device.ConstraintsPreferrer = class {
     /**
      * Object saving resolution preference that each of its key as device id and
      * value to be preferred width, height of resolution of that video device.
-     * @type {!Object<string, !Resolution>}
+     * @type {!Object<string, !cca.Resolution>}
      * @protected
      */
     this.prefResolution_ = {};
@@ -71,7 +66,7 @@ cca.device.ConstraintsPreferrer = class {
     /**
      * Object of device id as its key and all of available capture resolutions
      * supported by that video device as its value.
-     * @type {!Object<string, !ResolutionList>}
+     * @type {!Object<string, !cca.ResolutionList>}
      * @protected
      */
     this.deviceResolutions_ = {};
@@ -79,7 +74,7 @@ cca.device.ConstraintsPreferrer = class {
     /**
      * Listener for changes of preferred resolution used on particular video
      * device.
-     * @type {!function(string, !Resolution)}
+     * @type {!function(string, !cca.Resolution)}
      * @private
      */
     this.preferredResolutionChangeListener_ = () => {};
@@ -96,7 +91,7 @@ cca.device.ConstraintsPreferrer = class {
     cca.proxy.browserProxy.localStorageGet({[key]: {}}, (values) => {
       this.prefResolution_ = {};
       for (const [deviceId, {width, height}] of Object.entries(values[key])) {
-        this.prefResolution_[deviceId] = new Resolution(width, height);
+        this.prefResolution_[deviceId] = new cca.Resolution(width, height);
       }
     });
   }
@@ -113,8 +108,8 @@ cca.device.ConstraintsPreferrer = class {
   /**
    * Gets user preferred capture resolution for a specific device.
    * @param {string} deviceId Device id of the device.
-   * @return {?Resolution} Returns preferred resolution or null if no preferred
-   *     resolution found in user preference.
+   * @return {?cca.Resolution} Returns preferred resolution or null if no
+   *     preferred resolution found in user preference.
    */
   getPrefResolution(deviceId) {
     return this.prefResolution_[deviceId] || null;
@@ -132,7 +127,7 @@ cca.device.ConstraintsPreferrer = class {
    * settings.
    * @param {string} deviceId Device id of video device to be updated.
    * @param {!MediaStream} stream Currently active preview stream.
-   * @param {!Resolution} resolution Resolution to be updated to.
+   * @param {!cca.Resolution} resolution Resolution to be updated to.
    * @abstract
    */
   updateValues(deviceId, stream, resolution) {}
@@ -144,8 +139,8 @@ cca.device.ConstraintsPreferrer = class {
    * order.
    * @abstract
    * @param {string} deviceId Device id of video device.
-   * @param {!ResolutionList} previewResolutions Available preview resolutions
-   *     for the video device.
+   * @param {!cca.ResolutionList} previewResolutions Available preview
+   *     resolutions for the video device.
    * @return {!Array<!CaptureCandidate>} Capture resolution and its preview
    *     constraints-candidates.
    */
@@ -155,14 +150,14 @@ cca.device.ConstraintsPreferrer = class {
    * Changes user preferred capture resolution.
    * @abstract
    * @param {string} deviceId Device id of the video device to be changed.
-   * @param {!Resolution} resolution Preferred capture resolution.
+   * @param {!cca.Resolution} resolution Preferred capture resolution.
    */
   changePreferredResolution(deviceId, resolution) {}
 
   /**
    * Sets listener for changes of preferred resolution used in taking photo on
    * particular video device.
-   * @param {!function(string, !Resolution)} listener
+   * @param {!function(string, !cca.Resolution)} listener
    */
   setPreferredResolutionChangeListener(listener) {
     this.preferredResolutionChangeListener_ = listener;
@@ -192,7 +187,7 @@ cca.device.VideoConstraintsPreferrer =
      * Object saving information of device supported constant fps. Each of its
      * key as device id and value as an object mapping from resolution to all
      * constant fps options supported by that resolution.
-     * @type {!Object<string, !Object<!Resolution, !Array<number>>>}
+     * @type {!Object<string, !Object<!cca.Resolution, !Array<number>>>}
      * @private
      */
     this.constFpsInfo_ = {};
@@ -201,7 +196,7 @@ cca.device.VideoConstraintsPreferrer =
      * Object saving fps preference that each of its key as device id and value
      * as an object mapping from resolution to preferred constant fps for that
      * resolution.
-     * @type {!Object<string, !Object<!Resolution, number>>}
+     * @type {!Object<string, !Object<!cca.Resolution, number>>}
      * @private
      */
     this.prefFpses_ = {};
@@ -216,10 +211,10 @@ cca.device.VideoConstraintsPreferrer =
 
     /**
      * Currently in used recording resolution.
-     * @type {!Resolution}
+     * @type {!cca.Resolution}
      * @protected
      */
-    this.resolution_ = new Resolution(0, -1);
+    this.resolution_ = new cca.Resolution(0, -1);
     this.restoreResolutionPreference_('deviceVideoResolution');
     this.restoreFpsPreference_();
 
@@ -267,7 +262,7 @@ cca.device.VideoConstraintsPreferrer =
   changePreferredResolution(deviceId, resolution) {
     this.prefResolution_[deviceId] = resolution;
     this.saveResolutionPreference_('deviceVideoResolution');
-    if (cca.state.get(Mode.VIDEO) && deviceId === this.deviceId_) {
+    if (cca.state.get(cca.Mode.VIDEO) && deviceId === this.deviceId_) {
       this.doReconfigureStream_();
     } else {
       this.preferredResolutionChangeListener_(deviceId, resolution);
@@ -278,7 +273,7 @@ cca.device.VideoConstraintsPreferrer =
    * Sets the preferred fps used in video recording for particular video device
    * with particular resolution.
    * @param {string} deviceId Device id of video device to be set with.
-   * @param {!Resolution} resolution Resolution to be set with.
+   * @param {!cca.Resolution} resolution Resolution to be set with.
    * @param {number} prefFps Preferred fps to be set with.
    * @private
    */
@@ -306,24 +301,25 @@ cca.device.VideoConstraintsPreferrer =
       /**
        * @param {number} width
        * @param {number} height
-       * @return {!Resolution|undefined}
+       * @return {!cca.Resolution|undefined}
        */
       const findResol = (width, height) =>
           videoResols.find((r) => r.width === width && r.height === height);
-      /** @type {!Resolution} */
+      /** @type {!cca.Resolution} */
       let prefR = this.getPrefResolution(deviceId) || findResol(1920, 1080) ||
-          findResol(1280, 720) || new Resolution(0, -1);
+          findResol(1280, 720) || new cca.Resolution(0, -1);
       if (findResol(prefR.width, prefR.height) === undefined) {
         prefR = videoResols.reduce(
             (maxR, R) => (maxR.area < R.area ? R : maxR),
-            new Resolution(0, -1));
+            new cca.Resolution(0, -1));
       }
       this.prefResolution_[deviceId] = prefR;
 
       const /** !Array<number> */ constFpses =
           fpsRanges.filter(({minFps, maxFps}) => minFps === maxFps)
               .map(({minFps}) => minFps);
-      const /** !Object<(!Resolution|string), !Array<number>> */ fpsInfo = {};
+      /** @type {!Object<(!cca.Resolution|string), !Array<number>>} */
+      const fpsInfo = {};
       for (const [resolution, maxFps] of Object.entries(videoMaxFps)) {
         fpsInfo[/** @type {string} */ (resolution)] =
             constFpses.filter((fps) => fps <= maxFps);
@@ -358,11 +354,11 @@ cca.device.VideoConstraintsPreferrer =
     // Due to the limitation of MediaStream API, preview stream is used directly
     // to do video recording.
 
-    /** @type {!Resolution} */
-    const prefR = this.getPrefResolution(deviceId) || new Resolution(0, -1);
+    /** @type {!cca.Resolution} */
+    const prefR = this.getPrefResolution(deviceId) || new cca.Resolution(0, -1);
     /**
-     * @param {!Resolution} r1
-     * @param {!Resolution} r2
+     * @param {!cca.Resolution} r1
+     * @param {!cca.Resolution} r2
      * @return {number}
      */
     const sortPrefResol = (r1, r2) => {
@@ -394,8 +390,8 @@ cca.device.VideoConstraintsPreferrer =
      * Maps specified video resolution to object of resolution and all supported
      * constant fps under that resolution or null fps for not support constant
      * fps. The resolution-fpses are sorted by user preference of constant fps.
-     * @param {!Resolution} r
-     * @return {!Array<!{r: !Resolution, fps: number}>}
+     * @param {!cca.Resolution} r
+     * @return {!Array<!{r: !cca.Resolution, fps: number}>}
      */
     const getFpses = (r) => {
       let /** !Array<?number> */ constFpses = [null];
@@ -415,7 +411,7 @@ cca.device.VideoConstraintsPreferrer =
     };
 
     /**
-     * @param {!Resolution} r
+     * @param {!cca.Resolution} r
      * @param {!number} fps
      * @return {!MediaStreamConstraints}
      */
@@ -461,7 +457,7 @@ cca.device.PhotoConstraintsPreferrer =
   changePreferredResolution(deviceId, resolution) {
     this.prefResolution_[deviceId] = resolution;
     this.saveResolutionPreference_('devicePhotoResolution');
-    if (!cca.state.get(Mode.VIDEO) && deviceId === this.deviceId_) {
+    if (!cca.state.get(cca.Mode.VIDEO) && deviceId === this.deviceId_) {
       this.doReconfigureStream_();
     } else {
       this.preferredResolutionChangeListener_(deviceId, resolution);
@@ -476,12 +472,12 @@ cca.device.PhotoConstraintsPreferrer =
 
     devices.forEach(({deviceId, photoResols}) => {
       this.deviceResolutions_[deviceId] = photoResols;
-      /** @type {!Resolution} */
-      let prefR = this.getPrefResolution(deviceId) || new Resolution(0, -1);
+      /** @type {!cca.Resolution} */
+      let prefR = this.getPrefResolution(deviceId) || new cca.Resolution(0, -1);
       if (!photoResols.some((r) => r.equals(prefR))) {
         prefR = photoResols.reduce(
             (maxR, R) => (maxR.area < R.area ? R : maxR),
-            new Resolution(0, -1));
+            new cca.Resolution(0, -1));
       }
       this.prefResolution_[deviceId] = prefR;
     });
@@ -501,22 +497,23 @@ cca.device.PhotoConstraintsPreferrer =
   /**
    * Finds and pairs photo resolutions and preview resolutions with the same
    * aspect ratio.
-   * @param {!ResolutionList} captureResolutions Available photo capturing
+   * @param {!cca.ResolutionList} captureResolutions Available photo capturing
+   *     resolutions.
+   * @param {!cca.ResolutionList} previewResolutions Available preview
    *     resolutions.
-   * @param {!ResolutionList} previewResolutions Available preview resolutions.
-   * @return {!Array<!{capture: !ResolutionList, preview: !ResolutionList}>}
-   *     Each item of returned array is a object of capture and preview
-   *     resolutions of same aspect ratio.
+   * @return {!Array<!{capture: !cca.ResolutionList, preview:
+   *     !cca.ResolutionList}>} Each item of returned array is a object of
+   *     capture and preview resolutions of same aspect ratio.
    * @private
    */
   pairCapturePreviewResolutions_(captureResolutions, previewResolutions) {
-    /** @type {!Object<string, !ResolutionList>} */
+    /** @type {!Object<string, !cca.ResolutionList>} */
     const previewRatios = previewResolutions.reduce((rs, r) => {
       rs[r.aspectRatio] = rs[r.aspectRatio] || [];
       rs[r.aspectRatio].push(r);
       return rs;
     }, {});
-    /** @type {!Object<string, !ResolutionList>} */
+    /** @type {!Object<string, !cca.ResolutionList>} */
     const captureRatios = captureResolutions.reduce((rs, r) => {
       if (r.aspectRatio in previewRatios) {
         rs[r.aspectRatio] = rs[r.aspectRatio] || [];
@@ -527,7 +524,7 @@ cca.device.PhotoConstraintsPreferrer =
     return Object.entries(captureRatios)
         .map(([
                /** string */ aspectRatio,
-               /** !Resolution */ capture,
+               /** !cca.Resolution */ capture,
              ]) => ({capture, preview: previewRatios[aspectRatio]}));
   }
 
@@ -535,11 +532,11 @@ cca.device.PhotoConstraintsPreferrer =
    * @override
    */
   getSortedCandidates(deviceId, previewResolutions) {
-    /** @type {!ResolutionList} */
+    /** @type {!cca.ResolutionList} */
     const photoResolutions = this.deviceResolutions_[deviceId];
 
-    /** @type {!Resolution} */
-    const prefR = this.getPrefResolution(deviceId) || new Resolution(0, -1);
+    /** @type {!cca.Resolution} */
+    const prefR = this.getPrefResolution(deviceId) || new cca.Resolution(0, -1);
 
     /**
      * @param {!CaptureCandidate} candidate
@@ -561,19 +558,20 @@ cca.device.PhotoConstraintsPreferrer =
     };
 
     /**
-     * @param {!{capture: !ResolutionList, preview: !ResolutionList}} capture
+     * @param {!{capture: !cca.ResolutionList, preview: !cca.ResolutionList}}
+     *     capture
      * @return {!CaptureCandidate}
      */
     const toCaptureCandidate = ({capture: captureRs, preview: previewRs}) => {
-      let /** !Resolution */ captureR = prefR;
+      let /** !cca.Resolution */ captureR = prefR;
       if (!captureRs.some((r) => r.equals(prefR))) {
         captureR = captureRs.reduce(
             (captureR, r) => (r.width > captureR.width ? r : captureR));
       }
 
       /**
-       * @param {!ResolutionList} rs
-       * @return {!ResolutionList}
+       * @param {!cca.ResolutionList} rs
+       * @return {!cca.ResolutionList}
        */
       const sortPreview = (rs) => {
         if (rs.length === 0) {

chrome/browser/resources/chromeos/camera/src/js/device/device_info_updater.js

@@ -231,8 +231,8 @@ cca.device.DeviceInfoUpdater = class {
   /**
    * Gets supported photo and video resolutions for specified video device.
    * @param {string} deviceId Device id of the video device.
-   * @return {!Promise<!{photo: !ResolutionList, video: !ResolutionList}>}
-   *     Supported photo and video resolutions.
+   * @return {!Promise<!{photo: !cca.ResolutionList, video:
+   *     !cca.ResolutionList}>} Supported photo and video resolutions.
    * @throws {Error} May fail on HALv1 device without capability of querying
    *     supported resolutions.
    */

chrome/browser/resources/chromeos/camera/src/js/intent.js

@@ -19,11 +19,6 @@ cca.intent = cca.intent || {};
  */
 var assertNotReached = assertNotReached || {};
 
-/**
- * import {Mode} from './type.js';
- */
-var Mode = Mode || {};
-
 /**
  * Thrown when fails to parse intent url.
  */
@@ -50,7 +45,7 @@ cca.intent.Intent = class {
   /**
    * @param {!URL} url
    * @param {number} intentId
-   * @param {Mode} mode
+   * @param {cca.Mode} mode
    * @param {boolean} shouldHandleResult
    * @param {boolean} shouldDownScale
    * @param {boolean} isSecure
@@ -70,7 +65,7 @@ cca.intent.Intent = class {
 
     /**
      * Capture mode of intent.
-     * @const {Mode}
+     * @const {cca.Mode}
      */
     this.mode = mode;
 
@@ -180,10 +175,10 @@ cca.intent.Intent = class {
     const intentId = parseInt(param, 10);
 
     param = params.get('mode');
-    if (param === null || !Object.values(Mode).includes(param)) {
+    if (param === null || !Object.values(cca.Mode).includes(param)) {
       throw new cca.intent.ParseError(url);
     }
-    const mode = /** @type {Mode} */ (param);
+    const mode = /** @type {cca.Mode} */ (param);
 
     return new cca.intent.Intent(
         url, intentId, mode, getBool('shouldHandleResult'),

chrome/browser/resources/chromeos/camera/src/js/main.js

@@ -14,11 +14,6 @@ var cca = cca || {};
  */
 var {assert, assertInstanceof} = {assert, assertInstanceof};
 
-/**
- * import {Mode} from './type.js';
- */
-var Mode = Mode || {};
-
 /**
  * Creates the Camera App main object.
  * @implements {cca.bg.ForegroundOps}
@@ -75,7 +70,8 @@ cca.App = class {
       } else {
         return new cca.views.Camera(
             this.galleryButton_, this.infoUpdater_, this.photoPreferrer_,
-            this.videoPreferrer_, intent !== null ? intent.mode : Mode.PHOTO);
+            this.videoPreferrer_,
+            intent !== null ? intent.mode : cca.Mode.PHOTO);
       }
     })();
 

chrome/browser/resources/chromeos/camera/src/js/metrics.js

@@ -14,11 +14,6 @@ var cca = cca || {};
  */
 cca.metrics = cca.metrics || {};
 
-/**
- * import {Mode} from './type.js';
- */
-var Mode = Mode || {};
-
 /**
  * Event builder for basic metrics.
  * @type {?analytics.EventBuilder}
@@ -110,7 +105,7 @@ cca.metrics.IntentResultType = {
  * Returns event builder for the metrics type: capture.
  * @param {?string} facingMode Camera facing-mode of the capture.
  * @param {number} length Length of 1 minute buckets for captured video.
- * @param {!Resolution} resolution Capture resolution.
+ * @param {!cca.Resolution} resolution Capture resolution.
  * @param {!cca.metrics.IntentResultType} intentResult
  * @return {!analytics.EventBuilder}
  * @private
@@ -129,17 +124,17 @@ cca.metrics.captureType_ = function(
   };
 
   return cca.metrics.base_.category('capture')
-      .action(condState(Object.values(Mode)))
+      .action(condState(Object.values(cca.Mode)))
       .label(facingMode || '(not set)')
       .dimen(3, condState(['sound']))
       .dimen(4, condState(['mirror']))
       .dimen(5, condState(['_3x3', '_4x4', 'golden'], 'grid'))
       .dimen(6, condState(['_3sec', '_10sec'], 'timer'))
-      .dimen(7, condState(['mic'], Mode.VIDEO, true))
+      .dimen(7, condState(['mic'], cca.Mode.VIDEO, true))
       .dimen(8, condState(['max-wnd']))
       .dimen(9, condState(['tall']))
       .dimen(10, resolution.toString())
-      .dimen(11, condState(['_30fps', '_60fps'], Mode.VIDEO, true))
+      .dimen(11, condState(['_30fps', '_60fps'], cca.Mode.VIDEO, true))
       .dimen(12, intentResult)
       .value(length || 0);
 };

chrome/browser/resources/chromeos/camera/src/js/mojo/chrome_helper.js

@@ -137,9 +137,5 @@ export class ChromeHelper {
   }
 }
 
-/* eslint-disable no-undef */
-
 /** @const */
 cca.mojo.ChromeHelper = ChromeHelper;
-
-/* eslint-enable no-undef */

chrome/browser/resources/chromeos/camera/src/js/mojo/device_operator.js

@@ -2,14 +2,9 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-/* eslint-disable no-undef */
-
-/**
- * import {Resolution} from '../type.js';
- */
-const CCAResolution = Resolution;
-
-/* eslint-enable no-undef */
+import {Resolution,
+        ResolutionList,  // eslint-disable-line no-unused-vars
+} from '../type.js';
 
 /**
  * Parse the entry data according to its type.
@@ -156,7 +151,7 @@ export class DeviceOperator {
       const [format, width, height, type] =
           streamConfigs.slice(i, i + numElementPerEntry);
       if (format === formatBlob && type === typeOutputStream) {
-        supportedResolutions.push(new CCAResolution(width, height));
+        supportedResolutions.push(new Resolution(width, height));
       }
     }
     return supportedResolutions;
@@ -166,7 +161,7 @@ export class DeviceOperator {
    * Gets supported video configurations for specific camera.
    * @param {string} deviceId The renderer-facing device id of the target camera
    *     which could be retrieved from MediaDeviceInfo.deviceId.
-   * @return {!Promise<!Array<VideoConfig>>} Promise of supported video
+   * @return {!Promise<!Array<cca.VideoConfig>>} Promise of supported video
    *     configurations.
    * @throws {Error} Thrown when fail to parse the metadata or the device
    *     operation is not supported.
@@ -222,7 +217,7 @@ export class DeviceOperator {
    * Gets supported fps ranges for specific camera.
    * @param {string} deviceId The renderer-facing device id of the target camera
    *     which could be retrieved from MediaDeviceInfo.deviceId.
-   * @return {!Promise<!FpsRangeList>} Promise of supported fps ranges.
+   * @return {!Promise<!cca.FpsRangeList>} Promise of supported fps ranges.
    *     Each range is represented as [min, max].
    * @throws {Error} Thrown when fail to parse the metadata or the device
    *     operation is not supported.
@@ -244,7 +239,7 @@ export class DeviceOperator {
       throw new Error('Unexpected length of available fps range configs');
     }
 
-    const /** !FpsRangeList */ supportedFpsRanges = [];
+    const /** !cca.FpsRangeList */ supportedFpsRanges = [];
     for (let i = 0; i < availableFpsRanges.length; i += numElementPerEntry) {
       const [minFps, maxFps] =
           availableFpsRanges.slice(i, i + numElementPerEntry);
@@ -468,11 +463,7 @@ export class DeviceOperator {
   }
 }
 
-/* eslint-disable no-undef */
-
 /** @const */
 cca.mojo.DeviceOperator = DeviceOperator;
 /** @const */
 cca.mojo.parseMetadataData = parseMetadataData;
-
-/* eslint-enable no-undef */

chrome/browser/resources/chromeos/camera/src/js/perf.js

@@ -102,8 +102,8 @@ cca.perf.PerfLogger = class {
   /**
    * Stops the measurement for given event and returns the measurement result.
    * @param {cca.perf.PerfEvent} event Target event.
-   * @param {PerfInformation=} perfInfo Optional information of this event for
-   *     performance measurement.
+   * @param {cca.PerfInformation=} perfInfo Optional information of this event
+   *     for performance measurement.
    */
   stop(event, perfInfo = {}) {
     if (!this.startTimeMap_.has(event)) {
@@ -133,8 +133,8 @@ cca.perf.PerfLogger = class {
 
   /**
    * Stops the measurement of launch-related events.
-   * @param {PerfInformation=} perfInfo Optional information of this event for
-   *     performance measurement.
+   * @param {cca.PerfInformation=} perfInfo Optional information of this event
+   *     for performance measurement.
    */
   stopLaunch(perfInfo) {
     const launchEvents = [

chrome/browser/resources/chromeos/camera/src/js/state.js

@@ -17,7 +17,7 @@ cca.state = cca.state || {};
 /* eslint-disable no-unused-vars */
 
 /**
- * @typedef {function(boolean, PerfInformation=)}
+ * @typedef {function(boolean, cca.PerfInformation=)}
  */
 var StateObserver;
 
@@ -73,7 +73,7 @@ cca.state.get = function(state) {
  * performance measurement.
  * @param {string} state State to be set.
  * @param {boolean} val True to set the state on, false otherwise.
- * @param {PerfInformation=} perfInfo Optional information of this state for
+ * @param {cca.PerfInformation=} perfInfo Optional information of this state for
  *     performance measurement.
  */
 cca.state.set = function(state, val, perfInfo = {}) {

chrome/browser/resources/chromeos/camera/src/js/type.js

@@ -2,14 +2,10 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-'use strict';
-
-/* eslint-disable no-unused-vars */
-
 /**
  * Photo or video resolution.
  */
-var Resolution = class {
+export class Resolution {
   /**
    * @param {number} width
    * @param {number} height
@@ -78,26 +74,32 @@ var Resolution = class {
   toString() {
     return `${this.width}x${this.height}`;
   }
-};
+}
 
 /**
  * Capture modes.
  * @enum {string}
  */
-var Mode = {
+export const Mode = {
   PHOTO: 'photo',
   VIDEO: 'video',
   SQUARE: 'square',
   PORTRAIT: 'portrait',
 };
 
+// The types here are used only in jsdoc and are required to be explicitly
+// exported in order to be referenced by closure compiler.
+// TODO(inker): Exports/Imports these jsdoc only types by closure compiler
+// comment syntax. The implementation of syntax is tracked here:
+// https://github.com/google/closure-compiler/issues/3041
+
 /**
  * @typedef {{
  *   hasError: (boolean|undefined),
  *   resolution: (Resolution|undefined),
  * }}
  */
-var PerfInformation;
+export let PerfInformation;
 
 /**
  * @typedef {{
@@ -106,7 +108,7 @@ var PerfInformation;
  *   maxFps: number,
  * }}
  */
-var VideoConfig;
+export let VideoConfig;
 
 /**
  * @typedef {{
@@ -114,13 +116,13 @@ var VideoConfig;
  *   maxFps: number,
  * }}
  */
-var FpsRange;
+export let FpsRange;
 
 /**
  * A list of resolutions.
  * @typedef {Array<!Resolution>}
  */
-var ResolutionList;
+export let ResolutionList;
 
 /**
  * Map of all available resolution to its maximal supported capture fps. The key
@@ -128,12 +130,27 @@ var ResolutionList;
  * capture fps under that resolution.
  * @typedef {Object<(!Resolution|string), number>}
  */
-var MaxFpsInfo;
+export let MaxFpsInfo;
 
 /**
  * List of supported capture fps ranges.
  * @typedef {Array<!FpsRange>}
  */
-var FpsRangeList;
-
-/* eslint-enable no-unused-vars */
+export let FpsRangeList;
+
+/** @const */
+cca.Resolution = Resolution;
+/** @const */
+cca.Mode = Mode;
+/** @const */
+cca.PerfInformation = PerfInformation;
+/** @const */
+cca.VideoConfig = VideoConfig;
+/** @const */
+cca.FpsRange = FpsRange;
+/** @const */
+cca.ResolutionList = ResolutionList;
+/** @const */
+cca.MaxFpsInfo = MaxFpsInfo;
+/** @const */
+cca.FpsRangeList = FpsRangeList;

chrome/browser/resources/chromeos/camera/src/js/util.js

@@ -14,11 +14,6 @@ var cca = cca || {};
  */
 cca.util = cca.util || {};
 
-/**
- * import {Resolution} from '../type.js';
- */
-var Resolution = Resolution || {};
-
 /**
  * Gets the clockwise rotation and flip that can orient a photo to its upright
  * position.
@@ -411,7 +406,7 @@ cca.util.fitWindow = function() {
 
   /**
    * Get a preferred window size which can fit in current screen.
-   * @return {Resolution} Preferred window size.
+   * @return {cca.Resolution} Preferred window size.
    */
   const getPreferredWindowSize = () => {
     const inner = appWindow.innerBounds;
@@ -429,7 +424,7 @@ cca.util.fitWindow = function() {
     preferredWidth -= preferredWidth % 16;
     const preferredHeight = preferredWidth * 9 / 16;
 
-    return new Resolution(preferredWidth, preferredHeight);
+    return new cca.Resolution(preferredWidth, preferredHeight);
   };
 
   const {width, height} = getPreferredWindowSize();

chrome/browser/resources/chromeos/camera/src/js/views/camera.js

@@ -14,11 +14,6 @@ var cca = cca || {};
  */
 cca.views = cca.views || {};
 
-/**
- * import {Mode} from '../type.js';
- */
-var Mode = Mode || {};
-
 /**
  * import {assert} from '../chrome_util.js';
  */
@@ -47,7 +42,7 @@ cca.views.Camera = class extends cca.views.View {
    * @param {!cca.device.DeviceInfoUpdater} infoUpdater
    * @param {!cca.device.PhotoConstraintsPreferrer} photoPreferrer
    * @param {!cca.device.VideoConstraintsPreferrer} videoPreferrer
-   * @param {Mode} defaultMode
+   * @param {cca.Mode} defaultMode
    */
   constructor(
       resultSaver, infoUpdater, photoPreferrer, videoPreferrer, defaultMode) {
@@ -60,7 +55,7 @@ cca.views.Camera = class extends cca.views.View {
     this.infoUpdater_ = infoUpdater;
 
     /**
-     * @type {!Mode}
+     * @type {!cca.Mode}
      * @protected
      */
     this.defaultMode_ = defaultMode;
@@ -320,7 +315,7 @@ cca.views.Camera = class extends cca.views.View {
   /**
    * Try start stream reconfiguration with specified mode and device id.
    * @param {?string} deviceId
-   * @param {!Mode} mode
+   * @param {!cca.Mode} mode
    * @return {!Promise<boolean>} If found suitable stream and reconfigure
    *     successfully.
    */

chrome/browser/resources/chromeos/camera/src/js/views/camera/layout.js

@@ -19,11 +19,6 @@ cca.views = cca.views || {};
  */
 cca.views.camera = cca.views.camera || {};
 
-/**
- * import {Mode, Resolution} from '../../type.js';
- */
-var {Mode, Resolution} = {Mode, Resolution};
-
 /**
  * import {assert} from '../chrome_util.js';
  */
@@ -77,7 +72,7 @@ cca.views.camera.Layout = class {
 
   /**
    * Updates the video element size for previewing in the window.
-   * @return {!Resolution} Letterbox size.
+   * @return {!cca.Resolution} Letterbox size.
    * @private
    */
   updatePreviewSize_() {
@@ -89,7 +84,7 @@ cca.views.camera.Layout = class {
     let contentWidth = 0;
     let contentHeight = 0;
     if (video.videoHeight) {
-      const scale = cca.state.get(Mode.SQUARE) ?
+      const scale = cca.state.get(cca.Mode.SQUARE) ?
           Math.min(window.innerHeight, window.innerWidth) /
               Math.min(video.videoHeight, video.videoWidth) :
           Math.min(
@@ -102,8 +97,8 @@ cca.views.camera.Layout = class {
     }
     let viewportW = contentWidth;
     let viewportH = contentHeight;
-    cca.state.set('square-preview', cca.state.get(Mode.SQUARE));
-    if (cca.state.get(Mode.SQUARE)) {
+    cca.state.set('square-preview', cca.state.get(cca.Mode.SQUARE));
+    if (cca.state.get(cca.Mode.SQUARE)) {
       viewportW = viewportH = Math.min(contentWidth, contentHeight);
       this.squareVideo_.setProperty(
           'left', `${(viewportW - contentWidth) / 2}px`);
@@ -112,7 +107,7 @@ cca.views.camera.Layout = class {
       this.squareViewport_.setProperty('width', `${viewportW}px`);
       this.squareViewport_.setProperty('height', `${viewportH}px`);
     }
-    return new Resolution(
+    return new cca.Resolution(
         window.innerWidth - viewportW, window.innerHeight - viewportH);
   }
 

chrome/browser/resources/chromeos/camera/src/js/views/camera/modes.js

@@ -19,16 +19,6 @@ cca.views = cca.views || {};
  */
 cca.views.camera = cca.views.camera || {};
 
-/**
- * import {Resolution} from '../type.js';
- */
-var Resolution = Resolution || {};
-
-/**
- * import {Mode} from '../../type.js';
- */
-var Mode = Mode || {};
-
 /* eslint-disable no-unused-vars */
 
 /**
@@ -128,7 +118,7 @@ cca.views.camera.ModeConfig = class {
 
   /**
    * Mode to be fallbacked to when fail to configure this mode.
-   * @return {!Mode}
+   * @return {!cca.Mode}
    * @abstract
    */
   get nextMode() {}
@@ -148,7 +138,7 @@ cca.views.camera.ModeConfig = class {
  */
 cca.views.camera.Modes = class {
   /**
-   * @param {!Mode} defaultMode Default mode to be switched to.
+   * @param {!cca.Mode} defaultMode Default mode to be switched to.
    * @param {!cca.device.PhotoConstraintsPreferrer} photoPreferrer
    * @param {!cca.device.VideoConstraintsPreferrer} videoPreferrer
    * @param {!cca.views.camera.DoSwitchMode} doSwitchMode
@@ -187,7 +177,7 @@ cca.views.camera.Modes = class {
         /** @type {!HTMLElement} */ (document.querySelector('#modes-group'));
 
     /**
-     * @type {?Resolution}
+     * @type {?cca.Resolution}
      * @private
      */
     this.captureResolution_ = null;
@@ -229,41 +219,41 @@ cca.views.camera.Modes = class {
 
     /**
      * Mode classname and related functions and attributes.
-     * @type {!Object<!Mode, !cca.views.camera.ModeConfig>}
+     * @type {!Object<!cca.Mode, !cca.views.camera.ModeConfig>}
      * @private
      */
     this.allModes_ = {
-      [Mode.VIDEO]: {
+      [cca.Mode.VIDEO]: {
         captureFactory: () => new cca.views.camera.Video(
             /** @type {!MediaStream} */ (this.stream_), createVideoSaver,
             doSaveVideo),
         isSupported: async () => true,
         constraintsPreferrer: videoPreferrer,
         getV1Constraints: getV1Constraints.bind(this, true),
-        nextMode: Mode.PHOTO,
+        nextMode: cca.Mode.PHOTO,
         captureIntent: cros.mojom.CaptureIntent.VIDEO_RECORD,
       },
-      [Mode.PHOTO]: {
+      [cca.Mode.PHOTO]: {
         captureFactory: () => new cca.views.camera.Photo(
             /** @type {!MediaStream} */ (this.stream_), doSavePhoto,
             this.captureResolution_, playShutterEffect),
         isSupported: async () => true,
         constraintsPreferrer: photoPreferrer,
         getV1Constraints: getV1Constraints.bind(this, false),
-        nextMode: Mode.SQUARE,
+        nextMode: cca.Mode.SQUARE,
         captureIntent: cros.mojom.CaptureIntent.STILL_CAPTURE,
       },
-      [Mode.SQUARE]: {
+      [cca.Mode.SQUARE]: {
         captureFactory: () => new cca.views.camera.Square(
             /** @type {!MediaStream} */ (this.stream_), doSavePhoto,
             this.captureResolution_, playShutterEffect),
         isSupported: async () => true,
         constraintsPreferrer: photoPreferrer,
         getV1Constraints: getV1Constraints.bind(this, false),
-        nextMode: Mode.PHOTO,
+        nextMode: cca.Mode.PHOTO,
         captureIntent: cros.mojom.CaptureIntent.STILL_CAPTURE,
       },
-      [Mode.PORTRAIT]: {
+      [cca.Mode.PORTRAIT]: {
         captureFactory: () => new cca.views.camera.Portrait(
             /** @type {!MediaStream} */ (this.stream_), doSavePhoto,
             this.captureResolution_, playShutterEffect),
@@ -279,7 +269,7 @@ cca.views.camera.Modes = class {
         },
         constraintsPreferrer: photoPreferrer,
         getV1Constraints: getV1Constraints.bind(this, false),
-        nextMode: Mode.PHOTO,
+        nextMode: cca.Mode.PHOTO,
         captureIntent: cros.mojom.CaptureIntent.STILL_CAPTURE,
       },
     };
@@ -311,7 +301,7 @@ cca.views.camera.Modes = class {
 
   /**
    * Updates state of mode related UI to the target mode.
-   * @param {!Mode} mode Mode to be toggled.
+   * @param {!cca.Mode} mode Mode to be toggled.
    * @private
    */
   updateModeUI_(mode) {
@@ -324,7 +314,7 @@ cca.views.camera.Modes = class {
         wrapper.offsetHeight / 2;
     // Make photo mode scroll slightly upper so that the third mode item falls
     // in blur area: crbug.com/988869
-    if (mode === Mode.PHOTO) {
+    if (mode === cca.Mode.PHOTO) {
       scrollTop -= 16;
     }
     this.modesGroup_.scrollTo({
@@ -337,13 +327,14 @@ cca.views.camera.Modes = class {
   /**
    * Gets all mode candidates. Desired trying sequence of candidate modes is
    * reflected in the order of the returned array.
-   * @return {!Array<!Mode>} Mode candidates to be tried out.
+   * @return {!Array<!cca.Mode>} Mode candidates to be tried out.
    */
   getModeCandidates() {
     const tried = {};
     const results = [];
     let mode =
-        /** @type {!Mode} */ (Object.keys(this.allModes_).find(cca.state.get));
+        /** @type {!cca.Mode} */ (
+            Object.keys(this.allModes_).find(cca.state.get));
     while (!tried[mode]) {
       tried[mode] = true;
       results.push(mode);
@@ -355,9 +346,9 @@ cca.views.camera.Modes = class {
   /**
    * Gets all available capture resolution and its corresponding preview
    * constraints for the given mode.
-   * @param {!Mode} mode
+   * @param {!cca.Mode} mode
    * @param {string} deviceId
-   * @param {!ResolutionList} previewResolutions
+   * @param {!cca.ResolutionList} previewResolutions
    * @return {!Array<!CaptureCandidate>}
    */
   getResolutionCandidates(mode, deviceId, previewResolutions) {
@@ -368,7 +359,7 @@ cca.views.camera.Modes = class {
   /**
    * Gets capture resolution and its corresponding preview constraints for the
    * given mode on camera HALv1 device.
-   * @param {!Mode} mode
+   * @param {!cca.Mode} mode
    * @param {?string} deviceId
    * @return {!Promise<!Array<!CaptureCandidate>>}
    */
@@ -380,7 +371,7 @@ cca.views.camera.Modes = class {
 
   /**
    * Gets capture intent for the given mode.
-   * @param {!Mode} mode
+   * @param {!cca.Mode} mode
    * @return {cros.mojom.CaptureIntent} Capture intent for the given mode.
    */
   getCaptureIntent(mode) {
@@ -390,7 +381,7 @@ cca.views.camera.Modes = class {
   /**
    * Gets supported modes for video device of given device id.
    * @param {?string} deviceId Device id of the video device.
-   * @return {!Promise<!Array<!Mode>>} All supported mode for
+   * @return {!Promise<!Array<!cca.Mode>>} All supported mode for
    *     the video device.
    */
   async getSupportedModes(deviceId) {
@@ -421,10 +412,10 @@ cca.views.camera.Modes = class {
 
   /**
    * Creates and updates new current mode object.
-   * @param {!Mode} mode Classname of mode to be updated.
+   * @param {!cca.Mode} mode Classname of mode to be updated.
    * @param {!MediaStream} stream Stream of the new switching mode.
    * @param {?string} deviceId Device id of currently working video device.
-   * @param {?Resolution} captureResolution Capturing resolution width and
+   * @param {?cca.Resolution} captureResolution Capturing resolution width and
    *     height.
    * @return {!Promise}
    */
@@ -486,7 +477,7 @@ cca.views.camera.Modes = class {
 cca.views.camera.ModeBase = class {
   /**
    * @param {!MediaStream} stream
-   * @param {?Resolution} captureResolution Capturing resolution width and
+   * @param {?cca.Resolution} captureResolution Capturing resolution width and
    *     height.
    */
   constructor(stream, captureResolution) {
@@ -500,7 +491,7 @@ cca.views.camera.ModeBase = class {
     /**
      * Capture resolution. May be null on device not support of setting
      * resolution.
-     * @type {?Resolution}
+     * @type {?cca.Resolution}
      * @private
      */
     this.captureResolution_ = captureResolution;
@@ -645,7 +636,7 @@ cca.views.camera.Video = class extends cca.views.camera.ModeBase {
     cca.sound.play('#sound-rec-end');
 
     const settings = this.stream_.getVideoTracks()[0].getSettings();
-    const resolution = new Resolution(settings.width, settings.height);
+    const resolution = new cca.Resolution(settings.width, settings.height);
     cca.state.set('video-capture-post-processing', true);
     try {
       await this.doSaveVideo_(
@@ -722,7 +713,7 @@ cca.views.camera.Photo = class extends cca.views.camera.ModeBase {
   /**
    * @param {!MediaStream} stream
    * @param {!cca.views.camera.DoSavePhoto} doSavePhoto
-   * @param {?Resolution} captureResolution
+   * @param {?cca.Resolution} captureResolution
    * @param {!cca.views.camera.PlayShutterEffect} playShutterEffect
    */
   constructor(stream, doSavePhoto, captureResolution, playShutterEffect) {
@@ -808,7 +799,7 @@ cca.views.camera.Photo = class extends cca.views.camera.ModeBase {
       cca.state.set('photo-capture-post-processing', true);
       const blob = await results[0];
       const image = await cca.util.blobToImage(blob);
-      const resolution = new Resolution(image.width, image.height);
+      const resolution = new cca.Resolution(image.width, image.height);
       await this.doSavePhoto_({resolution, blob}, imageName);
       cca.state.set('photo-capture-post-processing', false, {resolution});
     } catch (e) {
@@ -897,7 +888,7 @@ cca.views.camera.Square = class extends cca.views.camera.Photo {
   /**
    * @param {!MediaStream} stream
    * @param {!cca.views.camera.DoSavePhoto} doSavePhoto
-   * @param {?Resolution} captureResolution
+   * @param {?cca.Resolution} captureResolution
    * @param {!cca.views.camera.PlayShutterEffect} playShutterEffect
    */
   constructor(stream, doSavePhoto, captureResolution, playShutterEffect) {
@@ -945,7 +936,7 @@ cca.views.camera.Portrait = class extends cca.views.camera.Photo {
   /**
    * @param {!MediaStream} stream
    * @param {!cca.views.camera.DoSavePhoto} doSavePhoto
-   * @param {?Resolution} captureResolution
+   * @param {?cca.Resolution} captureResolution
    * @param {!cca.views.camera.PlayShutterEffect} playShutterEffect
    */
   constructor(stream, doSavePhoto, captureResolution, playShutterEffect) {

chrome/browser/resources/chromeos/camera/src/js/views/settings.js

@@ -14,17 +14,12 @@ var cca = cca || {};
  */
 cca.views = cca.views || {};
 
-/**
- * import {Resolution} from '../type.js';
- */
-var Resolution = Resolution || {};
-
 /* eslint-disable no-unused-vars */
 
 /**
  * Object of device id, preferred capture resolution and all
  * available resolutions for a particular video device.
- * @typedef {{prefResol: !Resolution, resols: !ResolutionList}}
+ * @typedef {{prefResol: !cca.Resolution, resols: !cca.ResolutionList}}
  */
 cca.views.ResolutionConfig;
 
@@ -281,7 +276,7 @@ cca.views.ResolutionSettings = class extends cca.views.BaseSettings {
         const /** !cca.views.DeviceSetting */ deviceSetting = {
           deviceId,
           photo: {
-            prefResol: /** @type {!Resolution} */ (
+            prefResol: /** @type {!cca.Resolution} */ (
                 photoPreferrer.getPrefResolution(deviceId)),
             resols:
                 /* Filter out resolutions of megapixels < 0.1 i.e. megapixels
@@ -289,7 +284,7 @@ cca.views.ResolutionSettings = class extends cca.views.BaseSettings {
                 photoResols.filter((r) => r.area >= 100000),
           },
           video: {
-            prefResol: /** @type {!Resolution} */ (
+            prefResol: /** @type {!cca.Resolution} */ (
                 videoPreferrer.getPrefResolution(deviceId)),
             resols: videoResols,
           },
@@ -319,8 +314,8 @@ cca.views.ResolutionSettings = class extends cca.views.BaseSettings {
 
   /**
    * Template for generating option text from photo resolution width and height.
-   * @param {!Resolution} r Resolution of text to be generated.
-   * @param {!ResolutionList} resolutions All available resolutions.
+   * @param {!cca.Resolution} r Resolution of text to be generated.
+   * @param {!cca.ResolutionList} resolutions All available resolutions.
    * @return {string} Text shown on resolution option item.
    * @private
    */
@@ -332,7 +327,7 @@ cca.views.ResolutionSettings = class extends cca.views.BaseSettings {
      */
     const gcd = (a, b) => (a === 0 ? b : gcd(b % a, a));
     /**
-     * @param {!Resolution} r
+     * @param {!cca.Resolution} r
      * @return {number}
      */
     const toMegapixel = (r) => Math.round(r.area / 100000) / 10;
@@ -352,7 +347,7 @@ cca.views.ResolutionSettings = class extends cca.views.BaseSettings {
 
   /**
    * Template for generating option text from video resolution width and height.
-   * @param {!Resolution} r Resolution of text to be generated.
+   * @param {!cca.Resolution} r Resolution of text to be generated.
    * @return {string} Text shown on resolution option item.
    * @private
    */
@@ -386,7 +381,8 @@ cca.views.ResolutionSettings = class extends cca.views.BaseSettings {
      * @param {!HTMLElement} item
      * @param {string} id
      * @param {!cca.views.ResolutionConfig} config
-     * @param {!function(!Resolution, !ResolutionList): string} optTextTempl
+     * @param {!function(!cca.Resolution, !cca.ResolutionList): string}
+     *     optTextTempl
      */
     const prepItem = (item, id, {prefResol, resols}, optTextTempl) => {
       item.dataset.deviceId = id;
@@ -489,7 +485,7 @@ cca.views.ResolutionSettings = class extends cca.views.BaseSettings {
   /**
    * Updates current selected photo resolution.
    * @param {string} deviceId Device id of the selected resolution.
-   * @param {!Resolution} resolution Selected resolution.
+   * @param {!cca.Resolution} resolution Selected resolution.
    * @private
    */
   updateSelectedPhotoResolution_(deviceId, resolution) {
@@ -522,7 +518,7 @@ cca.views.ResolutionSettings = class extends cca.views.BaseSettings {
   /**
    * Updates current selected video resolution.
    * @param {string} deviceId Device id of the selected resolution.
-   * @param {!Resolution} resolution Selected resolution.
+   * @param {!cca.Resolution} resolution Selected resolution.
    * @private
    */
   updateSelectedVideoResolution_(deviceId, resolution) {
@@ -588,14 +584,14 @@ cca.views.ResolutionSettings = class extends cca.views.BaseSettings {
    * Updates resolution menu with specified resolutions.
    * @param {!HTMLElement} resolItem DOM element holding selected resolution.
    * @param {!HTMLElement} menu Menu holding all resolution option elements.
-   * @param {!function(!Resolution, !ResolutionList): string} optTextTempl
-   *     Template generating text content for each resolution option from its
-   *     width and height.
-   * @param {!function(!Resolution)} onChange Called when selected option
+   * @param {!function(!cca.Resolution, !cca.ResolutionList): string}
+   *     optTextTempl Template generating text content for each resolution
+   *     option from its width and height.
+   * @param {!function(!cca.Resolution)} onChange Called when selected option
    *     changed with resolution of newly selected option.
-   * @param {!ResolutionList} resolutions Resolutions of its width and height to
-   *     be updated with.
-   * @param {!Resolution} selectedR Selected resolution.
+   * @param {!cca.ResolutionList} resolutions Resolutions of its width and
+   *     height to be updated with.
+   * @param {!cca.Resolution} selectedR Selected resolution.
    * @private
    */
   updateMenu_(resolItem, menu, optTextTempl, onChange, resolutions, selectedR) {

chrome/browser/resources/chromeos/camera/src/views/background.html

@@ -10,10 +10,10 @@
     <script src="../js/mojo/camera_intent.mojom-lite.js"></script>
     <script src="../js/mojo/camera_app_helper.mojom-lite.js"></script>
     <script type="module" src="../js/mojo/chrome_helper.js"></script>
-    <script src="../js/perf.js"></script>
-    <script src="../js/type.js"></script>
-    <script src="../js/intent.js"></script>
-    <script src="../js/background_ops.js"></script>
-    <script src="../js/background.js"></script>
+    <script type="module" src="../js/type.js"></script>
+    <script defer src="../js/perf.js"></script>
+    <script defer src="../js/intent.js"></script>
+    <script defer src="../js/background_ops.js"></script>
+    <script defer src="../js/background.js"></script>
   </head>
 </html>

chrome/browser/resources/chromeos/camera/src/views/main.html

@@ -13,54 +13,54 @@
     <script src="../js/chrome_util.js"></script>
     <script src="../js/browser_proxy/browser_proxy.js"></script>
     <script src="../js/google-analytics-bundle.js"></script>
-    <script src="../js/type.js"></script>
-    <script src="../js/perf.js"></script>
-    <script src="../js/metrics.js"></script>
-    <script src="../js/intent.js"></script>
-    <script src="../js/util.js"></script>
-    <script src="../js/toast.js"></script>
-    <script src="../js/tooltip.js"></script>
-    <script src="../js/state.js"></script>
-    <script src="../js/sound.js"></script>
-    <script src="../js/device/error.js"></script>
-    <script src="../js/device/camera3_device_info.js"></script>
-    <script src="../js/device/constraints_preferrer.js"></script>
-    <script src="../js/device/device_info_updater.js"></script>
-    <script src="../js/models/filenamer.js"></script>
-    <script src="../js/gallerybutton.js"></script>
-    <script src="../js/models/filesystem.js"></script>
-    <script src="../js/models/result_saver.js"></script>
-    <script src="../js/models/video_saver_interface.js"></script>
-    <script src="../js/models/file_video_saver.js"></script>
-    <script src="../js/models/intent_video_saver.js"></script>
-    <script src="../js/mojo/mojo_bindings_lite.js"></script>
-    <script src="../js/mojo/camera_metadata_tags.mojom-lite.js"></script>
-    <script src="../js/mojo/camera_metadata.mojom-lite.js"></script>
-    <script src="../js/mojo/camera_common.mojom-lite.js"></script>
-    <script src="../js/mojo/image_capture.mojom-lite.js"></script>
-    <script src="../js/mojo/geometry.mojom-lite.js"></script>
-    <script src="../js/mojo/range.mojom-lite.js"></script>
-    <script src="../js/mojo/camera_intent.mojom-lite.js"></script>
-    <script src="../js/mojo/camera_app.mojom-lite.js"></script>
-    <script src="../js/mojo/camera_app_helper.mojom-lite.js"></script>
+    <script type="module" src="../js/type.js"></script>
+    <script defer src="../js/perf.js"></script>
+    <script defer src="../js/metrics.js"></script>
+    <script defer src="../js/intent.js"></script>
+    <script defer src="../js/util.js"></script>
+    <script defer src="../js/toast.js"></script>
+    <script defer src="../js/tooltip.js"></script>
+    <script defer src="../js/state.js"></script>
+    <script defer src="../js/sound.js"></script>
+    <script defer src="../js/device/error.js"></script>
+    <script defer src="../js/device/camera3_device_info.js"></script>
+    <script defer src="../js/device/constraints_preferrer.js"></script>
+    <script defer src="../js/device/device_info_updater.js"></script>
+    <script defer src="../js/models/filenamer.js"></script>
+    <script defer src="../js/gallerybutton.js"></script>
+    <script defer src="../js/models/filesystem.js"></script>
+    <script defer src="../js/models/result_saver.js"></script>
+    <script defer src="../js/models/video_saver_interface.js"></script>
+    <script defer src="../js/models/file_video_saver.js"></script>
+    <script defer src="../js/models/intent_video_saver.js"></script>
+    <script defer src="../js/mojo/mojo_bindings_lite.js"></script>
+    <script defer src="../js/mojo/camera_metadata_tags.mojom-lite.js"></script>
+    <script defer src="../js/mojo/camera_metadata.mojom-lite.js"></script>
+    <script defer src="../js/mojo/camera_common.mojom-lite.js"></script>
+    <script defer src="../js/mojo/image_capture.mojom-lite.js"></script>
+    <script defer src="../js/mojo/geometry.mojom-lite.js"></script>
+    <script defer src="../js/mojo/range.mojom-lite.js"></script>
+    <script defer src="../js/mojo/camera_intent.mojom-lite.js"></script>
+    <script defer src="../js/mojo/camera_app.mojom-lite.js"></script>
+    <script defer src="../js/mojo/camera_app_helper.mojom-lite.js"></script>
     <script type="module" src="../js/mojo/chrome_helper.js"></script>
     <script type="module" src="../js/mojo/device_operator.js"></script>
-    <script src="../js/mojo/image_capture.js"></script>
-    <script src="../js/views/view.js"></script>
-    <script src="../js/views/camera.js"></script>
-    <script src="../js/views/camera_intent.js"></script>
-    <script src="../js/views/camera/layout.js"></script>
-    <script src="../js/views/camera/options.js"></script>
-    <script src="../js/views/camera/preview.js"></script>
-    <script src="../js/views/camera/recordtime.js"></script>
-    <script src="../js/views/camera/review_result.js"></script>
-    <script src="../js/views/camera/timertick.js"></script>
-    <script src="../js/views/camera/modes.js"></script>
-    <script src="../js/views/dialog.js"></script>
-    <script src="../js/views/settings.js"></script>
-    <script src="../js/views/warning.js"></script>
-    <script src="../js/nav.js"></script>
-    <script src="../js/main.js"></script>
+    <script defer src="../js/mojo/image_capture.js"></script>
+    <script defer src="../js/views/view.js"></script>
+    <script defer src="../js/views/camera.js"></script>
+    <script defer src="../js/views/camera_intent.js"></script>
+    <script defer src="../js/views/camera/layout.js"></script>
+    <script defer src="../js/views/camera/options.js"></script>
+    <script defer src="../js/views/camera/preview.js"></script>
+    <script defer src="../js/views/camera/recordtime.js"></script>
+    <script defer src="../js/views/camera/review_result.js"></script>
+    <script defer src="../js/views/camera/timertick.js"></script>
+    <script defer src="../js/views/camera/modes.js"></script>
+    <script defer src="../js/views/dialog.js"></script>
+    <script defer src="../js/views/settings.js"></script>
+    <script defer src="../js/views/warning.js"></script>
+    <script defer src="../js/nav.js"></script>
+    <script defer src="../js/main.js"></script>
   </head>
   <body class="sound mirror mic _3x3">
     <div id="camera">