wasm: set contenteditable on canvas

We don't want to make the top-level screen contenteditable,
since that interferes with accessibility. Instead, make
the canvas contenteditable and install clipboard event
handlers there.

Also move follow-up settings which counters some of the
effects contenteditable (outline: none and inputmode: none),
and move aria-hidden.

Pick-to: 6.5
Change-Id: Ibe73d8d097acd948ba8920c781a2003db0a14f3d
Reviewed-by: Morten Johan Sørvig <morten.sorvig@qt.io>

6 files changed, 21 insertions, 19 deletions

diff --git a/src/plugins/platforms/wasm/qwasmclipboard.cpp b/src/plugins/platforms/wasm/qwasmclipboard.cpp
index 215ff50aa0..df54a47ea9 100644
--- a/src/plugins/platforms/wasm/qwasmclipboard.cpp
+++ b/src/plugins/platforms/wasm/qwasmclipboard.cpp
@@ -173,15 +173,15 @@ void QWasmClipboard::initClipboardPermissions()
                            })());
 }
 
-void QWasmClipboard::installEventHandlers(const emscripten::val &screenElement)
+void QWasmClipboard::installEventHandlers(const emscripten::val &target)
 {
     emscripten::val cContext = val::undefined();
     emscripten::val isChromium = val::global("window")["chrome"];
-   if (!isChromium.isUndefined()) {
+    if (!isChromium.isUndefined()) {
         cContext = val::global("document");
-   } else {
-       cContext = screenElement;
-   }
+    } else {
+        cContext = target;
+    }
     // Fallback path for browsers which do not support direct clipboard access
     cContext.call<void>("addEventListener", val("cut"),
                         val::module_property("qtClipboardCutTo"), true);
diff --git a/src/plugins/platforms/wasm/qwasmclipboard.h b/src/plugins/platforms/wasm/qwasmclipboard.h
index 924c3f582f..cb649e03fe 100644
--- a/src/plugins/platforms/wasm/qwasmclipboard.h
+++ b/src/plugins/platforms/wasm/qwasmclipboard.h
@@ -36,7 +36,7 @@ public:
 
     ProcessKeyboardResult processKeyboard(const QWasmEventTranslator::TranslatedEvent &event,
                                           const QFlags<Qt::KeyboardModifier> &modifiers);
-    void installEventHandlers(const emscripten::val &canvas);
+    static void installEventHandlers(const emscripten::val &target);
     bool hasClipboardApi();
 
 private:
diff --git a/src/plugins/platforms/wasm/qwasmcssstyle.cpp b/src/plugins/platforms/wasm/qwasmcssstyle.cpp
index 6222e9c88a..a4821cb027 100644
--- a/src/plugins/platforms/wasm/qwasmcssstyle.cpp
+++ b/src/plugins/platforms/wasm/qwasmcssstyle.cpp
@@ -24,7 +24,6 @@ const char *Style = R"css(
     width: 100%;
     height: 100%;
     overflow: hidden;
-    outline: none;
 }
 
 .qt-window {
diff --git a/src/plugins/platforms/wasm/qwasmintegration.cpp b/src/plugins/platforms/wasm/qwasmintegration.cpp
index 9f139ad446..1487fb3f88 100644
--- a/src/plugins/platforms/wasm/qwasmintegration.cpp
+++ b/src/plugins/platforms/wasm/qwasmintegration.cpp
@@ -276,7 +276,6 @@ void QWasmIntegration::addScreen(const emscripten::val &element)
 {
     QWasmScreen *screen = new QWasmScreen(element);
     m_screens.append(qMakePair(element, screen));
-    m_clipboard->installEventHandlers(element);
     QWindowSystemInterface::handleScreenAdded(screen);
 }
 
diff --git a/src/plugins/platforms/wasm/qwasmscreen.cpp b/src/plugins/platforms/wasm/qwasmscreen.cpp
index fd3d83b614..add4806e44 100644
--- a/src/plugins/platforms/wasm/qwasmscreen.cpp
+++ b/src/plugins/platforms/wasm/qwasmscreen.cpp
@@ -56,22 +56,11 @@ QWasmScreen::QWasmScreen(const emscripten::val &containerOrCanvas)
 
     m_shadowContainer["classList"].call<void>("add", std::string("qt-screen"));
 
-    // Set contenteditable so that the canvas gets clipboard events,
-    // then hide the resulting focus frame, and reset the cursor.
-    m_shadowContainer.set("contentEditable", std::string("true"));
-    // set inputmode to none to stop mobile keyboard opening
-    // when user clicks  anywhere on the canvas.
-    m_shadowContainer.set("inputmode", std::string("none"));
-
-    // Hide the canvas from screen readers.
-    m_shadowContainer.call<void>("setAttribute", std::string("aria-hidden"), std::string("true"));
-
     // Disable the default context menu; Qt applications typically
     // provide custom right-click behavior.
     m_onContextMenu = std::make_unique<qstdweb::EventCallback>(
             m_shadowContainer, "contextmenu",
             [](emscripten::val event) { event.call<void>("preventDefault"); });
-
     // Create "specialHTMLTargets" mapping for the canvas - the element  might be unreachable based
     // on its id only under some conditions, like the target being embedded in a shadow DOM or a
     // subframe.
diff --git a/src/plugins/platforms/wasm/qwasmwindow.cpp b/src/plugins/platforms/wasm/qwasmwindow.cpp
index 1dc43b61bb..c6c679a0e5 100644
--- a/src/plugins/platforms/wasm/qwasmwindow.cpp
+++ b/src/plugins/platforms/wasm/qwasmwindow.cpp
@@ -18,6 +18,7 @@
 #include "qwasmevent.h"
 #include "qwasmeventdispatcher.h"
 #include "qwasmaccessibility.h"
+#include "qwasmclipboard.h"
 
 #include <iostream>
 #include <sstream>
@@ -54,6 +55,20 @@ QWasmWindow::QWasmWindow(QWindow *w, QWasmCompositor *compositor, QWasmBackingSt
 
     m_canvas["classList"].call<void>("add", emscripten::val("qt-window-content"));
 
+    // Set contenteditable so that the canvas gets clipboard events,
+    // then hide the resulting focus frame.
+    m_canvas.set("contentEditable", std::string("true"));
+    m_canvas["style"].set("outline", std::string("none"));
+
+    QWasmClipboard::installEventHandlers(m_canvas);
+
+    // set inputmode to none to stop mobile keyboard opening
+    // when user clicks anywhere on the canvas.
+    m_canvas.set("inputmode", std::string("none"));
+
+    // Hide the canvas from screen readers.
+    m_canvas.call<void>("setAttribute", std::string("aria-hidden"), std::string("true"));
+
     m_windowContents.call<void>("appendChild", m_canvasContainer);
 
     m_canvasContainer["classList"].call<void>("add", emscripten::val("qt-window-canvas-container"));