Trezor connect not triggering device events callback when the app is not hosted on local host

[ta32]

Eg The app when deployed on vercel will not find trezor devices

When the app is running on localhost: https://github.com/ta32/tpm/tree/logging
The trezor connect popup appears and I can see device events being sent.

export async function initTrezor(
  appUrl: string,
  deviceEventCallback: (event: DeviceEventMessage) => void
) {
  console.log("initTrezor for appUrl: ", appUrl);
  await TrezorConnect.init({
    transportReconnect: true,
    debug: true,
    popup: true,
    lazyLoad: false,
    manifest: {
      email: "[email protected]",
      appUrl: appUrl,
    },
  })
  .catch((error) => {
    console.log("TrezorConnect init error");
    return error;
  });
  TrezorConnect.on(DEVICE_EVENT, deviceEventCallback);
}

The deviceEventCallback is only triggered when the app is running from localhost
When its working the log will look like this

When deployed on vercel (same branch)

[mroz22]

I think you need to give permissions in trezor popup page (with save option). after it is done you will be receiving events.

[ta32]

That works thanks. Once the origin is trusted it will receive device events.
{"permissions":[{"origin":"https://tmp.local:3000"}

I also noticed you need to call a method like
TrezorConnect.getPublicKey
for the popup page to show the option to save permissions.

If I only call TrezorConnect.getFeatures()
The popup page will not ask the user to trust the origin, its just blank and closes.

I am using the device events to subscribe to device connect events to show the device in a dropdown.

[ta32]

https://trezor.github.io/trezor-suite/connect-explorer/#/method/requestLogin-sync

This method is probably better, it causes the pop-up page to be displayed.