From d93a019454d7dc77ae31ae2ad637aab5bbf2c840 Mon Sep 17 00:00:00 2001 From: "Mathieu Massicotte, CEP" <38018243+massicottem@users.noreply.github.com> Date: Thu, 8 Aug 2024 14:50:19 -0400 Subject: [PATCH] fix(Xbox): Support screen resolution detection on Xbox when using WebView2 (#7144) Resolves #7141 --- CONTRIBUTORS | 1 + docs/tutorials/screen-resolution-detection.md | 18 +++++++++++++++++ externs/xbox.js | 20 +++++++++++++++++++ lib/util/platform.js | 15 ++++++++++++-- 4 files changed, 52 insertions(+), 2 deletions(-) diff --git a/CONTRIBUTORS b/CONTRIBUTORS index c19b07ea63..2384a16a9f 100644 --- a/CONTRIBUTORS +++ b/CONTRIBUTORS @@ -92,6 +92,7 @@ Martin Stark Mariano Facundo Scigliano Matias Russitto Mathieu Côté +Mathieu Massicotte Matthias Van Parijs Mattias Wadman Mehmet Guney diff --git a/docs/tutorials/screen-resolution-detection.md b/docs/tutorials/screen-resolution-detection.md index a7a10b33fa..28cf52eaac 100644 --- a/docs/tutorials/screen-resolution-detection.md +++ b/docs/tutorials/screen-resolution-detection.md @@ -32,6 +32,24 @@ Note: in order to use this feature in a UWP app, you must add the URI of your web app in the ContentURIs section of the Package.appxmanifest file and set the `WinRT access` field to `All`. +### WebView2 + +When using a WebView2 control in a UWP app, additional steps are required in +order to enable the screen resolution detection. First, the WebView2's user-agent +is the same as Edge Chromium and does not contain the term "Xbox One", so it has +to be manually added like this when initializing your WebView2: + +```CSharp +webView.CoreWebView2.Settings.UserAgent += " Xbox One"; +``` + +Also, you will need to add a special project called WinRTAdapter in your project's +solution. This project allows WinRT APIs to be exposed in the WebView2 control. +You will find more information on this [here](https://learn.microsoft.com/en-us/microsoft-edge/webview2/how-to/winrt-from-js). +Make sure you put `Windows.Media.Protection.ProtectionCapabilities` +and `Windows.Media.Protection.ProtectionCapabilityResult` in the WinRTAdapter +_Include filters_ configuration. + ## Hisense We can detect if the device supports 3840x2160 (4K). diff --git a/externs/xbox.js b/externs/xbox.js index 65ffb0693d..af243b96df 100644 --- a/externs/xbox.js +++ b/externs/xbox.js @@ -41,3 +41,23 @@ Windows.Media.Protection.ProtectionCapabilityResult = { maybe: 'Maybe', probably: 'Probably', }; + + +/** @const */ +var chrome = {}; + + +/** @const */ +chrome.webview = {}; + + +/** @const */ +chrome.webview.hostObjects = {}; + + +/** @const */ +chrome.webview.hostObjects.sync = {}; + + +/** @const */ +chrome.webview.hostObjects.sync.Windows = Windows; diff --git a/lib/util/platform.js b/lib/util/platform.js index 138d1d5d30..0024e7baa7 100644 --- a/lib/util/platform.js +++ b/lib/util/platform.js @@ -749,10 +749,21 @@ shaka.util.Platform = class { maxResolution.width = 1920; maxResolution.height = 1080; try { + let winRT = undefined; + + // Try to access to WinRT for WebView, if it's not defined, + // try to access to WinRT for WebView2, if it's not defined either, + // let it throw. + if (typeof Windows !== 'undefined') { + winRT = Windows; + } else { + winRT = chrome.webview.hostObjects.sync.Windows; + } + const protectionCapabilities = - new Windows.Media.Protection.ProtectionCapabilities(); + new winRT.Media.Protection.ProtectionCapabilities(); const protectionResult = - Windows.Media.Protection.ProtectionCapabilityResult; + winRT.Media.Protection.ProtectionCapabilityResult; // isTypeSupported may return "maybe", which means the operation is not // completed. This means we need to retry // https://learn.microsoft.com/en-us/uwp/api/windows.media.protection.protectioncapabilityresult?view=winrt-22621