move i18n to fixtures

tests/e2e/basic.spec.ts

@@ -1,6 +1,5 @@
 import { test, expect } from './fixtures/base';
 import { fillPopup } from './pages/popup';
-import { i18n } from './helpers';
 
 test.beforeEach(async ({ popup }) => {
   await popup.reload();
@@ -68,7 +67,7 @@ test.describe('should fail to connect if:', () => {
     ).toEqual({ connected: false });
   });
 
-  test('public key not added', async ({ popup }) => {
+  test('public key not added', async ({ popup, i18n }) => {
     const { CONNECT_WALLET_ADDRESS_URL } = process.env;
     expect(CONNECT_WALLET_ADDRESS_URL).toBeDefined();
 

tests/e2e/connect.spec.ts

@@ -1,7 +1,6 @@
 /// <reference types="chrome"/>
 import { test, expect } from './fixtures/base';
 import { connectWallet, disconnectWallet } from './pages/popup';
-import { i18n } from './helpers';
 
 test.beforeEach(async ({ popup }) => {
   await popup.reload();
@@ -11,6 +10,7 @@ test('connects with correct details provided', async ({
   persistentContext,
   background,
   popup,
+  i18n,
 }) => {
   const {
     CONNECT_KEY_ID,

tests/e2e/fixtures/base.ts

@@ -3,13 +3,15 @@ import {
   getBackground,
   getExtensionId,
   loadContext,
+  BrowserIntl,
   type Background,
 } from './helpers';
 import { openPopup, type Popup } from '../pages/popup';
 
 type BaseScopeWorker = {
   persistentContext: BrowserContext;
   background: Background;
+  i18n: BrowserIntl;
   /**
    * IMPORTANT: This is created once per test file. Mutating/closing could
    * impact other tests in same file.
@@ -40,6 +42,14 @@ export const test = base.extend<{ page: Page }, BaseScopeWorker>({
     { scope: 'worker' },
   ],
 
+  i18n: [
+    async ({ browserName }, use) => {
+      const i18n = new BrowserIntl(browserName);
+      await use(i18n);
+    },
+    { scope: 'worker' },
+  ],
+
   popup: [
     async ({ background, persistentContext, browserName, channel }, use) => {
       const extensionId = getExtensionId(browserName, background);

tests/e2e/fixtures/helpers.ts

@@ -3,6 +3,7 @@
 import { Buffer } from 'node:buffer';
 import net from 'node:net';
 import path from 'node:path';
+import { readFileSync } from 'node:fs';
 import { readFile } from 'node:fs/promises';
 import {
   chromium,
@@ -12,6 +13,7 @@ import {
   type Worker,
 } from '@playwright/test';
 import { DIST_DIR, ROOT_DIR } from '../../../esbuild/config';
+import type { TranslationKeys } from '../../../src/shared/helpers';
 
 export type BrowserInfo = { browserName: string; channel: string | undefined };
 export type Background = Worker;
@@ -264,3 +266,60 @@ export async function loadKeysToExtension(
     throw new Error('Could not load keys to extension');
   }
 }
+
+type TranslationData = Record<
+  TranslationKeys,
+  { message: string; placeholders?: Record<string, { content: string }> }
+>;
+
+/**
+ * Replacement of browser.i18n.getMessage related APIs
+ */
+export class BrowserIntl {
+  private cache = new Map<string, TranslationData>();
+  private lang = 'en';
+  private pathToExtension: string;
+
+  constructor(browserName: string) {
+    this.pathToExtension = getPathToExtension(browserName);
+  }
+
+  private get(lang: string) {
+    const cached = this.cache.get(lang);
+    if (cached) return cached;
+
+    const filePath = path.join(
+      this.pathToExtension,
+      '_locales',
+      lang,
+      'messages.json',
+    );
+    const data = JSON.parse(readFileSync(filePath, 'utf8')) as TranslationData;
+    this.cache.set(lang, data);
+    return data;
+  }
+
+  getMessage(key: TranslationKeys, substitutions?: string | string[]) {
+    const msg = this.get(this.lang)[key] || this.get('en')[key];
+    if (typeof msg === 'undefined') {
+      throw new Error(`Message not found: ${key}`);
+    }
+
+    let result = msg.message;
+    if (!msg.placeholders) return result;
+
+    if (!substitutions) {
+      throw new Error('Missing substitutions');
+    }
+
+    if (typeof substitutions === 'string') {
+      substitutions = [substitutions];
+    }
+
+    for (const [key, { content }] of Object.entries(msg.placeholders)) {
+      const idx = Number(content.replace('$', ''));
+      result = result.replaceAll(`$${key.toUpperCase()}$`, substitutions[idx]);
+    }
+    return result;
+  }
+}