fix(web-extension): decouple/detach objects returned by remote api fa…

…ctory

their lifetime is no longer tied to the parent object

packages/web-extension/src/messaging/NonBackgroundMessenger.ts

@@ -14,7 +14,14 @@ import {
   takeWhile,
   tap
 } from 'rxjs';
-import { Messenger, MessengerDependencies, MessengerPort, PortMessage, ReconnectConfig } from './types';
+import {
+  DeriveChannelOptions,
+  Messenger,
+  MessengerDependencies,
+  MessengerPort,
+  PortMessage,
+  ReconnectConfig
+} from './types';
 import { deriveChannelName } from './util';
 import { isNotNil } from '@cardano-sdk/util';
 import { retryBackoff } from 'backoff-rxjs';
@@ -82,15 +89,17 @@ export const createNonBackgroundMessenger = (
   return {
     channel,
     connect$,
-    deriveChannel(path) {
+    deriveChannel(path, { detached }: DeriveChannelOptions = {}) {
       const messenger = createNonBackgroundMessenger(
         {
           baseChannel: deriveChannelName(channel, path),
           reconnectConfig: { initialDelay, maxDelay }
         },
         { logger, runtime }
       );
-      derivedMessengers.add(messenger);
+      if (!detached) {
+        derivedMessengers.add(messenger);
+      }
       return messenger;
     },
     get isShutdown() {

packages/web-extension/src/messaging/remoteApi.ts

@@ -126,7 +126,7 @@ const consumeFactory =
         messageId: newMessageId()
       } as FactoryCallMessage)
       .subscribe();
-    const apiMessenger = messenger.deriveChannel(channel);
+    const apiMessenger = messenger.deriveChannel(channel, { detached: true });
     // eslint-disable-next-line no-use-before-define
     const api = consumeMessengerRemoteApi(
       {
@@ -312,7 +312,7 @@ export const bindFactoryMethods = <API extends object>(
     try {
       const args = fromSerializableObject<MethodRequest>(data.factoryCall.args);
       const { method, channel } = data.factoryCall;
-      const factoryMessenger = messenger.deriveChannel(channel);
+      const factoryMessenger = messenger.deriveChannel(channel, { detached: true });
       // eslint-disable-next-line no-use-before-define
       const api = exposeMessengerApi(
         {
@@ -345,11 +345,9 @@ export const bindFactoryMethods = <API extends object>(
       };
       completeSubscription = factoryMessenger.message$.subscribe((msg) => {
         if (isCompletionMessage(msg.data)) {
-          subscription.remove(teardown);
           teardown();
         }
       });
-      subscription.add(teardown);
     } catch (error) {
       logger.debug('[bindFactoryMethods] error exposing api', data, error);
     }

packages/web-extension/src/messaging/types.ts

@@ -152,13 +152,20 @@ export interface ConsumeRemoteApiOptions<T> {
   getErrorPrototype?: GetErrorPrototype;
 }
 
+export interface DeriveChannelOptions {
+  /**
+   * If true, shutting down base messenger will not shut down the derived messenger
+   */
+  detached?: boolean;
+}
+
 export interface Messenger extends Shutdown {
   channel: ChannelName;
   connect$: Observable<MinimalPort>;
   postMessage(message: unknown): Observable<void>;
   message$: Observable<PortMessage>;
   isShutdown: boolean;
-  deriveChannel(path: string): Messenger;
+  deriveChannel(path: string, options?: DeriveChannelOptions): Messenger;
 }
 
 export interface MessengerApiDependencies {

packages/web-extension/test/remoteApi/remoteApi.test.ts

@@ -1,13 +1,16 @@
-import { EMPTY, Observable, Subject, map } from 'rxjs';
 import {
+  ChannelName,
   FactoryCallMessage,
   Messenger,
+  MinimalPort,
   PortMessage,
   RemoteApiProperties,
   RemoteApiPropertyType,
   RequestMessage,
+  bindFactoryMethods,
   exposeMessengerApi
 } from '../../src/messaging';
+import { EMPTY, Observable, Subject, map, of } from 'rxjs';
 import { dummyLogger } from 'ts-log';
 
 const logger = dummyLogger;
@@ -25,6 +28,41 @@ type SimpleApi = {
   };
 };
 
+// eslint-disable-next-line no-use-before-define
+type TestMessenger = Messenger & { derivedMessengers: DerivedMessenger[] };
+type DerivedMessenger = { messenger: TestMessenger; detached?: boolean };
+const createMockMessenger = (channel: ChannelName) => {
+  const derivedMessengers = [] as Array<DerivedMessenger>;
+  const message$ = new Subject<PortMessage<unknown>>();
+  const connect$ = new Subject<MinimalPort>();
+  let isShutdown = false;
+  return {
+    channel,
+    connect$,
+    deriveChannel: jest.fn().mockImplementation((derivedChannel, { detached } = {}) => {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      const messenger: any = createMockMessenger(`${channel}-${derivedChannel}`);
+      derivedMessengers.push({ detached, messenger });
+      return messenger;
+    }),
+    derivedMessengers,
+    get isShutdown() {
+      return isShutdown;
+    },
+    message$,
+    postMessage: jest.fn().mockImplementation(() => EMPTY),
+    shutdown: jest.fn().mockImplementation(() => {
+      isShutdown = true;
+      message$.complete();
+      connect$.complete();
+      for (const { messenger, detached } of derivedMessengers) {
+        !detached && messenger.shutdown();
+      }
+    })
+  };
+};
+
+// TODO: refactor to use createMockMessenger
 const setUp = (mode: ApiObjectType) => {
   const incomingMsg$ = new Subject<PortMessage<unknown>>();
 
@@ -203,7 +241,68 @@ describe('remoteApi', () => {
       });
     });
 
-    describe('ApiFactory', () => {
+    describe('bindFactoryMethods', () => {
+      describe('factory invocations create "detached" API objects', () => {
+        it('does not shut down returned API objects when the factory is shut down', (done) => {
+          const messenger = createMockMessenger('pingPong');
+          const factory = bindFactoryMethods(
+            {
+              api$: of({
+                pingApi: () => ({
+                  ping: async () => 'pong'
+                })
+              }),
+              properties: {
+                pingApi: {
+                  getApiProperties() {
+                    return {
+                      ping: RemoteApiPropertyType.MethodReturningPromise
+                    };
+                  },
+                  propType: RemoteApiPropertyType.ApiFactory
+                }
+              }
+            },
+            {
+              logger,
+              messenger
+            }
+          );
+          messenger.message$.next({
+            data: {
+              factoryCall: {
+                args: [],
+                channel: 'pingApi-1',
+                method: 'pingApi'
+              },
+              messageId: '1'
+            } as FactoryCallMessage,
+            port: {} as MinimalPort
+          });
+          factory.shutdown();
+          expect(messenger.derivedMessengers.length).toBe(1);
+          expect(messenger.derivedMessengers[0].detached).toBe(true);
+          expect(messenger.derivedMessengers[0].messenger.isShutdown).toBe(false);
+          expect(messenger.derivedMessengers[0].messenger.postMessage).not.toBeCalled();
+          const pingMessage$ = messenger.derivedMessengers[0].messenger.message$ as Subject<PortMessage<unknown>>;
+          pingMessage$.next({
+            data: {
+              messageId: '2',
+              request: {
+                args: [],
+                method: 'ping'
+              }
+            } as RequestMessage,
+            port: {} as MinimalPort
+          });
+          setTimeout(() => {
+            // Sends a response, verifying that it wasn't shutdown
+            expect(messenger.derivedMessengers[0].messenger.postMessage).toBeCalledTimes(1);
+            done();
+          });
+        });
+      });
+
       it('each factory call exposes a new api object', (done) => {
         const activate1: FactoryCallMessage = {
           factoryCall: {