feat: add branch support to browser extension plugin

packages/core/src/__test/options.test.ts

@@ -61,4 +61,35 @@ describe('initial options', () => {
 
     expect(tolgee.getInitialOptions().apiUrl).toEqual('http://localhost:8000');
   });
+
+  it('overrideCredentials with branch', () => {
+    const tolgee = TolgeeCore().init({
+      language: 'en',
+      apiUrl: 'http://localhost:8080',
+    });
+
+    tolgee.overrideCredentials({
+      apiUrl: 'http://localhost:8000',
+      apiKey: 'test',
+      branch: 'feature-x',
+    });
+
+    expect(tolgee.getInitialOptions().branch).toEqual('feature-x');
+  });
+
+  it('overrideCredentials branch overrides init branch', () => {
+    const tolgee = TolgeeCore().init({
+      language: 'en',
+      apiUrl: 'http://localhost:8080',
+      branch: 'original',
+    });
+
+    tolgee.overrideCredentials({
+      apiUrl: 'http://localhost:8000',
+      apiKey: 'test',
+      branch: 'override',
+    });
+
+    expect(tolgee.getInitialOptions().branch).toEqual('override');
+  });
 });

packages/core/src/types/plugin.ts

@@ -111,6 +111,7 @@ export type DevCredentials =
       apiUrl?: string;
       apiKey?: string;
       projectId?: string | number;
+      branch?: string;
     };
 export type WrapperMiddleware = {
   unwrap: WrapperUnwrapFunction;

packages/web/src/package/BrowserExtensionPlugin/BrowserExtensionPlugin.ts

@@ -4,10 +4,12 @@ import { loadInContextLib } from './loadInContextLib';
 
 export const API_KEY_LOCAL_STORAGE = '__tolgee_apiKey';
 export const API_URL_LOCAL_STORAGE = '__tolgee_apiUrl';
+export const BRANCH_LOCAL_STORAGE = '__tolgee_branch';
 
 function getCredentials() {
   const apiKey = sessionStorage.getItem(API_KEY_LOCAL_STORAGE) || undefined;
   const apiUrl = sessionStorage.getItem(API_URL_LOCAL_STORAGE) || undefined;
+  const branch = sessionStorage.getItem(BRANCH_LOCAL_STORAGE) || undefined;
 
   if (!apiKey || !apiUrl) {
     return undefined;
@@ -16,12 +18,14 @@ function getCredentials() {
   return {
     apiKey,
     apiUrl,
+    ...(branch !== undefined ? { branch } : {}),
   };
 }
 
 function clearSessionStorage() {
   sessionStorage.removeItem(API_KEY_LOCAL_STORAGE);
   sessionStorage.removeItem(API_URL_LOCAL_STORAGE);
+  sessionStorage.removeItem(BRANCH_LOCAL_STORAGE);
 }
 
 function onDocumentReady(callback: () => void) {
@@ -70,6 +74,7 @@ if (sessionStorageAvailable()) {
         config: {
           apiUrl: tolgee.getInitialOptions().apiUrl || '',
           apiKey: tolgee.getInitialOptions().apiKey || '',
+          branch: tolgee.getInitialOptions().branch,
         },
       }) as const;
 

packages/web/src/package/__test__/browser.extension.test.ts

@@ -1,6 +1,7 @@
 const handshakerUpdate = jest.fn(() => Promise.resolve());
 const Handshaker = jest.fn(() => ({ update: handshakerUpdate }));
-const loadInContextLib = jest.fn(() => Promise.resolve(() => {}));
+const inContextToolsFactory = jest.fn(() => (tolgee: any) => tolgee);
+const loadInContextLib = jest.fn(() => Promise.resolve(inContextToolsFactory));
 
 jest.mock('../tools/extension', () => ({
   Handshaker,
@@ -21,13 +22,15 @@ import { BrowserExtensionPlugin } from '../typedIndex';
 import {
   API_KEY_LOCAL_STORAGE,
   API_URL_LOCAL_STORAGE,
+  BRANCH_LOCAL_STORAGE,
 } from '../BrowserExtensionPlugin/BrowserExtensionPlugin';
 import { readFile } from 'fs/promises';
 import { join } from 'path';
 
 describe('compatibility with browser extension', () => {
   afterEach(() => {
     sessionStorage.clear();
+    jest.clearAllMocks();
   });
 
   it('sends correct data to extension', async () => {
@@ -39,13 +42,32 @@ describe('compatibility with browser extension', () => {
       config: {
         apiKey: '',
         apiUrl: 'test',
+        branch: undefined,
       },
       mode: 'production',
       uiPresent: true,
       uiVersion: undefined,
     });
   });
 
+  it('sends branch from SDK config to extension', async () => {
+    const tolgee = TolgeeCore().init({
+      language: 'en',
+      apiUrl: 'test',
+      branch: 'my-branch',
+    });
+    tolgee.addPlugin(BrowserExtensionPlugin());
+    await tolgee.run();
+    expect(handshakerUpdate).toBeCalledTimes(1);
+    expect(handshakerUpdate).toBeCalledWith(
+      expect.objectContaining({
+        config: expect.objectContaining({
+          branch: 'my-branch',
+        }),
+      })
+    );
+  });
+
   it('loads in-context lib if session storage is set', async () => {
     sessionStorage.setItem(API_KEY_LOCAL_STORAGE, 'test');
     sessionStorage.setItem(API_URL_LOCAL_STORAGE, 'test');
@@ -57,6 +79,27 @@ describe('compatibility with browser extension', () => {
     expect(loadInContextLib).toBeCalledTimes(1);
   });
 
+  it('picks up branch from sessionStorage', async () => {
+    sessionStorage.setItem(API_KEY_LOCAL_STORAGE, 'test');
+    sessionStorage.setItem(API_URL_LOCAL_STORAGE, 'test');
+    sessionStorage.setItem(BRANCH_LOCAL_STORAGE, 'my-branch');
+
+    const tolgee = TolgeeCore().init({ language: 'en' });
+    tolgee.addPlugin(BrowserExtensionPlugin());
+    await tolgee.run();
+
+    expect(loadInContextLib).toBeCalledTimes(1);
+    expect(inContextToolsFactory).toBeCalledWith(
+      expect.objectContaining({
+        credentials: {
+          apiKey: 'test',
+          apiUrl: 'test',
+          branch: 'my-branch',
+        },
+      })
+    );
+  });
+
   it('builded module is valid', async () => {
     // this test works only after build
     const fileContent = await readFile(

packages/web/src/package/tools/extension.ts

@@ -102,6 +102,7 @@ export type LibConfig = {
   config: {
     apiUrl: string;
     apiKey: string;
+    branch?: string;
   };
 };