Add Web Push Support (#11346)

* WIP: PoC with lots of terrible code with web push

* fix service worker building

* Work on WebPush Tailored to Browser

* Clean Up Web And MV2

* Fix Merge Conflicts

* Prettier

* Use Unsupported for MV2

* Add Doc Comments

* Remove Permission Button

* Fix Type Test

* Write Time In More Readable Format

* Add SignalR Logger

* `sheduleReconnect` -> `scheduleReconnect`

Co-authored-by: Matt Gibson <mgibson@bitwarden.com>

* Capture Support Context In Connector

* Remove Unneeded CSP Change

* Fix Build

* Simplify `getOrCreateSubscription`

* Add More Docs to Matrix

* Update libs/common/src/platform/notifications/internal/worker-webpush-connection.service.ts

Co-authored-by: Matt Gibson <mgibson@bitwarden.com>

* Move API Service Into Notifications Folder

* Allow Connection When Account Is Locked

* Add Comments to NotificationsService

* Only Change Support Status If Public Key Changes

* Move Service Choice Out To Method

* Use Named Constant For Disabled Notification Url

* Add Test & Cleanup

* Flatten

* Move Tests into `beforeEach` & `afterEach`

* Add Tests

* Test `distinctUntilChanged`'s Operators More

* Make Helper And Cleanup Chain

* Add Back Cast

* Add extra safety to incoming config check

* Put data through response object

* Apply TS Strict Rules

* Finish PushTechnology comment

* Use `instanceof` check

* Do Safer Worker Based Registration for MV3

* Remove TODO

* Switch to SignalR on any WebPush Error

* Fix Manifest Permissions

* Add Back `webNavigation`

* Sorry, Remove `webNavigation`

* Fixed merge conflicts.

---------

Co-authored-by: Matt Gibson <mgibson@bitwarden.com>
Co-authored-by: Todd Martin <tmartin@bitwarden.com>
Co-authored-by: Todd Martin <106564991+trmartin4@users.noreply.github.com>

libs/common/spec/matrix.spec.ts

@@ -0,0 +1,76 @@
+import { Matrix } from "./matrix";
+
+class TestObject {
+  value: number = 0;
+
+  constructor() {}
+
+  increment() {
+    this.value++;
+  }
+}
+
+describe("matrix", () => {
+  it("caches entries in a matrix properly with a single argument", () => {
+    const mockFunction = jest.fn<TestObject, [arg1: string]>();
+    const getter = Matrix.autoMockMethod(mockFunction, () => new TestObject());
+
+    const obj = getter("test1");
+    expect(obj.value).toBe(0);
+
+    // Change the state of the object
+    obj.increment();
+
+    // Should return the same instance the second time this is called
+    expect(getter("test1").value).toBe(1);
+
+    // Using the getter should not call the mock function
+    expect(mockFunction).not.toHaveBeenCalled();
+
+    const mockedFunctionReturn1 = mockFunction("test1");
+    expect(mockedFunctionReturn1.value).toBe(1);
+
+    // Totally new value
+    const mockedFunctionReturn2 = mockFunction("test2");
+    expect(mockedFunctionReturn2.value).toBe(0);
+
+    expect(mockFunction).toHaveBeenCalledTimes(2);
+  });
+
+  it("caches entries in matrix properly with multiple arguments", () => {
+    const mockFunction = jest.fn<TestObject, [arg1: string, arg2: number]>();
+
+    const getter = Matrix.autoMockMethod(mockFunction, () => {
+      return new TestObject();
+    });
+
+    const obj = getter("test1", 4);
+    expect(obj.value).toBe(0);
+
+    obj.increment();
+
+    expect(getter("test1", 4).value).toBe(1);
+
+    expect(mockFunction("test1", 3).value).toBe(0);
+  });
+
+  it("should give original args in creator even if it has multiple key layers", () => {
+    const mockFunction = jest.fn<TestObject, [arg1: string, arg2: number, arg3: boolean]>();
+
+    let invoked = false;
+
+    const getter = Matrix.autoMockMethod(mockFunction, (args) => {
+      expect(args).toHaveLength(3);
+      expect(args[0]).toBe("test");
+      expect(args[1]).toBe(42);
+      expect(args[2]).toBe(true);
+
+      invoked = true;
+
+      return new TestObject();
+    });
+
+    getter("test", 42, true);
+    expect(invoked).toBe(true);
+  });
+});

libs/common/spec/matrix.ts

@@ -0,0 +1,115 @@
+type PickFirst<Array> = Array extends [infer First, ...unknown[]] ? First : never;
+
+type MatrixOrValue<Array extends unknown[], Value> = Array extends []
+  ? Value
+  : Matrix<Array, Value>;
+
+type RemoveFirst<T> = T extends [unknown, ...infer Rest] ? Rest : never;
+
+/**
+ * A matrix is intended to manage cached values for a set of method arguments.
+ */
+export class Matrix<TKeys extends unknown[], TValue> {
+  private map: Map<PickFirst<TKeys>, MatrixOrValue<RemoveFirst<TKeys>, TValue>> = new Map();
+
+  /**
+   * This is especially useful for methods on a service that take inputs but return Observables.
+   * Generally when interacting with observables in tests, you want to use a simple SubjectLike
+   * type to back it instead, so that you can easily `next` values to simulate an emission.
+   *
+   * @param mockFunction The function to have a Matrix based implementation added to it.
+   * @param creator The function to use to create the underlying value to return for the given arguments.
+   * @returns A "getter" function that allows you to retrieve the backing value that is used for the given arguments.
+   *
+   * @example
+   * ```ts
+   * interface MyService {
+   *   event$(userId: UserId) => Observable<UserEvent>
+   * }
+   *
+   * // Test
+   * const myService = mock<MyService>();
+   * const eventGetter = Matrix.autoMockMethod(myService.event$, (userId) => BehaviorSubject<UserEvent>());
+   *
+   * eventGetter("userOne").next(new UserEvent());
+   * eventGetter("userTwo").next(new UserEvent());
+   * ```
+   *
+   * This replaces a more manual way of doing things like:
+   *
+   * ```ts
+   * const myService = mock<MyService>();
+   * const userOneSubject = new BehaviorSubject<UserEvent>();
+   * const userTwoSubject = new BehaviorSubject<UserEvent>();
+   * myService.event$.mockImplementation((userId) => {
+   *    if (userId === "userOne") {
+   *      return userOneSubject;
+   *    } else if (userId === "userTwo") {
+   *      return userTwoSubject;
+   *    }
+   *    return new BehaviorSubject<UserEvent>();
+   * });
+   *
+   * userOneSubject.next(new UserEvent());
+   * userTwoSubject.next(new UserEvent());
+   * ```
+   */
+  static autoMockMethod<TReturn, TArgs extends unknown[], TActualReturn extends TReturn>(
+    mockFunction: jest.Mock<TReturn, TArgs>,
+    creator: (args: TArgs) => TActualReturn,
+  ): (...args: TArgs) => TActualReturn {
+    const matrix = new Matrix<TArgs, TActualReturn>();
+
+    const getter = (...args: TArgs) => {
+      return matrix.getOrCreateEntry(args, creator);
+    };
+
+    mockFunction.mockImplementation(getter);
+
+    return getter;
+  }
+
+  /**
+   * Gives the ability to get or create an entry in the matrix via the given args.
+   *
+   * @note The args are evaulated using Javascript equality so primivites work best.
+   *
+   * @param args The arguments to use to evaluate if an entry in the matrix exists already,
+   *   or a value should be created and stored with those arguments.
+   * @param creator The function to call with the arguments to build a value.
+   * @returns The existing entry if one already exists or a new value created with the creator param.
+   */
+  getOrCreateEntry(args: TKeys, creator: (args: TKeys) => TValue): TValue {
+    if (args.length === 0) {
+      throw new Error("Matrix is not for you.");
+    }
+
+    if (args.length === 1) {
+      const arg = args[0] as PickFirst<TKeys>;
+      if (this.map.has(arg)) {
+        // Get the cached value
+        return this.map.get(arg) as TValue;
+      } else {
+        const value = creator(args);
+        // Save the value for the next time
+        this.map.set(arg, value as MatrixOrValue<RemoveFirst<TKeys>, TValue>);
+        return value;
+      }
+    }
+
+    // There are for sure 2 or more args
+    const [first, ...rest] = args as unknown as [PickFirst<TKeys>, ...RemoveFirst<TKeys>];
+
+    let matrix: Matrix<RemoveFirst<TKeys>, TValue> | null = null;
+
+    if (this.map.has(first)) {
+      // We've already created a map for this argument
+      matrix = this.map.get(first) as Matrix<RemoveFirst<TKeys>, TValue>;
+    } else {
+      matrix = new Matrix<RemoveFirst<TKeys>, TValue>();
+      this.map.set(first, matrix as MatrixOrValue<RemoveFirst<TKeys>, TValue>);
+    }
+
+    return matrix.getOrCreateEntry(rest, () => creator(args));
+  }
+}