fix tests

Author: SuaYoo

frontend/src/index.test.ts

@@ -2,6 +2,7 @@ import { expect, fixture } from "@open-wc/testing";
 import { html } from "lit";
 import { restore, stub } from "sinon";
 
+import { APIController } from "./controllers/api";
 import { NavigateController } from "./controllers/navigate";
 import { NotifyController } from "./controllers/notify";
 import { type AppSettings } from "./utils/app";
@@ -46,6 +47,7 @@ const mockAppSettings: AppSettings = {
   salesEmail: "",
   supportEmail: "",
   localesEnabled: ["en", "es"],
+  numBrowsersPerInstance: 1,
 };
 
 describe("browsertrix-app", () => {
@@ -55,6 +57,7 @@ describe("browsertrix-app", () => {
     window.localStorage.clear();
     stub(window.history, "pushState");
     stub(NotifyController.prototype, "toast");
+    stub(APIController.prototype, "fetch");
   });
 
   afterEach(() => {
@@ -84,15 +87,12 @@ describe("browsertrix-app", () => {
 
   it("renders 404 when not in org", async () => {
     stub(AuthService.prototype, "initSessionStorage").returns(
-      Promise.resolve({
-        headers: { Authorization: "_fake_headers_" },
-        tokenExpiresAt: 0,
-        username: "[email protected]",
-      }),
+      Promise.resolve(mockAuth),
     );
     // @ts-expect-error checkFreshness is private
     stub(AuthService.prototype, "checkFreshness");
 
+    AppStateService.updateAuth(mockAuth);
     AppStateService.updateUser(
       formatAPIUser({
         ...mockAPIUser,
@@ -116,15 +116,12 @@ describe("browsertrix-app", () => {
     };
 
     stub(AuthService.prototype, "initSessionStorage").returns(
-      Promise.resolve({
-        headers: { Authorization: "_fake_headers_" },
-        tokenExpiresAt: 0,
-        username: "[email protected]",
-      }),
+      Promise.resolve(mockAuth),
     );
     // @ts-expect-error checkFreshness is private
     stub(AuthService.prototype, "checkFreshness");
 
+    AppStateService.updateAuth(mockAuth);
     AppStateService.updateUser(
       formatAPIUser({
         ...mockAPIUser,
@@ -158,27 +155,6 @@ describe("browsertrix-app", () => {
     expect(el.shadowRoot?.querySelector("btrix-log-in")).to.exist;
   });
 
-  // TODO move tests to AuthService
-  it("sets auth state from session storage", async () => {
-    stub(AuthService.prototype, "startFreshnessCheck").callsFake(() => {});
-    stub(window.sessionStorage, "getItem").callsFake((key) => {
-      if (key === "btrix.auth")
-        return JSON.stringify({
-          headers: { Authorization: "_fake_headers_" },
-          tokenExpiresAt: 0,
-          username: "[email protected]",
-        });
-      return null;
-    });
-    const el = await fixture<App>("<browsertrix-app></browsertrix-app>");
-
-    expect(el.authService.authState).to.eql({
-      headers: { Authorization: "_fake_headers_" },
-      tokenExpiresAt: 0,
-      username: "[email protected]",
-    });
-  });
-
   it("sets user info", async () => {
     stub(App.prototype, "getUserInfo").callsFake(async () =>
       Promise.resolve(mockAPIUser),
@@ -227,6 +203,7 @@ describe("browsertrix-app", () => {
       slug: id,
       role: 10,
     };
+    AppStateService.updateAuth(mockAuth);
     AppStateService.updateUser(
       formatAPIUser({
         ...mockAPIUser,
@@ -236,11 +213,7 @@ describe("browsertrix-app", () => {
     stub(App.prototype, "getLocationPathname").callsFake(() => `/orgs/${id}`);
     stub(AuthService.prototype, "startFreshnessCheck").callsFake(() => {});
     stub(AuthService.prototype, "initSessionStorage").callsFake(async () =>
-      Promise.resolve({
-        headers: { Authorization: "_fake_headers_" },
-        tokenExpiresAt: 0,
-        username: "[email protected]",
-      }),
+      Promise.resolve(mockAuth),
     );
 
     const el = await fixture<App>("<browsertrix-app></browsertrix-app>");

frontend/src/index.ts

@@ -141,6 +141,7 @@ export class App extends BtrixElement {
     } catch (e) {
       console.debug(e);
     }
+
     this.syncViewState();
 
     if (authState && !this.userInfo) {

frontend/src/utils/AuthService.test.ts

@@ -4,12 +4,16 @@ import { restore, stub } from "sinon";
 import AuthService from "./AuthService";
 import { AppStateService } from "./state";
 
+import { APIController } from "@/controllers/api";
+
 describe("AuthService", () => {
   beforeEach(() => {
     AppStateService.resetAll();
     window.sessionStorage.clear();
     window.sessionStorage.clear();
     stub(window.history, "pushState");
+    stub(APIController.prototype, "fetch");
+    stub(AuthService.prototype, "refresh");
   });
 
   afterEach(() => {
@@ -59,6 +63,27 @@ describe("AuthService", () => {
       });
       otherTabChannel.close();
     });
+    it("saves auth in session storage", async () => {
+      stub(window.sessionStorage, "getItem");
+      const otherTabChannel = new BroadcastChannel(AuthService.storageKey);
+      otherTabChannel.addEventListener("message", () => {
+        otherTabChannel.postMessage({
+          name: "responding_auth",
+          auth: {
+            headers: { Authorization: "_fake_headers_from_tab_to_save_" },
+            tokenExpiresAt: 9999,
+            username: "[email protected]_from_tab_to_save_",
+          },
+        });
+      });
+      await authService.initSessionStorage();
+      expect(authService.authState).to.deep.equal({
+        headers: { Authorization: "_fake_headers_from_tab_to_save_" },
+        tokenExpiresAt: 9999,
+        username: "[email protected]_from_tab_to_save_",
+      });
+      otherTabChannel.close();
+    });
     it("resolves without stored auth or another tab", async () => {
       stub(window.sessionStorage, "getItem");
       const result = await authService.initSessionStorage();

frontend/src/utils/AuthService.ts

@@ -179,15 +179,16 @@ export default class AuthService {
    * and set up session syncing
    */
   async initSessionStorage(): Promise<AuthState> {
-    const authState =
-      AuthService.getCurrentTabAuth() || (await this.getSharedSessionAuth());
+    let authState = AuthService.getCurrentTabAuth();
 
-    if (authState) {
-      if (!this.authState) {
+    if (!authState) {
+      authState = await this.getSharedSessionAuth();
+
+      if (authState) {
         this.saveLogin(authState);
+      } else {
+        AppStateService.updateAuth(null);
       }
-    } else {
-      AppStateService.updateAuth(null);
     }
 
     return authState;