WInJS: Unload x-ms-webview when user navigates away from the page

Question

I have a x-ms-webview control in my WinJS App that plays a youtube video.

When I navigate away from the page, the audio from the video continues to play because (I assume) the webview hasn't been unloaded correctly.

What is the best way of removing the webview when a user navigates away from the page?

HTML: <x-ms-webview id="videoPlayer" class="videoPlayer"></x-ms-webview>

JS: videoPlayer.src = video.VideoURL;

EDIT: I've tried a horrid bodge using the navigateToString("") method in the unload event for the page. Setting this property stops the sound from playing but I hope that's not the only option available.

Answer 1

Here's another workaround: you can dispose of the WebView element in the PageControl's unload 'handler':

(function () {

    var webView,
        page = WinJS.UI.Pages.define("/pages/webView/webView.html", {
            ready: function (element, something) {

                webView = document.querySelector("#myWebView");
                webView.src = "http://www.youtube.com/watch?v=dk5-gCc_4s4";

            },
            unload: function () {
                webView.parentNode.removeChild(webView);
                webView = null;
            }
        });

})();

The YouTube video will continue to play for about a minute. When you navigate back to the page with the WebView, the element will be reloaded with that PageControl. I think that your solution to use navigateToString("") is the best.