Add support to test it with webpack fluid laoder

packages/drivers/odsp-driver/src/contracts.ts

@@ -185,3 +185,11 @@ export interface ICreateFileResponse {
     itemUrl: string;
     sequenceNumber: number;
 }
+
+export interface IVersionedValueWithEpoch {
+    value: any;
+    fluidEpoch: string,
+    version: 2,
+}
+
+export const persistedCacheValueVersion = 2;

packages/drivers/odsp-driver/src/epochTracker.ts

@@ -24,22 +24,13 @@ import {
     IPersistedFileCache,
  } from "./odspCache";
 import { RateLimiter } from "./rateLimiter";
+import { IVersionedValueWithEpoch, persistedCacheValueVersion } from "./contracts";
 
 export type FetchType = "blob" | "createBlob" | "createFile" | "joinSession" | "ops" | "test" | "snapshotTree" |
     "treesLatest" | "uploadSummary" | "push" | "versions";
 
 export type FetchTypeInternal = FetchType | "cache";
 
-// exported only of test purposes
-export interface IVersionedValueWithEpoch {
-    value: any;
-    fluidEpoch: string,
-    version: 2,
-}
-
-// exported only of test purposes
-export const persistedCacheValueVersion = 2;
-
 /**
  * This class is a wrapper around fetch calls. It adds epoch to the request made so that the
  * server can match it with its epoch value in order to match the version.

packages/drivers/odsp-driver/src/index.ts

@@ -13,8 +13,13 @@ export * from "./odspPublicUtils";
 export * from "./odspUrlHelper";
 export * from "./createOdspUrl";
 export * from "./checkUrl";
+
+// prefetch latest snapshot before container load
 export * from "./prefetchLatestSnapshot";
 
+// Default implementations of odsp cache.
+export * from "./odspCache";
+
 // Factory
 export * from "./odspDocumentServiceFactoryCore";
 export * from "./odspDocumentServiceFactory";

packages/drivers/odsp-driver/src/prefetchLatestSnapshot.ts

@@ -27,7 +27,7 @@ import {
     ISnapshotCacheValue,
     toInstrumentedOdspTokenFetcher,
 } from "./odspUtils";
-import { IOdspSnapshot } from "./contracts";
+import { IOdspSnapshot, IVersionedValueWithEpoch } from "./contracts";
 
 /**
  * Function to prefetch the snapshot and cached it in the persistant cache, so that when the container is loaded
@@ -131,10 +131,12 @@ async function fetchSnapshot(
     };
 
     const controller: AbortController = new AbortController();
-    setTimeout(
-        () => controller.abort(),
-        snapshotOptions?.timeout,
-    );
+    if (snapshotOptions?.timeout !== undefined) {
+        setTimeout(
+            () => controller.abort(),
+            snapshotOptions.timeout,
+        );
+    }
 
     // This event measures only successful cases of getLatest call (no tokens, no retries).
     return PerformanceEvent.timedExecAsync(
@@ -149,12 +151,14 @@ async function fetchSnapshot(
                 {
                     body: postBody,
                     headers,
-                    signal: controller?.signal,
+                    signal: controller.signal,
                     method: "POST",
                 },
             );
             const snapshot: IOdspSnapshot = response.content;
             const spReqDuration = response.headers.get("sprequestduration");
+            const fluidEpoch = response.headers.get("x-fluid-epoch");
+            assert(fluidEpoch !== undefined, "Epoch  should be present in response");
 
             const { numTrees, numBlobs, encodedBlobsSize, decodedBlobsSize } = evalBlobsAndTrees(snapshot);
 
@@ -175,9 +179,14 @@ async function fetchSnapshot(
                 logger.sendErrorEvent({ eventName: "fetchSnapshotError", sequenceNumber, seqNumberFromOps });
                 value.sequenceNumber = undefined;
             } else if (canCache) {
-                persistedCache.put(
-                    snapshotCacheEntry,
+                const valueWithEpoch: IVersionedValueWithEpoch = {
                     value,
+                    fluidEpoch,
+                    version: 2,
+                };
+                await persistedCache.put(
+                    snapshotCacheEntry,
+                    valueWithEpoch,
                 ).then(() => success = true)
                 .catch(() => {});
             }

packages/drivers/odsp-driver/src/test/epochTests.spec.ts

@@ -11,16 +11,11 @@ import {
     ICacheEntry,
     IEntry,
 } from "@fluidframework/odsp-driver-definitions";
-import {
-    EpochTracker,
-    IVersionedValueWithEpoch,
-    persistedCacheValueVersion,
-} from "../epochTracker";
-import {
-    LocalPersistentCache,
- } from "../odspCache";
- import { getHashedDocumentId } from "../odspPublicUtils";
- import { mockFetchOk, mockFetchSingle, createResponse } from "./mockFetch";
+import { EpochTracker } from "../epochTracker";
+import { LocalPersistentCache } from "../odspCache";
+import { getHashedDocumentId } from "../odspPublicUtils";
+import { IVersionedValueWithEpoch, persistedCacheValueVersion } from "../contracts";
+import { mockFetchOk, mockFetchSingle, createResponse } from "./mockFetch";
 
 const createUtLocalCache = () => new LocalPersistentCache(2000);
 

packages/tools/webpack-fluid-loader/package.json

@@ -67,6 +67,7 @@
     "@fluidframework/local-driver": "^0.40.0",
     "@fluidframework/odsp-doclib-utils": "^0.40.0",
     "@fluidframework/odsp-driver": "^0.40.0",
+    "@fluidframework/odsp-driver-definitions": "0.40.0",
     "@fluidframework/protocol-definitions": "^0.1024.0-0",
     "@fluidframework/routerlicious-driver": "^0.40.0",
     "@fluidframework/runtime-utils": "^0.40.0",

packages/tools/webpack-fluid-loader/src/loader.ts

@@ -6,7 +6,7 @@
 import * as moniker from "moniker";
 import { v4 as uuid } from "uuid";
 import { ContainerRuntimeFactoryWithDefaultDataStore } from "@fluidframework/aqueduct";
-import { Deferred } from "@fluidframework/common-utils";
+import { assert, BaseTelemetryNullLogger, Deferred } from "@fluidframework/common-utils";
 import {
     AttachState,
     IFluidModule,
@@ -15,6 +15,8 @@ import {
     isFluidBrowserPackage,
 } from "@fluidframework/container-definitions";
 import { Container, Loader } from "@fluidframework/container-loader";
+import { LocalPersistentCache, prefetchLatestSnapshot } from "@fluidframework/odsp-driver";
+import { IPersistedCache } from "@fluidframework/odsp-driver-definitions";
 import { IUser } from "@fluidframework/protocol-definitions";
 import { HTMLViewAdapter } from "@fluidframework/view-adapters";
 import { IFluidMountableView } from "@fluidframework/view-interfaces";
@@ -154,8 +156,10 @@ async function createWebLoader(
     urlResolver: MultiUrlResolver,
     codeDetails: IFluidCodeDetails,
     testOrderer: boolean = false,
+    odspPersistantCache?: IPersistedCache,
 ): Promise<Loader> {
-    let documentServiceFactory: IDocumentServiceFactory = getDocumentServiceFactory(documentId, options);
+    let documentServiceFactory: IDocumentServiceFactory =
+        getDocumentServiceFactory(documentId, options, odspPersistantCache);
     // Create the inner document service which will be wrapped inside local driver. The inner document service
     // will be used for ops(like delta connection/delta ops) while for storage, local storage would be used.
     if (testOrderer) {
@@ -222,9 +226,17 @@ export async function start(
     };
 
     let urlResolver = new MultiUrlResolver(documentId, window.location.origin, options);
+    const odspPersistantCache = new LocalPersistentCache();
 
     // Create the loader that is used to load the Container.
-    let loader1 = await createWebLoader(documentId, fluidModule, options, urlResolver, codeDetails, testOrderer);
+    let loader1 = await createWebLoader(
+        documentId,
+        fluidModule,
+        options,
+        urlResolver,
+        codeDetails,
+        testOrderer,
+        odspPersistantCache);
 
     let container1: Container;
     if (autoAttach || manualAttach) {
@@ -234,6 +246,19 @@ export async function start(
     } else {
         // For existing documents, we try to load the container with the given documentId.
         const documentUrl = `${window.location.origin}/${documentId}`;
+        // This functionality is used in odsp driver to prefetch the latest snapshot and cache it so
+        // as to avoid the network call to fetch trees latest.
+        if (window.location.hash === "#prefetch") {
+            assert(options.mode === "spo-df" || options.mode === "spo", "Prefetch snapshot only available for odsp!");
+            const prefetched = await prefetchLatestSnapshot(
+                await urlResolver.resolve({ url: documentUrl }),
+                async () => options.odspAccessToken,
+                odspPersistantCache,
+                new BaseTelemetryNullLogger(),
+                undefined,
+            );
+            assert(prefetched, "Snapshot should be prefetched!");
+        }
         container1 = await loader1.resolve({ url: documentUrl });
         containers.push(container1);
 

packages/tools/webpack-fluid-loader/src/multiDocumentServiceFactory.ts

@@ -7,6 +7,7 @@ import { ILocalDeltaConnectionServer, LocalDeltaConnectionServer } from "@fluidf
 import { MultiDocumentServiceFactory } from "@fluidframework/driver-utils";
 import { LocalDocumentServiceFactory, LocalSessionStorageDbFactory } from "@fluidframework/local-driver";
 import { OdspDocumentServiceFactory } from "@fluidframework/odsp-driver";
+import { IPersistedCache } from "@fluidframework/odsp-driver-definitions";
 import { RouterliciousDocumentServiceFactory } from "@fluidframework/routerlicious-driver";
 import { getRandomName } from "@fluidframework/server-services-client";
 import { InsecureTokenProvider } from "@fluidframework/test-runtime-utils";
@@ -15,7 +16,11 @@ import { IDevServerUser, IRouterliciousRouteOptions, RouteOptions } from "./load
 
 export const deltaConns = new Map<string, ILocalDeltaConnectionServer>();
 
-export function getDocumentServiceFactory(documentId: string, options: RouteOptions) {
+export function getDocumentServiceFactory(
+    documentId: string,
+    options: RouteOptions,
+    odspPersistantCache: IPersistedCache,
+) {
     const deltaConn = deltaConns.get(documentId) ??
         LocalDeltaConnectionServer.create(new LocalSessionStorageDbFactory(documentId));
     deltaConns.set(documentId, deltaConn);
@@ -44,6 +49,7 @@ export function getDocumentServiceFactory(documentId: string, options: RouteOpti
         new OdspDocumentServiceFactory(
             async () => options.mode === "spo" || options.mode === "spo-df" ? options.odspAccessToken : undefined,
             async () => options.mode === "spo" || options.mode === "spo-df" ? options.pushAccessToken : undefined,
+            odspPersistantCache,
         ),
         new RouterliciousDocumentServiceFactory(routerliciousTokenProvider),
     ]);