Side Panel messaging

[adao]

I forked the repo and added this locally, with a few other minor changes, to get tab-specific side panel messaging working.

import browser from 'webextension-polyfill'
import { createEndpointRuntime } from './internal/endpoint-runtime'
import { createStreamWirings } from './internal/stream'
import { createPersistentPort } from './internal/persistent-port'

const [tab] = await browser.tabs.query({active: true, currentWindow: true})
const port = createPersistentPort(`side-panel@${tab.id}`)
const endpointRuntime = createEndpointRuntime(
  'side-panel',
  message => port.postMessage(message),
)

port.onMessage(endpointRuntime.handleMessage)

export const { sendMessage, onMessage } = endpointRuntime
export const { openStream, onOpenStreamChannel } = createStreamWirings(endpointRuntime)

I actually am not super sure the above implementation is best, as I'm calling await outside of an explicit async context. For some reason it works. If someone could explain it to me, that would be helpful.

I like the above because it's clean and looks closer to the other context files. But since I don't fully understand its implications, I went with the solution below.

import { createEndpointRuntime } from './internal/endpoint-runtime'
import { createStreamWirings } from './internal/stream'
import { createPersistentPort } from './internal/persistent-port'


export function getSidePanel(tabId) {
  const port = createPersistentPort(`side-panel@${tabId}`)
  const endpointRuntime = createEndpointRuntime(
    'side-panel',
    message => port.postMessage(message),
  )

  port.onMessage(endpointRuntime.handleMessage)

  const { sendMessage, onMessage } = endpointRuntime
  const { openStream, onOpenStreamChannel } = createStreamWirings(endpointRuntime)
  return {
    sendMessage,
    onMessage,
    openStream,
    onOpenStreamChannel,
  }
}

Here, I fetch the tabId separately in the client code and pass it to this constructor. And I expose the methods as a singleton to the rest of my SidePanel javascript runtime.

Which do y'all think is more reasonable?

[adao]

Found my answer here regarding await outside of async functions. Looks like it's fine for modules, which is the case here.