wasm: add accessibility container to QWasmWindow

Add accessibility (a11y) container QWasmWindow. This
container should underlap the canvas with identical
geometry but ordered below.

Change-Id: I7b91e3e69e3b1afa1b03ef7f7b7336e48f1a1594
Reviewed-by: Morten Johan Sørvig <morten.sorvig@qt.io>
(cherry picked from commit f4dd67461d9873cdbfe7bef970477366047924d7)
Reviewed-by: Tor Arne Vestbø <tor.arne.vestbo@qt.io>
This commit is contained in:
Morten Sørvig 2022-12-06 09:20:50 +01:00
parent d0dd51d661
commit 56cbab3b12
3 changed files with 14 additions and 0 deletions

View File

@ -142,6 +142,11 @@ const char *Style = R"css(
display: flex;
}
.qt-window-a11y-container {
position: absolute;
z-index: -1;
}
.title-bar .image-button {
width: 18px;
height: 18px;

View File

@ -388,6 +388,7 @@ QWasmWindow::QWasmWindow(QWindow *w, QWasmCompositor *compositor, QWasmBackingSt
m_titleBar(m_document.call<emscripten::val>("createElement", emscripten::val("div"))),
m_label(m_document.call<emscripten::val>("createElement", emscripten::val("div"))),
m_canvasContainer(m_document.call<emscripten::val>("createElement", emscripten::val("div"))),
m_a11yContainer(m_document.call<emscripten::val>("createElement", emscripten::val("div"))),
m_canvas(m_document.call<emscripten::val>("createElement", emscripten::val("canvas")))
{
m_qtWindow.set("className", "qt-window");
@ -446,6 +447,9 @@ QWasmWindow::QWasmWindow(QWindow *w, QWasmCompositor *compositor, QWasmBackingSt
m_canvasContainer["classList"].call<void>("add", emscripten::val("qt-window-canvas-container"));
m_canvasContainer.call<void>("appendChild", m_canvas);
m_canvasContainer.call<void>("appendChild", m_a11yContainer);
m_a11yContainer["classList"].call<void>("add", emscripten::val("qt-window-a11y-container"));
compositor->screen()->element().call<void>("appendChild", m_qtWindow);
const bool rendersTo2dContext = w->surfaceType() != QSurface::OpenGLSurface;
@ -550,6 +554,8 @@ void QWasmWindow::setGeometry(const QRect &rect)
m_qtWindow["style"].set("top", std::to_string(frameRect.top()) + "px");
m_canvasContainer["style"].set("width", std::to_string(clientAreaRect.width()) + "px");
m_canvasContainer["style"].set("height", std::to_string(clientAreaRect.height()) + "px");
m_a11yContainer["style"].set("width", std::to_string(clientAreaRect.width()) + "px");
m_a11yContainer["style"].set("height", std::to_string(clientAreaRect.height()) + "px");
// Important for the title flexbox to shrink correctly
m_windowContents["style"].set("width", std::to_string(clientAreaRect.width()) + "px");

View File

@ -67,6 +67,8 @@ public:
std::string canvasSelector() const;
emscripten::val context2d() { return m_context2d; }
emscripten::val a11yContainer() { return m_a11yContainer; }
private:
friend class QWasmScreen;
@ -95,6 +97,7 @@ private:
emscripten::val m_titleBar;
emscripten::val m_label;
emscripten::val m_canvasContainer;
emscripten::val m_a11yContainer;
emscripten::val m_canvas;
emscripten::val m_context2d = emscripten::val::undefined();