How can I open popups in the same WebView (Not a New Window) in Windows UWP?

Question

I have a WebView in my UWP program that works fine EXCEPT for when I click a button that normally opens in a new window (popup).

When I click on a button that normally opens in a new window, I just want it to open in the same WebView, but it opens in my default browser. Is there a setting I can set to fix that?

Update:

I have answered my original question. I added a NewWindowRequested Event Handler, opened the

args.uri

in the same webview and then said

e.handled=true

I have a new issue though and it is probably only with jeopardy.com. I am trying to make a "Watson" that will google questions, but when I open the Practice Test, it never starts.

So basically in my WebView I go to https://www.jeopardy.com/be-a-contestant/practice-tests and click on Take the Practice Test. When it opens the new windows, the timer never starts. I guess they are trying to stop people from using programs on their questions. Does anyone have a workaround?

Also It works in edge for me

As opposed to the Webview which looks like (Right Side)

You think it might have to do with a javascript function or windows size?

UPDATE2:

For anyone that wants to help, here is a github repo:

https://github.com/SethKitchen/JeopardyWinner

Answer 1

I had a look at your issue. In fact, you need to initialize your second page, with some data created on the first page. If you access directly to the second page (https://www.jeopardy.com/be-a-contestant/practice-test-client) with a standard browser you will have the same behavior that the one you have in your UWP application.

If you launched the debugger tool of your browser (F12), you will see that the main scripts are:

• on the first page: https://www.jeopardy.com/Assets/jeopardy/js/practice_test_launcher.js
• on the second page: https://www.jeopardy.com/Assets/jeopardy/js/practice_test_client.js

So, I have managed to start the timer by injecting some content in the second page using the debugger console (I have tested this with Firefox). Here are the steps to execute (copy/paste the whole thing into your console and execute it):

var s = document.createElement("script");s.type = "text/javascript";s.src = "https://www.jeopardy.com/Assets/jeopardy/easyxdm/exdm_helper.js";$("head").append(s); 

s.src = "https://www.jeopardy.com/Assets/jeopardy/js/main.js";$("head").append(s);

s.src = "https://www.jeopardy.com/Assets/jeopardy/js/practice_test_launcher.js";$("head").append(s);

backendUserCheck(); test_launcher.init();test_launcher.testWindow = window;

$('body').append('<div data - testfile = "/Assets/jeopardy/json/test_practice_2011.json" data - testid = "1" class="button launch_practice_test" data-testtype="adult">Take the practice test</div>');

var button = $('.launch_practice_test');test_launcher.testQuestionsFile = button.attr('data-testfile');test_launcher.testType = button.attr('data-testtype');test_launcher.testTitle = button.attr('data-testtitle');test_launcher.testID = button.attr('data-testid');

testModule.parentRef=test_launcher;

testModule.deleteLocalStorage();
testModule.checkLocalStorage();
testModule.getLocalStorage();
testModule.testID = testModule.parentRef.getTestID();
testModule.testType = testModule.parentRef.getTestType();
testModule.testFile = testModule.parentRef.getFile();
testModule.hardwareTest = testModule.parentRef.checkIfDryRun();

testModule.sendTestStart();

trace = function(){};

trace = {
    output  : true,
    queue   : [],

    push    : function(data)
    {
        trace.queue.push(data);
        if(trace.output)
        {
            trace.post();
        }
        return
    },

    post    : function()
    {
        $.each(trace.queue, function(i,arr)
        {
            trace.log(arr);
        });
        trace.queue = [];
        return
    },

    dump    : function()
    {
        trace.post();
        return
    },

    log     : function(data)
    {
        if (!window.console){ console = {log: function() {}} };
        console.log(data);
        return
    }
};

testModule.loadQuiz();
testModule.parentRef=test_launcher;
testModule.startDate = testModule.parentRef.getStartDateInMS();

This initialization code is extracted from the onload events or init methods of the 2 main scripts, I have mentioned earlier. The timer is excecuted but the questions doesn't appear afterward. I think it lacks some code from alertParent and setTestData located in practice_test_client.js. I let you debug the web page and find the necessary methods to execute.

To make it work in your UWP, you have to inject these data into your web View. For this, you can try the InvokeScriptAsync method or download the page with HttpClient and add the initialization command into it before loading the resulting page into your webView:

string content = "";
using (HttpClient client = new HttpClient())
{
    content = await client.GetStringAsync(new Uri("https://www.jeopardy.com/be-a-contestant/practice-test-client"));
}