From c6e04356d46c219176faba3ab868410a22c26cce Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Piotr=20Wierci=C5=84ski?= <piotr.wiercinski@qt.io>
Date: Thu, 16 Mar 2023 15:33:35 +0100
Subject: [PATCH] Wasm: Fix displaying frameless QWasmWindow with transparent
 content
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Currently we render shadow and default background-color even for
frameless windows with transparent content.
This behavior is not consistent comparing to other platforms.

An example of such window is InputSelectionHandle from
VirtualKeyboard module.

This commit disables shadow-box and provides transparent
background-color for QWasmWindow which are frameless.
It also provides distinction between "frame" as logic property
of window and "border" as visual decoration.

Change-Id: I902692ea561a2e88e2e6ab7faad8e3eeb536a26b
Reviewed-by: Aleksandr Reviakin <aleksandr.reviakin@qt.io>
Reviewed-by: Mikołaj Boc <Mikolaj.Boc@qt.io>
---
 src/plugins/platforms/wasm/qwasmcssstyle.cpp | 10 +++++++---
 src/plugins/platforms/wasm/qwasmwindow.cpp   | 15 +++++++++++----
 src/plugins/platforms/wasm/qwasmwindow.h     |  3 ++-
 3 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/src/plugins/platforms/wasm/qwasmcssstyle.cpp b/src/plugins/platforms/wasm/qwasmcssstyle.cpp
index 75b2aafa9a..6ac4c8d884 100644
--- a/src/plugins/platforms/wasm/qwasmcssstyle.cpp
+++ b/src/plugins/platforms/wasm/qwasmcssstyle.cpp
@@ -43,11 +43,15 @@ const char *Style = R"css(
     box-shadow: rgb(0 0 0 / 20%) 0px 10px 16px 0px, rgb(0 0 0 / 19%) 0px 6px 20px 0px;
 }
 
-.qt-window.has-frame {
+.qt-window.has-border {
     border: var(--border-width) solid lightgray;
     caret-color: transparent;
 }
 
+.qt-window.frameless {
+    background-color: transparent;
+}
+
 .resize-outline {
     position: absolute;
     display: none;
@@ -55,7 +59,7 @@ const char *Style = R"css(
 
 .qt-window.no-resize > .resize-outline { display: none; }
 
-.qt-window.has-frame:not(.maximized):not(.no-resize) .resize-outline {
+.qt-window.has-border:not(.maximized):not(.no-resize) .resize-outline {
     display: block;
 }
 
@@ -131,7 +135,7 @@ const char *Style = R"css(
     padding-bottom: 4px;
 }
 
-.qt-window.has-frame .title-bar {
+.qt-window.has-border .title-bar {
     display: flex;
 }
 
diff --git a/src/plugins/platforms/wasm/qwasmwindow.cpp b/src/plugins/platforms/wasm/qwasmwindow.cpp
index d2ab98bed9..6ec8c510d0 100644
--- a/src/plugins/platforms/wasm/qwasmwindow.cpp
+++ b/src/plugins/platforms/wasm/qwasmwindow.cpp
@@ -374,9 +374,10 @@ void QWasmWindow::setWindowFlags(Qt::WindowFlags flags)
     if (flags.testFlag(Qt::WindowStaysOnTopHint) != m_flags.testFlag(Qt::WindowStaysOnTopHint))
         m_compositor->windowPositionPreferenceChanged(this, flags);
     m_flags = flags;
-    dom::syncCSSClassWith(m_qtWindow, "has-frame", hasFrame());
-    dom::syncCSSClassWith(m_qtWindow, "has-shadow", !flags.testFlag(Qt::NoDropShadowWindowHint));
+    dom::syncCSSClassWith(m_qtWindow, "has-border", hasBorder());
+    dom::syncCSSClassWith(m_qtWindow, "has-shadow", hasShadow());
     dom::syncCSSClassWith(m_qtWindow, "has-title", flags.testFlag(Qt::WindowTitleHint));
+    dom::syncCSSClassWith(m_qtWindow, "frameless", flags.testFlag(Qt::FramelessWindowHint));
     dom::syncCSSClassWith(m_qtWindow, "transparent-for-input",
                           flags.testFlag(Qt::WindowTransparentForInput));
 
@@ -442,7 +443,7 @@ void QWasmWindow::applyWindowState()
     else
         newGeom = normalGeometry();
 
-    dom::syncCSSClassWith(m_qtWindow, "has-frame", hasFrame());
+    dom::syncCSSClassWith(m_qtWindow, "has-border", hasBorder());
     dom::syncCSSClassWith(m_qtWindow, "maximized", isMaximized);
 
     m_nonClientArea->titleBar()->setRestoreVisible(isMaximized);
@@ -559,12 +560,18 @@ void QWasmWindow::requestUpdate()
     m_compositor->requestUpdateWindow(this, QWasmCompositor::UpdateRequestDelivery);
 }
 
-bool QWasmWindow::hasFrame() const
+bool QWasmWindow::hasBorder() const
 {
     return !m_state.testFlag(Qt::WindowFullScreen) && !m_flags.testFlag(Qt::FramelessWindowHint)
             && !windowIsPopupType(m_flags);
 }
 
+bool QWasmWindow::hasShadow() const
+{
+    return !m_flags.testFlag(Qt::NoDropShadowWindowHint)
+            && !m_flags.testFlag(Qt::FramelessWindowHint);
+}
+
 bool QWasmWindow::hasMaximizeButton() const
 {
     return !m_state.testFlag(Qt::WindowMaximized) && m_flags.testFlag(Qt::WindowMaximizeButtonHint);
diff --git a/src/plugins/platforms/wasm/qwasmwindow.h b/src/plugins/platforms/wasm/qwasmwindow.h
index 1baa699449..661a5160e8 100644
--- a/src/plugins/platforms/wasm/qwasmwindow.h
+++ b/src/plugins/platforms/wasm/qwasmwindow.h
@@ -96,7 +96,8 @@ private:
     static constexpr auto minSizeForRegularWindows = 100;
 
     void invalidate();
-    bool hasFrame() const;
+    bool hasBorder() const;
+    bool hasShadow() const;
     bool hasMaximizeButton() const;
     void applyWindowState();