Merge branch 'dev' into fix-webassembly-instantiate

lib/entry-data-plugin.js

@@ -77,7 +77,9 @@ export default function entryDataPlugin() {
             }
 
             return JSON.stringify(
-              getDependencies(chunks, chunk).map((filename) => fileNameToURL(filename)),
+              getDependencies(chunks, chunk).map((filename) =>
+                fileNameToURL(filename),
+              ),
             );
           },
         );

package-lock.json

@@ -16,8 +16,8 @@
         "@rollup/plugin-replace": "^2.3.4",
         "@surma/rollup-plugin-off-main-thread": "^2.2.2",
         "@types/dedent": "^0.7.0",
-        "@types/mime-types": "^2.1.0",
+        "@types/mime-types": "^2.1.1",
-        "@types/node": "^14.14.7",
+        "@types/node": "^16.11.1",
         "@web/rollup-plugin-import-meta-assets": "^1.0.6",
         "comlink": "^4.3.0",
         "cssnano": "^4.1.10",
@@ -40,11 +40,11 @@
         "postcss-url": "^8.0.0",
         "preact": "^10.5.5",
         "preact-render-to-string": "^5.1.11",
-        "prettier": "^2.1.2",
+        "prettier": "^2.4.1",
         "rollup": "^2.38.0",
         "rollup-plugin-terser": "^7.0.2",
         "serve": "^11.3.2",
-        "typescript": "^4.1.3",
+        "typescript": "^4.4.4",
         "which": "^2.0.2"
       }
     },
@@ -315,9 +315,9 @@
       }
     },
     "node_modules/@types/mime-types": {
-      "version": "2.1.0",
+      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/@types/mime-types/-/mime-types-2.1.0.tgz",
+      "resolved": "https://registry.npmjs.org/@types/mime-types/-/mime-types-2.1.1.tgz",
-      "integrity": "sha1-nKUs2jY/aZxpRmwqbM2q2RPqenM=",
+      "integrity": "sha512-vXOTGVSLR2jMw440moWTC7H19iUyLtP3Z1YTj7cSsubOICinjMxFeb/V57v9QdyyPGbbWolUFSSmSiRSn94tFw==",
       "dev": true
     },
     "node_modules/@types/minimatch": {
@@ -327,9 +327,9 @@
       "dev": true
     },
     "node_modules/@types/node": {
-      "version": "14.14.7",
+      "version": "16.11.1",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.7.tgz",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.1.tgz",
-      "integrity": "sha512-Zw1vhUSQZYw+7u5dAwNbIA9TuTotpzY/OF7sJM9FqPOF3SPjKnxrjoTktXDZgUjybf4cWVBP7O8wvKdSaGHweg==",
+      "integrity": "sha512-PYGcJHL9mwl1Ek3PLiYgyEKtwTMmkMw4vbiyz/ps3pfdRYLVv+SN7qHVAImrjdAXxgluDEw6Ph4lyv+m9UpRmA==",
       "dev": true
     },
     "node_modules/@types/parse-json": {
@@ -7407,9 +7407,9 @@
       }
     },
     "node_modules/prettier": {
-      "version": "2.1.2",
+      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.1.2.tgz",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.4.1.tgz",
-      "integrity": "sha512-16c7K+x4qVlJg9rEbXl7HEGmQyZlG4R9AgP+oHKRMsMsuk8s+ATStlf1NpDqyBI1HpVyfjLOeMhH2LvuNvV5Vg==",
+      "integrity": "sha512-9fbDAXSBcc6Bs1mZrDYb3XKzDLm4EXXL9sC1LqKP5rZkT6KRr/rf9amVUcODVXgguK/isJz0d0hP72WeaKWsvA==",
       "dev": true,
       "bin": {
         "prettier": "bin-prettier.js"
@@ -8471,9 +8471,9 @@
       }
     },
     "node_modules/typescript": {
-      "version": "4.1.3",
+      "version": "4.4.4",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.1.3.tgz",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.4.4.tgz",
-      "integrity": "sha512-B3ZIOf1IKeH2ixgHhj6la6xdwR9QrLC5d1VKeCSY4tvkqhF2eqd9O7txNlS0PO3GrBAFIdr3L1ndNwteUbZLYg==",
+      "integrity": "sha512-DqGhF5IKoBl8WNf8C1gu8q0xZSInh9j1kJJMqT3a94w1JzVaBU4EXOSMrz9yDqMT0xt3selp83fuFMQ0uzv6qA==",
       "dev": true,
       "bin": {
         "tsc": "bin/tsc",
@@ -8903,9 +8903,9 @@
       }
     },
     "@types/mime-types": {
-      "version": "2.1.0",
+      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/@types/mime-types/-/mime-types-2.1.0.tgz",
+      "resolved": "https://registry.npmjs.org/@types/mime-types/-/mime-types-2.1.1.tgz",
-      "integrity": "sha1-nKUs2jY/aZxpRmwqbM2q2RPqenM=",
+      "integrity": "sha512-vXOTGVSLR2jMw440moWTC7H19iUyLtP3Z1YTj7cSsubOICinjMxFeb/V57v9QdyyPGbbWolUFSSmSiRSn94tFw==",
       "dev": true
     },
     "@types/minimatch": {
@@ -8915,9 +8915,9 @@
       "dev": true
     },
     "@types/node": {
-      "version": "14.14.7",
+      "version": "16.11.1",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.7.tgz",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.1.tgz",
-      "integrity": "sha512-Zw1vhUSQZYw+7u5dAwNbIA9TuTotpzY/OF7sJM9FqPOF3SPjKnxrjoTktXDZgUjybf4cWVBP7O8wvKdSaGHweg==",
+      "integrity": "sha512-PYGcJHL9mwl1Ek3PLiYgyEKtwTMmkMw4vbiyz/ps3pfdRYLVv+SN7qHVAImrjdAXxgluDEw6Ph4lyv+m9UpRmA==",
       "dev": true
     },
     "@types/parse-json": {
@@ -14795,9 +14795,9 @@
       }
     },
     "prettier": {
-      "version": "2.1.2",
+      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.1.2.tgz",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.4.1.tgz",
-      "integrity": "sha512-16c7K+x4qVlJg9rEbXl7HEGmQyZlG4R9AgP+oHKRMsMsuk8s+ATStlf1NpDqyBI1HpVyfjLOeMhH2LvuNvV5Vg==",
+      "integrity": "sha512-9fbDAXSBcc6Bs1mZrDYb3XKzDLm4EXXL9sC1LqKP5rZkT6KRr/rf9amVUcODVXgguK/isJz0d0hP72WeaKWsvA==",
       "dev": true
     },
     "pretty-format": {
@@ -15677,9 +15677,9 @@
       "dev": true
     },
     "typescript": {
-      "version": "4.1.3",
+      "version": "4.4.4",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.1.3.tgz",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.4.4.tgz",
-      "integrity": "sha512-B3ZIOf1IKeH2ixgHhj6la6xdwR9QrLC5d1VKeCSY4tvkqhF2eqd9O7txNlS0PO3GrBAFIdr3L1ndNwteUbZLYg==",
+      "integrity": "sha512-DqGhF5IKoBl8WNf8C1gu8q0xZSInh9j1kJJMqT3a94w1JzVaBU4EXOSMrz9yDqMT0xt3selp83fuFMQ0uzv6qA==",
       "dev": true
     },
     "uniq": {

package.json

@@ -17,8 +17,8 @@
     "@rollup/plugin-replace": "^2.3.4",
     "@surma/rollup-plugin-off-main-thread": "^2.2.2",
     "@types/dedent": "^0.7.0",
-    "@types/mime-types": "^2.1.0",
+    "@types/mime-types": "^2.1.1",
-    "@types/node": "^14.14.7",
+    "@types/node": "^16.11.1",
     "@web/rollup-plugin-import-meta-assets": "^1.0.6",
     "comlink": "^4.3.0",
     "cssnano": "^4.1.10",
@@ -41,11 +41,11 @@
     "postcss-url": "^8.0.0",
     "preact": "^10.5.5",
     "preact-render-to-string": "^5.1.11",
-    "prettier": "^2.1.2",
+    "prettier": "^2.4.1",
     "rollup": "^2.38.0",
     "rollup-plugin-terser": "^7.0.2",
     "serve": "^11.3.2",
-    "typescript": "^4.1.3",
+    "typescript": "^4.4.4",
     "which": "^2.0.2"
   },
   "lint-staged": {

src/client/lazy-app/Compress/Options/index.tsx

@@ -40,24 +40,23 @@ type PartialButNotUndefined<T> = {
   [P in keyof T]: T[P];
 };
 
-const supportedEncoderMapP: Promise<PartialButNotUndefined<
+const supportedEncoderMapP: Promise<PartialButNotUndefined<typeof encoderMap>> =
-  typeof encoderMap
+  (async () => {
->> = (async () => {
+    const supportedEncoderMap: PartialButNotUndefined<typeof encoderMap> = {
-  const supportedEncoderMap: PartialButNotUndefined<typeof encoderMap> = {
+      ...encoderMap,
-    ...encoderMap,
+    };
-  };
 
-  // Filter out entries where the feature test fails
+    // Filter out entries where the feature test fails
-  await Promise.all(
+    await Promise.all(
-    Object.entries(encoderMap).map(async ([encoderName, details]) => {
+      Object.entries(encoderMap).map(async ([encoderName, details]) => {
-      if ('featureTest' in details && !(await details.featureTest())) {
+        if ('featureTest' in details && !(await details.featureTest())) {
-        delete supportedEncoderMap[encoderName as keyof typeof encoderMap];
+          delete supportedEncoderMap[encoderName as keyof typeof encoderMap];
-      }
+        }
-    }),
+      }),
-  );
+    );
 
-  return supportedEncoderMap;
+    return supportedEncoderMap;
-})();
+  })();
 
 export default class Options extends Component<Props, State> {
   state: State = {

src/client/lazy-app/Compress/index.tsx

@@ -116,7 +116,7 @@ async function decodeImage(
     // Otherwise fall through and try built-in decoding for a laugh.
     return await builtinDecode(signal, blob, mimeType);
   } catch (err) {
-    if (err.name === 'AbortError') throw err;
+    if (err instanceof Error && err.name === 'AbortError') throw err;
     console.log(err);
     throw Error("Couldn't decode image");
   }
@@ -481,7 +481,7 @@ export default class Compress extends Component<Props, State> {
         open('https://github.com/GoogleChromeLabs/squoosh/tree/dev/cli');
       }
     } catch (e) {
-      this.props.showSnack(e);
+      this.props.showSnack(String(e));
     }
   };
 
@@ -640,7 +640,7 @@ export default class Compress extends Component<Props, State> {
           return { sides };
         });
       } catch (err) {
-        if (err.name === 'AbortError') return;
+        if (err instanceof Error && err.name === 'AbortError') return;
         this.props.showSnack(`Source decoding error: ${err}`);
         throw err;
       }
@@ -698,7 +698,7 @@ export default class Compress extends Component<Props, State> {
           return newState;
         });
       } catch (err) {
-        if (err.name === 'AbortError') return;
+        if (err instanceof Error && err.name === 'AbortError') return;
         this.setState({ loading: false });
         this.props.showSnack(`Preprocessing error: ${err}`);
         throw err;
@@ -822,7 +822,7 @@ export default class Compress extends Component<Props, State> {
 
         this.activeSideJobs[sideIndex] = undefined;
       } catch (err) {
-        if (err.name === 'AbortError') return;
+        if (err instanceof Error && err.name === 'AbortError') return;
         this.setState((currentState) => {
           const sides = cleanMerge(currentState.sides, sideIndex, {
             loading: false,

src/features/encoders/oxiPNG/worker/oxipngEncode.ts

@@ -14,9 +14,11 @@ import { EncodeOptions } from '../shared/meta';
 import { threads } from 'wasm-feature-detect';
 
 async function initMT() {
-  const { default: init, initThreadPool, optimise } = await import(
+  const {
-    'codecs/oxipng/pkg-parallel/squoosh_oxipng'
+    default: init,
-  );
+    initThreadPool,
+    optimise,
+  } = await import('codecs/oxipng/pkg-parallel/squoosh_oxipng');
   await init();
   await initThreadPool(navigator.hardwareConcurrency);
   return optimise;

src/shared/custom-els/loading-spinner/index.ts

@@ -2,9 +2,9 @@ import * as styles from './styles.css';
 import 'add-css:./styles.css';
 
 // So it doesn't cause an error when running in node
-const HTMLEl = ((__PRERENDER__
+const HTMLEl = (__PRERENDER__
   ? Object
-  : HTMLElement) as unknown) as typeof HTMLElement;
+  : HTMLElement) as unknown as typeof HTMLElement;
 
 /**
  * A simple spinner. This custom element has no JS API. Just put it in the document, and it'll

src/shared/custom-els/snack-bar/index.ts

@@ -2,9 +2,9 @@ import * as style from './styles.css';
 import 'add-css:./styles.css';
 
 // So it doesn't cause an error when running in node
-const HTMLEl = ((__PRERENDER__
+const HTMLEl = (__PRERENDER__
   ? Object
-  : HTMLElement) as unknown) as typeof HTMLElement;
+  : HTMLElement) as unknown as typeof HTMLElement;
 
 export interface SnackOptions {
   timeout?: number;

src/shared/missing-types.d.ts

@@ -13,24 +13,3 @@
 /// <reference path="../../missing-types.d.ts" />
 
 declare const __PRERENDER__: boolean;
-
-type ResizeObserverCallback = (
-  entries: ResizeObserverEntry[],
-  observer: ResizeObserver,
-) => void;
-
-interface ResizeObserverEntry {
-  readonly target: Element;
-  readonly contentRect: DOMRectReadOnly;
-}
-
-interface ResizeObserver {
-  observe(target: Element): void;
-  unobserve(target: Element): void;
-  disconnect(): void;
-}
-
-declare var ResizeObserver: {
-  prototype: ResizeObserver;
-  new (callback: ResizeObserverCallback): ResizeObserver;
-};

src/shared/prerendered-app/Intro/missing-types.d.ts

@@ -30,11 +30,6 @@ interface WindowEventMap {
   beforeinstallprompt: BeforeInstallPromptEvent;
 }
 
-interface ClipboardItem {
-  types: string[];
-  getType(type: string): Promise<Blob>;
-}
-
 interface Clipboard {
   read(): Promise<ClipboardItem[]>;
 }

src/sw/to-cache.ts

@@ -82,24 +82,20 @@ initialJs = subtractSets(
 export const initial = ['/', ...initialJs];
 
 export const theRest = (async () => {
-  const [
+  const [supportsThreads, supportsSimd, supportsWebP, supportsAvif] =
-    supportsThreads,
+    await Promise.all([
-    supportsSimd,
+      threads(),
-    supportsWebP,
+      simd(),
-    supportsAvif,
+      ...[webpDataUrl, avifDataUrl].map(async (dataUrl) => {
-  ] = await Promise.all([
+        if (!self.createImageBitmap) return false;
-    threads(),
+        const response = await fetch(dataUrl);
-    simd(),
+        const blob = await response.blob();
-    ...[webpDataUrl, avifDataUrl].map(async (dataUrl) => {
+        return createImageBitmap(blob).then(
-      if (!self.createImageBitmap) return false;
+          () => true,
-      const response = await fetch(dataUrl);
+          () => false,
-      const blob = await response.blob();
+        );
-      return createImageBitmap(blob).then(
+      }),
-        () => true,
+    ]);
-        () => false,
-      );
-    }),
-  ]);
 
   const items: string[] = [];