Wasm: Hide "Enable screen reader" button in QWasmWindow

For each QWasmWindow, there is "Enable screeen reader" button added
for accessibility. It's hidden visually by z-ordering behind main
QWasmWindow div.
Sometimes the content of QWasmWindow contains transparent elements
and the underlying accessibility button gets visible.
This commit introduces new CSS class which hides elements visually,
but keeps it accessible for screen readers.

Fixes: QTBUG-111896
Change-Id: I78ef5746da9e0d1584ee36dd0ca6ba476623a3de
Reviewed-by: Mikołaj Boc <Mikolaj.Boc@qt.io>
Reviewed-by: Morten Johan Sørvig <morten.sorvig@qt.io>

1 files changed, 1 insertions, 4 deletions

diff --git a/src/plugins/platforms/wasm/qwasmaccessibility.cpp b/src/plugins/platforms/wasm/qwasmaccessibility.cpp
index 523f94578b..072f65aa87 100644
--- a/src/plugins/platforms/wasm/qwasmaccessibility.cpp
+++ b/src/plugins/platforms/wasm/qwasmaccessibility.cpp
@@ -65,12 +65,9 @@ void QWasmAccessibility::addAccessibilityEnableButtonImpl(QWindow *window)
     emscripten::val document = getDocument(container);
     emscripten::val button = document.call<emscripten::val>("createElement", std::string("button"));
     button.set("innerText", std::string("Enable Screen Reader"));
+    button["classList"].call<void>("add", emscripten::val("hidden-visually-read-by-screen-reader"));
     container.call<void>("appendChild", button);
 
-    emscripten::val style = button["style"];
-    style.set("width", "100%");
-    style.set("height", "100%");
-
     auto enableContext = std::make_tuple(button, std::make_unique<qstdweb::EventCallback>
         (button, std::string("click"), [this](emscripten::val) { enableAccessibility(); }));
     m_enableButtons.insert(std::make_pair(window, std::move(enableContext)));