Sharing constructed objects within a remote context

[rajsite]

In my remote context I expose two classes InnerState and OuterState. Remotely I can construct an InnerState instance.

How do I pass a reference of that InnerState instance to OuterState such that it resolves as a local reference in the remote context instead of a proxied reference?

Example (and stackblitz):

import { expose, wrap } from 'comlink';

class InnerState {
  public constructor(private val: number) {}

  getval() {
    return `inner: ${this.val}`;
  }
}

class OuterState {
  public constructor(private innerState: InnerState) {}

  getVal() {
    return `outer: ${this.innerState.getval()}`;
  }
}

const api = {
  InnerState,
  OuterState,
};
type API = typeof api;

const { port1, port2 } = new MessageChannel();

expose(api, port1);
const { InnerState: InnerStateRemote, OuterState: OuterStateRemote } =
  wrap<API>(port2);

const innerState = await new InnerStateRemote(7);

// TS Error: Argument of type 'Remote<InnerState>' is not assignable to parameter of type 'InnerState'.
const outerState = await new OuterStateRemote(innerState);

// Expected: "outer: inner: 7"
// Actual: "outer: [object Promise]" (and a few other console errors)
console.log(await outerState.getVal());

Edit: might be a duplicate of #632 but doesn't look like there was a response there, maybe this gets some fresh eyes! :)

[rajsite]

We worked around it by creating a large flat class and avoiding composition. Unfortunate but I'll go ahead and close this in favor of #632 after which hopefully we can refactor to be cleaner!