serwist 10.0.0-preview.7 → 10.0.0-preview.9

package/src/lib/functions/router.ts

@@ -0,0 +1,314 @@
+import { assert } from "#utils/assert.js";
+import { getFriendlyURL } from "#utils/getFriendlyURL.js";
+import { logger } from "#utils/logger.js";
+import { parseRoute } from "#utils/parseRoute.js";
+import { SerwistError } from "#utils/SerwistError.js";
+import type { HTTPMethod } from "../constants.js";
+import type { Serwist } from "../core.js";
+import type { Route } from "../route.js";
+import type { RouteHandler, RouteHandlerCallbackOptions, RouteMatchCallback, RouteMatchCallbackOptions } from "../types.js";
+
+/**
+ * Registers a `RegExp`, string, or function with a caching
+ * strategy to the router.
+ *
+ * @param capture If the capture param is a {@linkcode Route} object, all other arguments will be ignored.
+ * @param handler A callback function that returns a `Promise` resulting in a `Response`.
+ * This parameter is required if `capture` is not a {@linkcode Route} object.
+ * @param method The HTTP method to match the route against. Defaults to `'GET'`.
+ * @returns The generated {@linkcode Route} object.
+ */
+export const registerCapture = <T extends RegExp | string | RouteMatchCallback | Route>(
+  state: Serwist,
+  capture: T,
+  handler?: T extends Route ? never : RouteHandler,
+  method?: T extends Route ? never : HTTPMethod,
+): Route => {
+  const route = parseRoute(capture, handler, method);
+  registerRoute(state, route);
+  return route;
+};
+
+/**
+ * Registers a {@linkcode Route} with the router.
+ *
+ * @param route The {@linkcode Route} to register.
+ */
+export const registerRoute = (state: Serwist, route: Route): void => {
+  if (process.env.NODE_ENV !== "production") {
+    assert!.isType(route, "object", {
+      moduleName: "serwist",
+      className: "Serwist",
+      funcName: "registerRoute",
+      paramName: "route",
+    });
+
+    assert!.hasMethod(route, "match", {
+      moduleName: "serwist",
+      className: "Serwist",
+      funcName: "registerRoute",
+      paramName: "route",
+    });
+
+    assert!.isType(route.handler, "object", {
+      moduleName: "serwist",
+      className: "Serwist",
+      funcName: "registerRoute",
+      paramName: "route",
+    });
+
+    assert!.hasMethod(route.handler, "handle", {
+      moduleName: "serwist",
+      className: "Serwist",
+      funcName: "registerRoute",
+      paramName: "route.handler",
+    });
+
+    assert!.isType(route.method, "string", {
+      moduleName: "serwist",
+      className: "Serwist",
+      funcName: "registerRoute",
+      paramName: "route.method",
+    });
+  }
+
+  if (!state.routes.has(route.method)) {
+    state.routes.set(route.method, []);
+  }
+
+  // Give precedence to all of the earlier routes by adding this additional
+  // route to the end of the array.
+  state.routes.get(route.method)!.push(route);
+};
+
+/**
+ * Unregisters a route from the router.
+ *
+ * @param route The {@linkcode Route} object to unregister.
+ */
+export const unregisterRoute = (state: Serwist, route: Route): void => {
+  if (!state.routes.has(route.method)) {
+    throw new SerwistError("unregister-route-but-not-found-with-method", {
+      method: route.method,
+    });
+  }
+
+  const routeIndex = state.routes.get(route.method)!.indexOf(route);
+  if (routeIndex > -1) {
+    state.routes.get(route.method)!.splice(routeIndex, 1);
+  } else {
+    throw new SerwistError("unregister-route-route-not-registered");
+  }
+};
+
+/**
+ * Applies the routing rules to a `FetchEvent` object to get a response from an
+ * appropriate route.
+ *
+ * @param options
+ * @returns A promise is returned if a registered route can handle the request.
+ * If there is no matching route and there's no default handler, `undefined`
+ * is returned.
+ */
+export const handleRequest = (
+  state: Serwist,
+  {
+    request,
+    event,
+  }: {
+    /**
+     * The request to handle.
+     */
+    request: Request;
+    /**
+     * The event that triggered the request.
+     */
+    event: ExtendableEvent;
+  },
+): Promise<Response> | undefined => {
+  if (process.env.NODE_ENV !== "production") {
+    assert!.isInstance(request, Request, {
+      moduleName: "serwist",
+      className: "Serwist",
+      funcName: "handleRequest",
+      paramName: "options.request",
+    });
+  }
+
+  const url = new URL(request.url, location.href);
+  if (!url.protocol.startsWith("http")) {
+    if (process.env.NODE_ENV !== "production") {
+      logger.debug("Router only supports URLs that start with 'http'.");
+    }
+    return;
+  }
+
+  const sameOrigin = url.origin === location.origin;
+  const { params, route } = findMatchingRoute(state, {
+    event,
+    request,
+    sameOrigin,
+    url,
+  });
+  let handler = route?.handler;
+
+  const debugMessages = [];
+  if (process.env.NODE_ENV !== "production") {
+    if (handler) {
+      debugMessages.push(["Found a route to handle this request:", route]);
+
+      if (params) {
+        debugMessages.push([`Passing the following params to the route's handler:`, params]);
+      }
+    }
+  }
+
+  // If we don't have a handler because there was no matching route, then
+  // fall back to defaultHandler if that's defined.
+  const method = request.method as HTTPMethod;
+  if (!handler && state.defaultHandlerMap.has(method)) {
+    if (process.env.NODE_ENV !== "production") {
+      debugMessages.push(`Failed to find a matching route. Falling back to the default handler for ${method}.`);
+    }
+    handler = state.defaultHandlerMap.get(method);
+  }
+
+  if (!handler) {
+    if (process.env.NODE_ENV !== "production") {
+      // No handler so Serwist will do nothing. If logs is set of debug
+      // i.e. verbose, we should print out this information.
+      logger.debug(`No route found for: ${getFriendlyURL(url)}`);
+    }
+    return;
+  }
+
+  if (process.env.NODE_ENV !== "production") {
+    // We have a handler, meaning Serwist is going to handle the route.
+    // print the routing details to the console.
+    logger.groupCollapsed(`Router is responding to: ${getFriendlyURL(url)}`);
+
+    for (const msg of debugMessages) {
+      if (Array.isArray(msg)) {
+        logger.log(...msg);
+      } else {
+        logger.log(msg);
+      }
+    }
+
+    logger.groupEnd();
+  }
+
+  // Wrap in try and catch in case the handle method throws a synchronous
+  // error. It should still callback to the catch handler.
+  let responsePromise: Promise<Response>;
+  try {
+    responsePromise = handler.handle({ url, request, event, params });
+  } catch (err) {
+    responsePromise = Promise.reject(err);
+  }
+
+  // Get route's catch handler, if it exists
+  const catchHandler = route?.catchHandler;
+
+  if (responsePromise instanceof Promise && (state.catchHandler || catchHandler)) {
+    responsePromise = responsePromise.catch(async (err) => {
+      // If there's a route catch handler, process that first
+      if (catchHandler) {
+        if (process.env.NODE_ENV !== "production") {
+          // Still include URL here as it will be async from the console group
+          // and may not make sense without the URL
+          logger.groupCollapsed(`Error thrown when responding to:  ${getFriendlyURL(url)}. Falling back to route's Catch Handler.`);
+          logger.error("Error thrown by:", route);
+          logger.error(err);
+          logger.groupEnd();
+        }
+
+        try {
+          return await catchHandler.handle({ url, request, event, params });
+        } catch (catchErr) {
+          if (catchErr instanceof Error) {
+            err = catchErr;
+          }
+        }
+      }
+
+      if (state.catchHandler) {
+        if (process.env.NODE_ENV !== "production") {
+          // Still include URL here as it will be async from the console group
+          // and may not make sense without the URL
+          logger.groupCollapsed(`Error thrown when responding to:  ${getFriendlyURL(url)}. Falling back to global Catch Handler.`);
+          logger.error("Error thrown by:", route);
+          logger.error(err);
+          logger.groupEnd();
+        }
+        return state.catchHandler.handle({ url, request, event });
+      }
+
+      throw err;
+    });
+  }
+
+  return responsePromise;
+};
+
+/**
+ * Checks a request and URL (and optionally an event) against the list of
+ * registered routes, and if there's a match, returns the corresponding
+ * route along with any params generated by the match.
+ *
+ * @param options
+ * @returns An object with `route` and `params` properties. They are populated
+ * if a matching route was found or `undefined` otherwise.
+ */
+export const findMatchingRoute = (
+  state: Serwist,
+  { url, sameOrigin, request, event }: RouteMatchCallbackOptions,
+): {
+  route?: Route;
+  params?: RouteHandlerCallbackOptions["params"];
+} => {
+  const routes = state.routes.get(request.method as HTTPMethod) || [];
+  for (const route of routes) {
+    let params: Promise<any> | undefined;
+    // route.match returns type any, not possible to change right now.
+    const matchResult = route.match({ url, sameOrigin, request, event });
+    if (matchResult) {
+      if (process.env.NODE_ENV !== "production") {
+        // Warn developers that using an async matchCallback is almost always
+        // not the right thing to do.
+        if (matchResult instanceof Promise) {
+          logger.warn(
+            `While routing ${getFriendlyURL(
+              url,
+            )}, an async matchCallback function was used. Please convert the following route to use a synchronous matchCallback function:`,
+            route,
+          );
+        }
+      }
+
+      // See https://github.com/GoogleChrome/workbox/issues/2079
+      // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+      params = matchResult;
+      if (Array.isArray(params) && params.length === 0) {
+        // Instead of passing an empty array in as params, use undefined.
+        params = undefined;
+      } else if (
+        matchResult.constructor === Object && // eslint-disable-line
+        Object.keys(matchResult).length === 0
+      ) {
+        // Instead of passing an empty object in as params, use undefined.
+        params = undefined;
+      } else if (typeof matchResult === "boolean") {
+        // For the boolean value true (rather than just something truth-y),
+        // don't set params.
+        // See https://github.com/GoogleChrome/workbox/pull/2134#issuecomment-513924353
+        params = undefined;
+      }
+
+      // Return early if have a match.
+      return { route, params };
+    }
+  }
+  // If no match was found above, return and empty object.
+  return {};
+};

package/src/lib/{rangeRequests → range-requests}/RangeRequestsPlugin.ts

@@ -6,7 +6,7 @@
   https://opensource.org/licenses/MIT.
 */
 
-import type { StrategyPlugin } from "../../types.js";
+import type { StrategyPlugin } from "#lib/types.js";
 import { createPartialResponse } from "./createPartialResponse.js";
 
 /**

package/src/lib/route.ts

@@ -0,0 +1,234 @@
+/*
+  Copyright 2018 Google LLC
+
+  Use of this source code is governed by an MIT-style
+  license that can be found in the LICENSE file or at
+  https://opensource.org/licenses/MIT.
+*/
+import { assert } from "#utils/assert.js";
+import { logger } from "#utils/logger.js";
+import { normalizeHandler } from "#utils/normalizeHandler.js";
+import type { HTTPMethod } from "./constants.js";
+import { defaultMethod, validMethods } from "./constants.js";
+import type { RouteHandler, RouteHandlerObject, RouteMatchCallback, RouteMatchCallbackOptions } from "./types.js";
+
+/**
+ * A `Route` consists of a pair of callback functions, `match` and `handler`.
+ * The `match` callback determines if a route should be used to handle a
+ * request by returning a truthy value if it can. The `handler` callback
+ * is called when the route matches and should return a promise that resolves
+ * to a response.
+ */
+export class Route {
+  handler: RouteHandlerObject;
+  match: RouteMatchCallback;
+  method: HTTPMethod;
+  catchHandler?: RouteHandlerObject;
+
+  /**
+   * Constructor for Route class.
+   *
+   * @param match A callback function that determines whether the
+   * route matches a given `fetch` event by returning a truthy value.
+   * @param handler A callback function that returns a `Promise` resolving
+   * to a `Response`.
+   * @param method The HTTP method to match the route against. Defaults
+   * to `GET`.
+   */
+  constructor(match: RouteMatchCallback, handler: RouteHandler, method: HTTPMethod = defaultMethod) {
+    if (process.env.NODE_ENV !== "production") {
+      assert!.isType(match, "function", {
+        moduleName: "serwist",
+        className: "Route",
+        funcName: "constructor",
+        paramName: "match",
+      });
+
+      if (method) {
+        assert!.isOneOf(method, validMethods, { paramName: "method" });
+      }
+    }
+
+    // These values are referenced directly by Router so cannot be
+    // altered by minificaton.
+    this.handler = normalizeHandler(handler);
+    this.match = match;
+    this.method = method;
+  }
+
+  /**
+   *
+   * @param handler A callback function that returns a Promise resolving
+   * to a Response.
+   */
+  setCatchHandler(handler: RouteHandler): void {
+    this.catchHandler = normalizeHandler(handler);
+  }
+}
+
+/**
+ * A class that makes it easy to create a {@linkcode Route} object with a regular expression.
+ *
+ * For same-origin requests the `RegExp` only needs to match part of the URL. For
+ * requests against third-party servers, you must define a `RegExp` that matches
+ * the start of the URL.
+ */
+export class RegExpRoute extends Route {
+  /**
+   * If the regular expression contains
+   * [capture groups](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp#grouping-back-references),
+   * the captured values will be passed to the `params` argument.
+   *
+   * @param regExp The regular expression to match against URLs.
+   * @param handler A callback function that returns a `Promise` resulting in a `Response`.
+   * @param method The HTTP method to match the {@linkcode Route} against. Defaults to `GET`.
+   * against.
+   */
+  constructor(regExp: RegExp, handler: RouteHandler, method?: HTTPMethod) {
+    if (process.env.NODE_ENV !== "production") {
+      assert!.isInstance(regExp, RegExp, {
+        moduleName: "serwist",
+        className: "RegExpRoute",
+        funcName: "constructor",
+        paramName: "pattern",
+      });
+    }
+
+    const match: RouteMatchCallback = ({ url }: RouteMatchCallbackOptions) => {
+      const result = regExp.exec(url.href);
+
+      // Return immediately if there's no match.
+      if (!result) {
+        return;
+      }
+
+      // Require that the match start at the first character in the URL string
+      // if it's a cross-origin request.
+      // See https://github.com/GoogleChrome/workbox/issues/281 for the context
+      // behind this behavior.
+      if (url.origin !== location.origin && result.index !== 0) {
+        if (process.env.NODE_ENV !== "production") {
+          logger.debug(
+            `The regular expression '${regExp.toString()}' only partially matched against the cross-origin URL '${url.toString()}'. RegExpRoute's will only handle cross-origin requests if they match the entire URL.`,
+          );
+        }
+
+        return;
+      }
+
+      // If the route matches, but there aren't any capture groups defined, then
+      // this will return [], which is truthy and therefore sufficient to
+      // indicate a match.
+      // If there are capture groups, then it will return their values.
+      return result.slice(1);
+    };
+
+    super(match, handler, method);
+  }
+}
+
+export interface NavigationRouteMatchOptions {
+  /**
+   * If any of these patterns
+   * match the URL's pathname and search parameter, the route will handle the
+   * request (assuming the denylist doesn't match).
+   *
+   * @default [/./]
+   */
+  allowlist?: RegExp[];
+  /**
+   * If any of these patterns match, the route will not handle the request (even if a allowlist RegExp matches).
+   */
+  denylist?: RegExp[];
+}
+
+/**
+ * A class that makes it easy to create a {@linkcode Route} object that matches navigation requests.
+ *
+ * It will only match incoming requests whose [`mode`](https://fetch.spec.whatwg.org/#concept-request-mode) is set to `"navigate"`.
+ *
+ * You can optionally only apply this route to a subset of navigation requests
+ * by using one or both of the `denylist` and `allowlist` parameters.
+ */
+export class NavigationRoute extends Route {
+  private readonly _allowlist: RegExp[];
+  private readonly _denylist: RegExp[];
+
+  /**
+   * If both `denylist` and `allowlist` are provided, `denylist` will
+   * take precedence.
+   *
+   * The regular expressions in `allowlist` and `denylist`
+   * are matched against the concatenated
+   * [`pathname`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLHyperlinkElementUtils/pathname)
+   * and [`search`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLHyperlinkElementUtils/search)
+   * portions of the requested URL.
+   *
+   * *Note*: These RegExps may be evaluated against every destination URL during
+   * a navigation. Avoid using
+   * [complex RegExps](https://github.com/GoogleChrome/workbox/issues/3077),
+   * or else your users may see delays when navigating your site.
+   *
+   * @param handler A callback function that returns a `Promise` resulting in a `Response`.
+   * @param options
+   */
+  constructor(handler: RouteHandler, { allowlist = [/./], denylist = [] }: NavigationRouteMatchOptions = {}) {
+    if (process.env.NODE_ENV !== "production") {
+      assert!.isArrayOfClass(allowlist, RegExp, {
+        moduleName: "serwist",
+        className: "NavigationRoute",
+        funcName: "constructor",
+        paramName: "options.allowlist",
+      });
+      assert!.isArrayOfClass(denylist, RegExp, {
+        moduleName: "serwist",
+        className: "NavigationRoute",
+        funcName: "constructor",
+        paramName: "options.denylist",
+      });
+    }
+
+    super((options: RouteMatchCallbackOptions) => this._match(options), handler);
+
+    this._allowlist = allowlist;
+    this._denylist = denylist;
+  }
+
+  /**
+   * Routes match handler.
+   *
+   * @param options
+   * @returns
+   * @private
+   */
+  private _match({ url, request }: RouteMatchCallbackOptions): boolean {
+    if (request && request.mode !== "navigate") {
+      return false;
+    }
+
+    const pathnameAndSearch = url.pathname + url.search;
+
+    for (const regExp of this._denylist) {
+      if (regExp.test(pathnameAndSearch)) {
+        if (process.env.NODE_ENV !== "production") {
+          logger.log(
+            `The navigation route ${pathnameAndSearch} is not being used, since the URL matches this denylist pattern: ${regExp.toString()}`,
+          );
+        }
+        return false;
+      }
+    }
+
+    if (this._allowlist.some((regExp) => regExp.test(pathnameAndSearch))) {
+      if (process.env.NODE_ENV !== "production") {
+        logger.debug(`The navigation route ${pathnameAndSearch} is being used.`);
+      }
+      return true;
+    }
+
+    if (process.env.NODE_ENV !== "production") {
+      logger.log(`The navigation route ${pathnameAndSearch} is not being used, since the URL being navigated to doesn't match the allowlist.`);
+    }
+    return false;
+  }
+}