Fix QtWebEngine overlay transparency with Mesa software rendering

- Detect Mesa software rendering in OverlayWebView.setup_web_view()
- Apply Mesa-specific transparency settings using CSS rgba() instead of Qt alpha
- Update overlay window transparency for Mesa compatibility
- Add Mesa transparency environment variables to wrapper script
- Use composition-based transparency for Mesa instead of native transparency
- Maintain hardware transparency for non-Mesa environments

MbetterClient_wrapper.sh

@@ -106,6 +106,12 @@ setup_mesa_software() {
     export MESA_SHADER_CACHE_DISABLE=0  # Enable shader caching
     export MESA_NO_VULKAN=1  # Disable Vulkan in Mesa
 
+    # MESA TRANSPARENCY FIXES - Critical for overlay transparency
+    export MESA_GLX_FORCE_ALPHA=1  # Force alpha channel support
+    export MESA_GLX_FORCE_TRANSPARENT=1  # Force transparency support
+    export QT_XCB_GL_INTEGRATION=xcb_egl  # Better transparency with Mesa
+    export QT_QPA_PLATFORM=xcb  # Ensure XCB platform for transparency
+    
     # Qt WebEngine configuration for software rendering
     export QTWEBENGINE_CHROMIUM_FLAGS="--no-sandbox --disable-gpu --disable-gpu-sandbox --disable-dev-shm-usage --disable-software-rasterizer --disable-accelerated-video-decode --disable-accelerated-video-encode --disable-gpu-compositing --disable-gpu-rasterization --disable-vulkan --disable-vulkan-surface --disable-features=Vulkan --user-data-dir=$USER_TEMP --enable-transparent-visuals --disable-background-timer-throttling --disable-renderer-backgrounding --disable-vulkan-fallback"
     

mbetterclient/qt_player/player.py

@@ -257,11 +257,36 @@ class OverlayWebView(QWebEngineView):
         """Setup web view with proper transparency for overlay"""
         logger.debug("OverlayWebView.setup_web_view() - Starting setup")
 
+        # Detect Mesa software rendering
+        import os
+        is_mesa = os.environ.get('LIBGL_ALWAYS_SOFTWARE') == '1' or \
+                  os.environ.get('MESA_GL_VERSION_OVERRIDE') is not None
+
         # Set transparent background on the web page
         page = self.page()
-        page.setBackgroundColor(QColor(0, 0, 0, 0))  # Transparent page background
+
+        if is_mesa:
+            # Mesa-specific transparency settings
+            logger.debug("Mesa software rendering detected - applying Mesa transparency fixes")
+            page.setBackgroundColor(QColor(0, 0, 0, 1))  # Semi-transparent for Mesa
+            # Use CSS-based transparency for Mesa
+            page.runJavaScript("""
+                document.body.style.backgroundColor = 'rgba(0, 0, 0, 0.01)';
+                document.documentElement.style.backgroundColor = 'rgba(0, 0, 0, 0.01)';
+            """)
+        else:
+            # Standard hardware transparency
+            page.setBackgroundColor(QColor(0, 0, 0, 0))  # Fully transparent
 
         # Widget should be visible but allow transparency
+        if is_mesa:
+            self.setStyleSheet("""
+                QWebEngineView {
+                    border: none;
+                    background: rgba(0, 0, 0, 0.01);
+                }
+            """)
+        else:
             self.setStyleSheet("""
                 QWebEngineView {
                     border: none;
@@ -269,7 +294,7 @@ class OverlayWebView(QWebEngineView):
                 }
             """)
 
-        logger.debug("OverlayWebView setup completed with transparent page background")
+        logger.debug(f"OverlayWebView setup completed - Mesa: {is_mesa}, transparency configured")
         
         # Setup WebChannel
         self.web_channel = QWebChannel()
@@ -983,8 +1008,22 @@ class PlayerWindow(QMainWindow):
             Qt.WindowType.WindowStaysOnTopHint |
             Qt.WindowType.Tool
         )
+
+        # Mesa-specific transparency handling
+        import os
+        is_mesa = os.environ.get('LIBGL_ALWAYS_SOFTWARE') == '1' or \
+                  os.environ.get('MESA_GL_VERSION_OVERRIDE') is not None
+
+        if is_mesa:
+            # Mesa compatibility - use composition-based transparency
+            self.overlay_window.setAttribute(Qt.WidgetAttribute.WA_TranslucentBackground, False)
+            self.overlay_window.setStyleSheet("background: rgba(0, 0, 0, 0.01);")
+            logger.debug("Mesa overlay window configured with composition transparency")
+        else:
+            # Standard hardware transparency
             self.overlay_window.setAttribute(Qt.WidgetAttribute.WA_TranslucentBackground, True)
             self.overlay_window.setStyleSheet("background: transparent;")
+            logger.debug("Hardware overlay window configured with native transparency")
 
         # Create overlay based on configuration - matching test_video_debug.py behavior
         if self.settings.use_native_overlay: