Not able to detect when widget is shown

[olaf89]

At the moment portis widget is loading for significant amount of time, I would like to show some loading indicator until widget is fully visible. I was hoping that portis.widget would resolve about that time, but there is significant delay after its resolved. Is there any way to hook into event of widget displayed to user?

[radotzki]

Hi @olaf89 👋

Thanks for the feedback, we will check how we can reduce the load time of Portis Widget.

In the meanwhile, you can use that snippet in order to be notified when the Widget is ready:

window.addEventListener(
  "message",
  e => {
    if (e.data && e.data.penpal && e.data.penpal === "handshake") {
      console.log("Widget is ready");
    }
  },
  false
);

You can see a live example here: https://codesandbox.io/s/widget-is-ready-4qgx6

Let me know if it works 😃

[olaf89]

Thanks for quick answer,

the event that you provided is being emitted before portis.widget is resolved, so it's not better then my previous attempt. I am observing a delay after its emitted and before widget is really visible to the user.

[radotzki]

That a little bit hacky, but it works better 😅

web3.eth.net.getId().then(() => {
  console.log("Widget is ready");
});

[olaf89]

It works, thanks.