added crx helpers to core

packages/altair-app/src/app/modules/altair/services/webextensions/webextensions.service.ts

@@ -2,7 +2,7 @@ import { Injectable } from '@angular/core';
 import { WebExtensionMessage } from 'altair-graphql-core/build/types/messaging';
 import { WindowService } from '../window.service';
 import { debug } from '../../utils/logger';
-import { isExtension } from '../../utils';
+import { isExtension, sendMessage } from 'altair-graphql-core/build/crx';
 
 @Injectable({
   providedIn: 'root',
@@ -27,7 +27,7 @@ export class WebExtensionsService {
             return;
           }
           case 'ping': {
-            browser.runtime.sendMessage({ type: 'pong' });
+            sendMessage({ type: 'pong' });
             return;
           }
           default: {
@@ -38,7 +38,6 @@ export class WebExtensionsService {
       }
     );
 
-    const readyMessage: WebExtensionMessage = { type: 'ready' };
-    browser.runtime.sendMessage(readyMessage);
+    sendMessage({ type: 'ready' });
   }
 }

packages/altair-core/package.json

@@ -36,8 +36,10 @@
     "@jedmao/location": "^3.0.0",
     "@jest/globals": "^29.7.0",
     "@types/actioncable": "^5.2.5",
+    "@types/chrome": "^0.0.209",
     "@types/color-name": "^1.1.4",
     "@types/crypto-js": "^4.0.1",
+    "@types/firefox-webext-browser": "^109.0.0",
     "@types/jest": "^29.5.12",
     "@types/json-bigint": "^1.0.1",
     "@types/node": "^14.14.41",

packages/altair-core/src/crx/index.ts

@@ -0,0 +1,17 @@
+import { WebExtensionMessage } from '../types/messaging';
+
+const browser = window.chrome || window.browser;
+export const isExtension = !!browser?.runtime?.id;
+export const isFirefoxExtension = location.protocol === 'moz-extension:';
+
+export const sendMessage = (message: WebExtensionMessage) => {
+  const browser = window.chrome || window.browser;
+  if (!isExtension) {
+    // eslint-disable-next-line prettier/prettier, no-console
+    console.log('Not running in an extension');
+    // eslint-disable-next-line prettier/prettier, no-console
+    console.log('Message:', message);
+    return;
+  }
+  browser.runtime.sendMessage(message);
+};

packages/altair-core/tsconfig.json

@@ -9,7 +9,7 @@
     "module": "ES2020",
     "moduleResolution": "node",
     "lib": ["dom", "esnext"],
-    "types": ["node"],
+    // "types": ["node", "chrome"],
     "noImplicitAny": true,
     "skipLibCheck": true,
     "esModuleInterop": true,

packages/altair-crx/package.json

@@ -30,6 +30,7 @@
   "devDependencies": {
     "@types/adm-zip": "^0.5.7",
     "@types/chrome": "^0.0.209",
+    "@types/firefox-webext-browser": "^109.0.0",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
     "@vitejs/plugin-react": "^1.3.0",

packages/altair-crx/src/helpers/messaging.ts

@@ -1,22 +1,11 @@
 import { ExportWindowState } from 'altair-graphql-core/build/types/state/window.interfaces';
 import { WebExtensionMessage } from 'altair-graphql-core/build/types/messaging';
+import { isExtension, sendMessage } from 'altair-graphql-core/build/crx';
 import { openAltairApp } from './tabs';
 
-export const isExtension = () => {
-  return !!(window.chrome || window.browser)?.runtime?.id;
-};
-export const sendMessage = (message: WebExtensionMessage) => {
-  const browser = window.chrome || window.browser;
-  if (!isExtension()) {
-    console.log('Not running in an extension');
-    console.log('Message:', message);
-    return;
-  }
-  browser.runtime.sendMessage(message);
-};
 export const openInAltair = (data: ExportWindowState) => {
   const browser = window.chrome || window.browser;
-  if (!isExtension()) {
+  if (!isExtension) {
     console.log('Not running in an extension');
     console.log('Data:', data);
     return;

packages/altair-crx/src/hooks/requests/use-requests.ts

@@ -1,14 +1,14 @@
 import { useEffect, useState } from 'react';
+import { isExtension } from 'altair-graphql-core/build/crx';
 import { mockRequests } from './mock-requests';
 import { getRequest } from '../../helpers/request';
 import { GraphQLRequest } from '../../types';
-import { isExtension } from '../../helpers/messaging';
 
 const useCurrentTab = () => {
   const [tabId, setTabId] = useState<number | undefined>(undefined);
   const browser = window.chrome || window.browser;
 
-  if (!isExtension()) {
+  if (!isExtension) {
     return;
   }
   browser.tabs.query({ active: true, currentWindow: true }, (tabs) => {
@@ -29,7 +29,7 @@ const useTabStatus = () => {
   );
   const browser = window.chrome || window.browser;
 
-  if (!isExtension()) {
+  if (!isExtension) {
     return tabStatus;
   }
   browser.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
@@ -55,7 +55,7 @@ export const useGraphQLRequests = () => {
     }
   }, [tabStatus]);
 
-  if (!isExtension()) {
+  if (!isExtension) {
     return {
       requests: mockRequests,
     };