iced_web icon indicating copy to clipboard operation
iced_web copied to clipboard

When used with trunk, the UI only shows up after hovering the mouse over it

Open ISibboI opened this issue 1 year ago • 3 comments

Thanks for making iced_web, it is really helpful in making UI's that work both natively and in the browser!

I am using it together with trunk which handles building and serving the WASM part. When using the default configuration of trunk, it seems like I need to hover over the window first before the UI shows up. I am using trunk 0.16.0 and iced 0.4.2 with iced_web 0.4.0. My browser is Brave v1.42.97 (Aug 17th, 2022) based on Chromium 104.0.5112.102.

I am not sure what other information is needed to get behind this. Please just ask :)

ISibboI avatar Aug 27 '22 13:08 ISibboI

I have the same problem. I would like to help solve it.

I would like to support to show the initial screen without mouse over.

I know it is possible to make it work by using pointerover in JS, but can you implement it officially?

Thank you in advance.

kano1101 avatar Nov 29 '22 22:11 kano1101

Watching DOMNodeInserted might be workaround...

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Tour - Iced</title>
  </head>
  <body>
    <script type="module">
      import init from "./tour/tour.js";
      init('./tour/tour_bg.wasm');
      function ready(loaded) {
        if (['interactive', 'complete'].includes(document.readyState)) {
          loaded();
        } else {
          document.addEventListener('DOMContentLoaded', loaded);
        }
      }
      ready(() => {
        function eventListener() {
          const canvas = document.querySelector("canvas");
          if (canvas == null) {
            console.error("cannot find canvas");
            return;
          }
          canvas.dispatchEvent(new PointerEvent('pointerover'));
          document.body.removeEventListener('DOMNodeInserted', eventListener);
        };
        document.body.addEventListener('DOMNodeInserted', eventListener);
      });
    </script>
  </body>
</html>

ref: https://teratail.com/questions/enskivge5ttj1e

yumetodo avatar Dec 14 '22 16:12 yumetodo

I am not sure what other information is needed to get behind this. Please just ask :)

A git clone URL to reproduce the issue.

stappersg avatar Jul 29 '23 11:07 stappersg