1 files changed, 50 insertions, 17 deletions

diff --git a/ext/js/pages/settings/storage-controller.js b/ext/js/pages/settings/storage-controller.js
index ba1145b8..8af44b33 100644
--- a/ext/js/pages/settings/storage-controller.js
+++ b/ext/js/pages/settings/storage-controller.js
@@ -19,28 +19,43 @@
 import {yomitan} from '../../yomitan.js';
 
 export class StorageController {
+    /**
+     * @param {PersistentStorageController} persistentStorageController
+     */
     constructor(persistentStorageController) {
+    /** @type {PersistentStorageController} */
         this._persistentStorageController = persistentStorageController;
+        /** @type {?StorageEstimate} */
         this._mostRecentStorageEstimate = null;
+        /** @type {boolean} */
         this._storageEstimateFailed = false;
+        /** @type {boolean} */
         this._isUpdating = false;
-        this._storageUsageNode = null;
-        this._storageQuotaNode = null;
+        /** @type {?NodeListOf<HTMLElement>} */
+        this._storageUsageNodes = null;
+        /** @type {?NodeListOf<HTMLElement>} */
+        this._storageQuotaNodes = null;
+        /** @type {?NodeListOf<HTMLElement>} */
         this._storageUseFiniteNodes = null;
+        /** @type {?NodeListOf<HTMLElement>} */
         this._storageUseInfiniteNodes = null;
+        /** @type {?NodeListOf<HTMLElement>} */
         this._storageUseValidNodes = null;
+        /** @type {?NodeListOf<HTMLElement>} */
         this._storageUseInvalidNodes = null;
     }
 
+    /** */
     prepare() {
-        this._storageUsageNodes = document.querySelectorAll('.storage-usage');
-        this._storageQuotaNodes = document.querySelectorAll('.storage-quota');
-        this._storageUseFiniteNodes = document.querySelectorAll('.storage-use-finite');
-        this._storageUseInfiniteNodes = document.querySelectorAll('.storage-use-infinite');
-        this._storageUseValidNodes = document.querySelectorAll('.storage-use-valid');
-        this._storageUseInvalidNodes = document.querySelectorAll('.storage-use-invalid');
-
-        document.querySelector('#storage-refresh').addEventListener('click', this._onStorageRefreshButtonClick.bind(this), false);
+        this._storageUsageNodes = /** @type {NodeListOf<HTMLElement>} */ (document.querySelectorAll('.storage-usage'));
+        this._storageQuotaNodes = /** @type {NodeListOf<HTMLElement>} */ (document.querySelectorAll('.storage-quota'));
+        this._storageUseFiniteNodes = /** @type {NodeListOf<HTMLElement>} */ (document.querySelectorAll('.storage-use-finite'));
+        this._storageUseInfiniteNodes = /** @type {NodeListOf<HTMLElement>} */ (document.querySelectorAll('.storage-use-infinite'));
+        this._storageUseValidNodes = /** @type {NodeListOf<HTMLElement>} */ (document.querySelectorAll('.storage-use-valid'));
+        this._storageUseInvalidNodes = /** @type {NodeListOf<HTMLElement>} */ (document.querySelectorAll('.storage-use-invalid'));
+        const storageRefreshButton = /** @type {HTMLButtonElement} */ (document.querySelector('#storage-refresh'));
+
+        storageRefreshButton.addEventListener('click', this._onStorageRefreshButtonClick.bind(this), false);
         yomitan.on('storageChanged', this._onStorageChanged.bind(this));
 
         this._updateStats();
@@ -48,14 +63,17 @@ export class StorageController {
 
     // Private
 
+    /** */
     _onStorageRefreshButtonClick() {
         this._updateStats();
     }
 
+    /** */
     _onStorageChanged() {
         this._updateStats();
     }
 
+    /** */
     async _updateStats() {
         if (this._isUpdating) { return; }
 
@@ -66,13 +84,18 @@ export class StorageController {
             const valid = (estimate !== null);
 
             // Firefox reports usage as 0 when persistent storage is enabled.
-            const finite = valid && (estimate.usage > 0 || !(await this._persistentStorageController.isStoragePeristent()));
+            const finite = valid && ((typeof estimate.usage === 'number' && estimate.usage > 0) || !(await this._persistentStorageController.isStoragePeristent()));
             if (finite) {
-                for (const node of this._storageUsageNodes) {
-                    node.textContent = this._bytesToLabeledString(estimate.usage);
+                let {usage, quota} = estimate;
+                if (typeof usage !== 'number') { usage = 0; }
+                if (typeof quota !== 'number') { quota = 0; }
+                const usageString = this._bytesToLabeledString(usage);
+                const quotaString = this._bytesToLabeledString(quota);
+                for (const node of /** @type {NodeListOf<HTMLElement>} */ (this._storageUsageNodes)) {
+                    node.textContent = usageString;
                 }
-                for (const node of this._storageQuotaNodes) {
-                    node.textContent = this._bytesToLabeledString(estimate.quota);
+                for (const node of /** @type {NodeListOf<HTMLElement>} */ (this._storageQuotaNodes)) {
+                    node.textContent = quotaString;
                 }
             }
 
@@ -80,8 +103,6 @@ export class StorageController {
             this._setElementsVisible(this._storageUseInfiniteNodes, valid && !finite);
             this._setElementsVisible(this._storageUseValidNodes, valid);
             this._setElementsVisible(this._storageUseInvalidNodes, !valid);
-
-            return valid;
         } finally {
             this._isUpdating = false;
         }
@@ -89,6 +110,9 @@ export class StorageController {
 
     // Private
 
+    /**
+     * @returns {Promise<?StorageEstimate>}
+     */
     async _storageEstimate() {
         if (this._storageEstimateFailed && this._mostRecentStorageEstimate === null) {
             return null;
@@ -103,6 +127,10 @@ export class StorageController {
         return null;
     }
 
+    /**
+     * @param {number} size
+     * @returns {string}
+     */
     _bytesToLabeledString(size) {
         const base = 1000;
         const labels = [' bytes', 'KB', 'MB', 'GB', 'TB'];
@@ -116,7 +144,12 @@ export class StorageController {
         return `${label}${labels[labelIndex]}`;
     }
 
+    /**
+     * @param {?NodeListOf<HTMLElement>} elements
+     * @param {boolean} visible
+     */
     _setElementsVisible(elements, visible) {
+        if (elements === null) { return; }
         visible = !visible;
         for (const element of elements) {
             element.hidden = visible;