From 79ffb2eb33f3e1d02c47a9b492c2c0d0545b9876 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Morten=20S=C3=B8rvig?= Date: Fri, 3 Feb 2023 12:59:42 +0100 Subject: [PATCH] wasm: set contenteditable on canvas MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 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. Change-Id: Ibe73d8d097acd948ba8920c781a2003db0a14f3d Reviewed-by: Morten Johan Sørvig (cherry picked from commit 2443f2be07607e44ec483278873702eb0f57ab26) Reviewed-by: Qt Cherry-pick Bot --- src/plugins/platforms/wasm/qwasmclipboard.cpp | 10 +++++----- src/plugins/platforms/wasm/qwasmclipboard.h | 2 +- src/plugins/platforms/wasm/qwasmcssstyle.cpp | 1 - src/plugins/platforms/wasm/qwasmintegration.cpp | 1 - src/plugins/platforms/wasm/qwasmscreen.cpp | 11 ----------- src/plugins/platforms/wasm/qwasmwindow.cpp | 15 +++++++++++++++ 6 files changed, 21 insertions(+), 19 deletions(-) diff --git a/src/plugins/platforms/wasm/qwasmclipboard.cpp b/src/plugins/platforms/wasm/qwasmclipboard.cpp index d6343e9f6bc..80f71707482 100644 --- a/src/plugins/platforms/wasm/qwasmclipboard.cpp +++ b/src/plugins/platforms/wasm/qwasmclipboard.cpp @@ -240,15 +240,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("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 924c3f582fa..cb649e03feb 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 &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 341bdf4f378..2b2a225f530 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 148810ba8bd..ab04a10726a 100644 --- a/src/plugins/platforms/wasm/qwasmintegration.cpp +++ b/src/plugins/platforms/wasm/qwasmintegration.cpp @@ -278,7 +278,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 3300449ae46..fc309a0d316 100644 --- a/src/plugins/platforms/wasm/qwasmscreen.cpp +++ b/src/plugins/platforms/wasm/qwasmscreen.cpp @@ -57,22 +57,11 @@ QWasmScreen::QWasmScreen(const emscripten::val &containerOrCanvas) m_shadowContainer["classList"].call("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("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( m_shadowContainer, "contextmenu", [](emscripten::val event) { event.call("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 aa229b5776a..dafe3662eb9 100644 --- a/src/plugins/platforms/wasm/qwasmwindow.cpp +++ b/src/plugins/platforms/wasm/qwasmwindow.cpp @@ -20,6 +20,7 @@ #include "qwasmeventdispatcher.h" #include "qwasmstring.h" #include "qwasmaccessibility.h" +#include "qwasmclipboard.h" #include #include @@ -56,6 +57,20 @@ QWasmWindow::QWasmWindow(QWindow *w, QWasmCompositor *compositor, QWasmBackingSt m_canvas["classList"].call("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("setAttribute", std::string("aria-hidden"), std::string("true")); + m_windowContents.call("appendChild", m_canvasContainer); m_canvasContainer["classList"].call("add", emscripten::val("qt-window-canvas-container"));