Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[bug] documentPictureInPicture window does not apply appropriate display-mode: picture-in-picture CSS media tag #11613

Open
bra1n opened this issue Nov 7, 2024 · 0 comments
Labels
status: needs triage This issue needs to triage, applied to new issues type: bug

Comments

@bra1n
Copy link

bra1n commented Nov 7, 2024

Describe the bug

As the title says, it seems that Tauri on Windows does not render the appropriate @media (display-mode: picture-in-picture) CSS rules correctly for documentPictureInPicture pop-outs. It works on Windows both on Edge and Chrome according to the spec, but for some reason Tauri does not load / render the CSS rules correctly.

Reproduction

Run the example from MDN in a Tauri app on Windows: https://mdn.github.io/dom-examples/document-picture-in-picture/
A PiP window will open correctly, but it won't show the "mute" button according to the CSS rules. An even simpler way to reproduce would be opening a documentPiP window with the following CSS code:

@media (display-mode: picture-in-picture) {
  body {
    background: red;
  }
}

Now opening any element in a window.documentPictureInPicture window should have a red background on Tauri, but does not.

Expected behavior

The PiP window should render all @media (display-mode: picture-in-picture) rules, like it does on Chrome & Edge on Windows.

Full tauri info output

[✔] Environment
    - OS: Windows 10.0.19045 x86_64 (X64)
    ✔ WebView2: 130.0.2849.56
    ✔ MSVC: Visual Studio Community 2022
    ✔ rustc: 1.79.0 (129f3b996 2024-06-10)
    ✔ cargo: 1.79.0 (ffa9cf99a 2024-06-03)
    ✔ rustup: 1.27.1 (54dd3d00f 2024-04-24)
    ✔ Rust toolchain: stable-x86_64-pc-windows-msvc (default)
    - node: 20.15.0
    - npm: 10.7.0

[-] Packages
    - tauri 🦀: 2.0.1
    - tauri-build 🦀: 2.0.1
    - wry 🦀: 0.44.1
    - tao 🦀: 0.30.3
    - @tauri-apps/api : 2.0.3
    - @tauri-apps/cli : 2.0.5

[-] Plugins
    - tauri-plugin-os 🦀: 2.0.1
    - @tauri-apps/plugin-os : 2.0.0
    - tauri-plugin-shell 🦀: 2.0.1
    - @tauri-apps/plugin-shell : not installed!
    - tauri-plugin-process 🦀: 2.0.1
    - @tauri-apps/plugin-process : 2.0.0
    - tauri-plugin-updater 🦀: 2.0.2
    - @tauri-apps/plugin-updater : 2.0.0
    - tauri-plugin-window-state 🦀: 2.0.1
    - @tauri-apps/plugin-window-state : 2.0.0

[-] App
    - build-type: bundle
    - CSP: unset
    - frontendDist: ../dist
    - devUrl: http://localhost:8080/
    - framework: Vue.js
    - bundler: Vite

Stack trace

No response

Additional context

No response

@bra1n bra1n added status: needs triage This issue needs to triage, applied to new issues type: bug labels Nov 7, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
status: needs triage This issue needs to triage, applied to new issues type: bug
Projects
None yet
Development

No branches or pull requests

1 participant