chore: remove @ikscodes/browser-env (#842)

* chore: remove @ikscodes/browser-env

* chore: replace browserEnv fn with jest.spyOn

* chore: add typescript-eslint rules for test files

* chore: remove all browser-env package usage

* fix: provider tests

* fix: fix types in tests

* fix: kadena tests

* fix: deepsource 'any'

* fix: deepsourse

* fix: deepsourse

* fix: signTransaction type

* feat: add test to react native

* fix: deepsource

* fix tests

* remove console

---------

Co-authored-by: sherzod-bakhodirov <[email protected]>
Co-authored-by: ethella <[email protected]>

Author: 3 people

eslint.config.mjs

@@ -15,7 +15,8 @@ export default [
       '**/dist',
       '**/jest.config.ts',
       'scripts/bin/scaffold/template/**/*',
-      '.prettierrc.js',
+      '**/.prettierrc.js',
+      '**/README.md',
     ],
   },
   {
@@ -41,6 +42,7 @@ export default [
     files: ['**/*.ts', '**/*.tsx'],
 
     rules: {
+      'no-undef': 0,
       'no-alert': 'off',
       'no-dupe-class-members': 'off',
       'no-underscore-dangle': 'off',
@@ -72,4 +74,13 @@ export default [
       },
     },
   },
+  {
+    files: ['**/*.spec.*'],
+
+    rules: {
+      '@typescript-eslint/no-explicit-any': 'off',
+      '@typescript-eslint/naming-convention': 'off',
+      '@typescript-eslint/use-unknown-in-catch-callback-variable': 'off',
+    },
+  },
 ];

jest.config.ts

@@ -7,6 +7,7 @@ const config: Config.InitialOptions = {
   collectCoverageFrom: ['./src/**/*.{ts,tsx,}'],
   collectCoverage: true,
   testTimeout: 30000, // 30s
+  testEnvironment: 'jsdom',
   coverageThreshold: {
     global: {
       lines: 99,

package.json

@@ -19,7 +19,6 @@
     "@eslint/compat": "^1.2.2",
     "@eslint/eslintrc": "^3.1.0",
     "@eslint/js": "^9.14.0",
-    "@ikscodes/browser-env": "~0.3.1",
     "@istanbuljs/nyc-config-typescript": "~0.1.3",
     "@peculiar/webcrypto": "^1.5.0",
     "@types/fs-extra": "^9.0.13",
@@ -33,22 +32,22 @@
     "@types/rimraf": "^3.0.2",
     "@types/tsc-watch": "^4.2.0",
     "@types/whatwg-url": "^6.4.0",
-    "@typescript-eslint/eslint-plugin": "^7.18.0",
-    "@typescript-eslint/parser": "7.12.0",
+    "@typescript-eslint/eslint-plugin": "^8.29.1",
+    "@typescript-eslint/parser": "^8.29.1",
     "auto": "^11.1.2",
     "babel-jest": "^29.7.0",
     "brotli-size": "^4.0.0",
     "chalk": "~4.1.2",
     "enquirer": "^2.3.6",
     "esbuild": "^0.14.13",
-    "eslint": "9.14.0",
-    "eslint-config-prettier": "^9.1.0",
-    "eslint-import-resolver-typescript": "^3.6.3",
+    "eslint": "^9.24.0",
+    "eslint-config-prettier": "^10.1.1",
+    "eslint-import-resolver-typescript": "^4.3.2",
     "eslint-plugin-import": "^2.31.0",
     "eslint-plugin-jsx-a11y": "^6.10.2",
-    "eslint-plugin-prettier": "^5.2.1",
-    "eslint-plugin-react": "^7.37.2",
-    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-prettier": "^5.2.6",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react-hooks": "^5.2.0",
     "execa": "~5.1.1",
     "fs-extra": "^10.0.0",
     "globals": "^15.12.0",
@@ -57,6 +56,7 @@
     "inquirer": "^8.1.2",
     "is-ci": "^3.0.0",
     "jest": "^29.7.0",
+    "jest-environment-jsdom": "^29.7.0",
     "lerna": "8.0.2",
     "lint-staged": "^10.0.7",
     "lodash": "^4.17.21",
@@ -88,8 +88,7 @@
     ]
   },
   "resolutions": {
-    "@rollup/plugin-commonjs": "^17.0.0",
-    "eslint": "9.14.0"
+    "@rollup/plugin-commonjs": "^17.0.0"
   },
   "repository": "magiclabs/magic-js",
   "author": "Magic Labs <[email protected]>",

packages/@magic-ext/aptos/test/setup.ts

@@ -1,9 +1,6 @@
 // NOTE: This module is automatically included at the top of each test file.
-import browserEnv from '@ikscodes/browser-env';
 import { mockConsole } from '../../../../scripts/utils/mock-console';
 
-browserEnv();
-
 beforeEach(() => {
   mockConsole();
 });

packages/@magic-ext/aptos/test/spec/aptos-extension.spec.ts

@@ -1,8 +1,8 @@
-import browserEnv from '@ikscodes/browser-env';
 import { BCS, TxnBuilderTypes } from 'aptos';
 import { createMagicSDKWithExtension } from '../../../../@magic-sdk/provider/test/factories';
 import { AptosExtension } from '../../src';
 import { AptosPayloadMethod } from '../../src/type';
+import { TextEncoder, TextDecoder } from 'util';
 
 const APTOS_NODE_URL = 'https://fullnode.testnet.aptoslabs.com';
 
@@ -31,8 +31,12 @@ const MESSAGE_PAYLOAD = {
   nonce: 'random-nonce',
 };
 
+beforeAll(() => {
+  Object.assign(global, { TextEncoder, TextDecoder });
+})
+
 beforeEach(() => {
-  browserEnv.restore();
+  jest.resetAllMocks();
 });
 
 test('Construct GetAccount request with `aptos_getAccount`', async () => {

packages/@magic-ext/aptos/test/spec/magic-aptos-wallet.spec.ts

@@ -1,4 +1,3 @@
-import browserEnv from '@ikscodes/browser-env';
 import { BCS, TxnBuilderTypes } from 'aptos';
 import { createMagicSDKWithExtension } from '../../../../@magic-sdk/provider/test/factories';
 import { AptosExtension, MagicAptosWallet } from '../../src';
@@ -33,7 +32,7 @@ const MOCK_ACCOUTN_INFO = {
 };
 
 beforeEach(() => {
-  browserEnv.restore();
+  jest.resetAllMocks();
 });
 
 test('Call connect()', async () => {

packages/@magic-ext/aptos/test/tsconfig.json

@@ -1,3 +1,3 @@
 {
-  "extends": "../../../../tsconfig.settings.test.json",
+  "extends": "../../../../tsconfig.settings.test.json"
 }

packages/@magic-ext/gdkms/test/setup.ts

@@ -1,9 +1,7 @@
 // NOTE: This module is automatically included at the top of each test file.
-import browserEnv from '@ikscodes/browser-env';
 import { Crypto } from '@peculiar/webcrypto';
 import { mockConsole } from '../../../../scripts/utils/mock-console';
 
-browserEnv();
 (window as any).crypto = new Crypto();
 
 beforeEach(() => {

packages/@magic-ext/gdkms/test/spec/gdkms.spec.ts

@@ -1,10 +1,9 @@
-import browserEnv from '@ikscodes/browser-env';
 import { MagicPayloadMethod } from '@magic-sdk/types';
 import { createMagicSDKWithExtension } from '../../../../@magic-sdk/provider/test/factories';
 import { GDKMSExtension } from '../../src';
 
 beforeEach(() => {
-  browserEnv.restore();
+  jest.resetAllMocks();
 });
 
 test('Construct Encrypt Request with `magic_auth_encrypt_v1`', async () => {

packages/@magic-ext/harmony/test/setup.ts

@@ -1,9 +1,6 @@
 // NOTE: This module is automatically included at the top of each test file.
-import browserEnv from '@ikscodes/browser-env';
 import { mockConsole } from '../../../../scripts/utils/mock-console';
 
-browserEnv();
-
 beforeEach(() => {
   mockConsole();
 });

packages/@magic-ext/harmony/test/spec/harmony.spec.ts

@@ -1,10 +1,9 @@
-import browserEnv from '@ikscodes/browser-env';
 import { HarmonyPayloadMethod } from '../../src/types';
 import { createMagicSDKWithExtension } from '../../../../@magic-sdk/provider/test/factories';
 import { HarmonyExtension } from '../../src';
 
 beforeEach(() => {
-  browserEnv.restore();
+  jest.resetAllMocks();
 });
 
 test('Sends params as payload', async () => {

packages/@magic-ext/kadena/src/index.ts

@@ -29,7 +29,7 @@ export class KadenaExtension extends Extension.Internal<'kadena'> {
   }
 
   public signTransaction(hash: string): Promise<SignatureWithPublicKey> {
-    return this.request(this.utils.createJsonRpcRequestPayload(KadenaPayloadMethod.KadenaSignTransaction, [{ hash }]));
+    return this.request<SignatureWithPublicKey>(this.utils.createJsonRpcRequestPayload(KadenaPayloadMethod.KadenaSignTransaction, [{ hash }]));
   }
 
   public async signTransactionWithSpireKey(

packages/@magic-ext/kadena/test/setup.ts

@@ -1,9 +1,6 @@
 // NOTE: This module is automatically included at the top of each test file.
-import browserEnv from '@ikscodes/browser-env';
 import { mockConsole } from '../../../../scripts/utils/mock-console';
 
-browserEnv();
-
 beforeEach(() => {
   mockConsole();
 });

packages/@magic-ext/kadena/test/spec/kadena.spec.ts

@@ -1,10 +1,9 @@
-import browserEnv from '@ikscodes/browser-env';
 import { KadenaPayloadMethod } from '../../src/types';
 import { createMagicSDKWithExtension } from '../../../../@magic-sdk/provider/test/factories';
 import { KadenaExtension } from '../../src';
 
 beforeEach(() => {
-  browserEnv.restore();
+  jest.resetAllMocks();
 });
 
 test('signTransaction - Sends params as payload', () => {
@@ -13,7 +12,6 @@ test('signTransaction - Sends params as payload', () => {
       rpcUrl: '',
       chainId: '1',
       networkId: 'testnet04',
-      network: 'testnet',
       createAccountsOnChain: true,
     }),
   ]);
@@ -34,7 +32,6 @@ test('signTransactionWithSpireKey - Sends params as payload', () => {
       rpcUrl: '',
       chainId: '1',
       networkId: 'testnet04',
-      network: 'testnet',
       createAccountsOnChain: true,
     }),
   ]);
@@ -59,7 +56,6 @@ test('Generate JSON RPC request payload with method `kda_loginWithSpireKey`', ()
       rpcUrl: '',
       chainId: '1',
       networkId: 'testnet04',
-      network: 'testnet',
       createAccountsOnChain: true,
     }),
   ]);
@@ -77,7 +73,6 @@ test('Generate JSON RPC request payload with method `kda_getUserInfo`', () => {
       rpcUrl: '',
       chainId: '1',
       networkId: 'testnet04',
-      network: 'testnet',
       createAccountsOnChain: true,
     }),
   ]);

packages/@magic-ext/sui/test/setup.ts

@@ -1,9 +1,6 @@
 // NOTE: This module is automatically included at the top of each test file.
-import browserEnv from '@ikscodes/browser-env';
 import { mockConsole } from '../../../../scripts/utils/mock-console';
 
-browserEnv();
-
 beforeEach(() => {
   mockConsole();
 });

packages/@magic-ext/sui/test/spec/sui.spec.ts

@@ -1,10 +1,9 @@
-import browserEnv from '@ikscodes/browser-env';
 import { SuiExtension } from '../../src/index';
 import { SuiPayloadMethod } from '../../src/types';
 import { createMagicSDKWithExtension } from '../../../../@magic-sdk/provider/test/factories';
 
 beforeEach(() => {
-  browserEnv.restore();
+  jest.resetAllMocks();
 });
 
 test('Sends params as payload', async () => {

packages/@magic-ext/web3modal-ethers5/src/index.ts

@@ -43,7 +43,7 @@ export class Web3ModalExtension extends Extension.Internal<'web3modal'> {
     this.sdk.thirdPartyWallets.isConnected = Boolean(localStorage.getItem(LocalStorageKeys.ADDRESS));
     this.sdk.thirdPartyWallets.eventListeners.push({
       event: ThirdPartyWalletEvents.Web3ModalSelected,
-      callback: async (payloadId) => {
+      callback: async payloadId => {
         await this.connectToWeb3modal(payloadId);
       },
     });
@@ -105,7 +105,7 @@ export class Web3ModalExtension extends Extension.Internal<'web3modal'> {
       });
 
       // Listen for modal close before user connects wallet
-      const unsubscribeFromModalEvents = modal.subscribeEvents((event) => {
+      const unsubscribeFromModalEvents = modal.subscribeEvents(event => {
         if (event.data.event === 'MODAL_CLOSE') {
           unsubscribeFromModalEvents();
           unsubscribeFromProviderEvents();

packages/@magic-ext/web3modal-ethers5/test/setup.ts

@@ -1,4 +1 @@
 // NOTE: This module is automatically included at the top of each test file.
-import browserEnv from '@ikscodes/browser-env';
-
-browserEnv();

packages/@magic-ext/web3modal-ethers5/test/spec/accountsChanged.spec.ts

@@ -1,23 +1,22 @@
-import browserEnv from '@ikscodes/browser-env';
 import { Web3ModalExtension } from '../../src/index';
 import { createMagicSDKWithExtension } from '../../../../@magic-sdk/provider/test/factories';
 import { mockLocalStorage } from '../../../../@magic-sdk/provider/test/mocks';
 
 jest.mock('@web3modal/ethers5', () => ({
   Web3Modal: jest.fn(),
   defaultConfig: jest.fn(),
-  createWeb3Modal: jest.fn(() => {
+  createWeb3Modal: () => {
     return {
       getIsConnected: jest.fn(),
       getAddress: jest.fn(() => '0x123'),
       getChainId: jest.fn(() => 1),
       subscribeProvider: jest.fn(),
     };
-  }),
+  },
 }));
 
 beforeEach(() => {
-  browserEnv.restore();
+  jest.resetAllMocks();
   mockLocalStorage();
 });
 

packages/@magic-ext/web3modal-ethers5/test/spec/chainChanged.spec.ts

@@ -1,23 +1,22 @@
-import browserEnv from '@ikscodes/browser-env';
 import { Web3ModalExtension } from '../../src/index';
 import { createMagicSDKWithExtension } from '../../../../@magic-sdk/provider/test/factories';
 import { mockLocalStorage } from '../../../../@magic-sdk/provider/test/mocks';
 
 jest.mock('@web3modal/ethers5', () => ({
   Web3Modal: jest.fn(),
   defaultConfig: jest.fn(),
-  createWeb3Modal: jest.fn(() => {
+  createWeb3Modal: () => {
     return {
       getIsConnected: jest.fn(),
       getAddress: jest.fn(() => '0x123'),
       getChainId: jest.fn(() => 1),
       subscribeProvider: jest.fn(),
     };
-  }),
+  },
 }));
 
 beforeEach(() => {
-  browserEnv.restore();
+  jest.resetAllMocks();
   mockLocalStorage();
 });