Fallback to the XHR-like way of using fetch() and just grab all bytes as a single ArrayBuffer. Trying to see if this has the same weird problems as the chunk-by-chunk fetch.

Author: codedread

code/book.js

@@ -329,6 +329,7 @@ export class Book extends EventTarget {
       throw 'Request for book was not set in loadFromFetch()';
     }
 
+    let bytesTotal = 0;
     this.#needsLoading = false;
     this.dispatchEvent(new BookLoadingStartedEvent(this));
 
@@ -343,42 +344,41 @@ export class Book extends EventTarget {
 
     // =============================================================================================
     // Option 1: Readable code, fetching chunk by chunk using await.
-    const reader = response.body.getReader();
-
-    /**
-     * Reads one chunk at a time.
-     * @returns {Promise<ArrayBuffer | null>}
-     */
-    const getOneChunk = async () => {
-      const { done, value } = await reader.read();
-      if (!done) return value.buffer;
-      return null;
-    };
-
-    const firstChunk = await getOneChunk();
-    if (!firstChunk) {
-      throw `Could not get one chunk from fetch()`;
-    }
-    let bytesTotal = firstChunk.byteLength;
-
-    // Asynchronously wait for the BookBinder and its implementation to be connected.
-    await this.#startBookBinding(this.#name, firstChunk, this.#expectedSize);
-
-    // Read out all subsequent chunks.
-    /** @type {ArrayBuffer | null} */
-    let nextChunk;
-    while (nextChunk = await getOneChunk()) {
-      bytesTotal += nextChunk.byteLength;
-      this.appendBytes(nextChunk);
-      this.#bookBinder.appendBytes(nextChunk);
-    }
-
+    // const reader = response.body.getReader();
+
+    // /**
+    //  * Reads one chunk at a time.
+    //  * @returns {Promise<ArrayBuffer | null>}
+    //  */
+    // const getOneChunk = async () => {
+    //   const { done, value } = await reader.read();
+    //   if (!done) return value.buffer;
+    //   return null;
+    // };
+
+    // const firstChunk = await getOneChunk();
+    // if (!firstChunk) {
+    //   throw `Could not get one chunk from fetch()`;
+    // }
+    // bytesTotal = firstChunk.byteLength;
+
+    // // Asynchronously wait for the BookBinder and its implementation to be connected.
+    // await this.#startBookBinding(this.#name, firstChunk, this.#expectedSize);
+
+    // // Read out all subsequent chunks.
+    // /** @type {ArrayBuffer | null} */
+    // let nextChunk;
+    // while (nextChunk = await getOneChunk()) {
+    //   bytesTotal += nextChunk.byteLength;
+    //   this.appendBytes(nextChunk);
+    //   this.#bookBinder.appendBytes(nextChunk);
+    // }
 
     // =============================================================================================
     // Option 2: The XHR way (grab all bytes and only then start book binding).
-    // const ab = await response.arrayBuffer();
-    // bytesTotal = ab.byteLength;
-    // await this.#startBookBinding(this.#name, ab, this.#expectedSize);
+    const ab = await response.arrayBuffer();
+    bytesTotal = ab.byteLength;
+    await this.#startBookBinding(this.#name, ab, this.#expectedSize);
 
     // Send out BookLoadingComplete event and return this book.
     this.#finishedLoading = true;