WKWebView in iOS with the HTML5 SDK doesn't open the "Learn More" link

[useeee...@gmail.com]

Hi,

When using a WKWebView in iOS with the HTML5 SDK, it doesn't open the Ad link in a new Safari tab when clicking the "Learn More" button. If we click in the video ad itself it does pause/play as expected. Other links (<a>) external from IMA do work and open in a new safari tab. We need to use the the HTML5 SDK to support VPAID.

1. IMA HTML5 SDK in an iOS device with WKWebView.
2. https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/ad_rule_samples&ciu_szs=300x250&ad_rule=1&impl=s&gdfp_req=1&env=vp&output=vmap&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ar%3Dpremidpost&cmsid=496&vid=short_onecue&correlator=
   
3. Sample XCode project attached.
4. The AD will auto-play, but if we click on "Learn More", the new Safari page doesn't open.

Do you know why the ad-link doesn't open in a new Safari Tab?

Thanks,

Julian

[useeee...@gmail.com]

Hi,

To add more information, this happens also with VPAID links (https://d7wce5shv28x4.cloudfront.net/NexAVPlayer/test_vpaid_js/VpaidVideoPlayerSample.xml, https://d7wce5shv28x4.cloudfront.net/NexAVPlayer/test_vpaid_js/TesterSample.xml) that in Safari iOS do open in another tab, but when the VPAID is played in a WKWebView it doesn't open at all.

Thanks,

Julian

[Chris Feldman (IMA SDK Team)]

Hi Julian,

Thank you for reaching out to support. I was able to reproduce the clickthrough issue. I'm going to bring this to the rest of our team for further investigation. I will follow-up as soon as I have an update.

Regards,

Chris Feldman

IMA SDK Team

[useeee...@gmail.com]

Hi Chris,

Did you have time to check this further? Is there any update on this?

Thanks,

Julian

[Chris Feldman (IMA SDK Team)]

Hi Julian,

Thank you for following up. We have determined that this is behavior is not being caused by the SDK. When a user activates the clickthrough, the IMA HTML5 SDK will call window.open with the clickthrough URL. Modern browsers on desktop and mobile open a new tab with this event without unloading or closing the page the ad was playing on.

On iOS, UIWebView and WKWebView don’t respond to this command since they represent a single web page and not a collection of tabs or windows. WKWebView offers a built in way to capture this command, you can then decide what action you want to happen. It is also possible to do similar behavior with UIWebView, though it is more involved. Please note that the below will only work if you have ownership of the WebView.

WKWebView

A WKWebView instance will call it’s uiDelegate’s method webView(_:createWebViewWith:for:windowFeatures:) when the window.open command is issued. From here, the delegate can decide to return a new WKWebView in which the first instance will load the clickthrough url request. Otherwise, nil can be returned and the URL can be read off of navigationAction.request and then loaded into the original web view.

func webView(_ webView: WKWebView, createWebViewWith configuration: WKWebViewConfiguration, for navigationAction: WKNavigationAction, windowFeatures: WKWindowFeatures) -> WKWebView? {
    // Capture window.open (clickthroughs) and redirect
    webView.load(navigationAction.request)
    return nil
}

UIWebView

A UIWebView instance won’t call a similar method, but to capture the event, overwrite the window.open function. Do this by calling stringByEvaluatingJavaScript(from:) in webViewDidFinishLoad(_:) and passing in the overriding Javascript:

func webViewDidFinishLoad(_ webView: UIWebView) {
    // Capture window.open (clickthroughs) and redirect
    let js: String = "window.open = function(url, name, features, replace) { window.location.href = url; };"
    webView.stringByEvaluatingJavaScript(from: js)
}

Note that injecting Javascript would also work on WKWebView, but it is a bit cleaner to not overwrite if unnecessary.

Regards,

Chris Feldman

IMA SDK Team

[useeee...@gmail.com]

Hi Chris,

Thanks for explaining it.  We already have that delegate, and use it accordingly. In the project I attached in the first post, you can see that wen I click link at the top, it does open in a new Safari Tab, because the delegate you mention is used properly. However when using the IMA SDK, that delegate (the one you mentioned) is not called. Am I missing something? Could you modify the sample attached project to make it open in Safari (the delegate is there and being used in the <a/> link)?

Thanks,

Julian

[Chris Feldman (IMA SDK Team)]

Hi Julian,

Thank you for reaching out to support. The code that I've shared is just a starting point. For more specific assistance with the iOS WebView, I suggest reaching out for support on StackOverflow.

Regards,

Chris Feldman

IMA SDK Team

[useeee...@gmail.com]

Hi Chris,

The code you shared doesn't work. My question is not about iOS Web Views but the IMA SDK. The callbacks you mention are not called (other links external to IMA do work). Have you check the sample I shared on my first post? You can see that the callbacks you mentioned are not called by the IMA SDK. And since the IMA SDK is obfuscated, I can not investigate why they are not called. 

Could you check again why the IMA SDK doesn't call the callbacks you mentioned? Any help is appreciated, since we can't investigate this further on our side (the IMA SDK is obfuscated).

Please let me know how it goes.

Thanks and best regards,

Julian

[Chris Feldman (IMA SDK Team)]

Hi Julian,

I went back to the original sample that you sent and I was able to get my code working with just a few additions. I should have mentioned that you need to implement the WKUIDelegate. I've included my additions to your code below.

I added the code bolded in red:

class WKWebViewController: UIViewController, WKUIDelegate, WKNavigationDelegate {

        // Creates the WKWebView
        let webConfiguration = WKWebViewConfiguration()
        webConfiguration.allowsInlineMediaPlayback = true
        webConfiguration.mediaPlaybackRequiresUserAction = false
        wkWebView = WKWebView(frame: .zero, configuration: webConfiguration)
        wkWebView!.navigationDelegate = self
        wkWebView!.uiDelegate = self

I added this method in its entirety:

  func webView(_ webView: WKWebView, createWebViewWith configuration: WKWebViewConfiguration, for navigationAction: WKNavigationAction, windowFeatures: WKWindowFeatures) -> WKWebView? {
    // Capture window.open (clickthroughs) and redirect
    webView.load(navigationAction.request)
    return nil
  } 

Please let me know if you continue to have issues. I have no problem opening the clickthrough with these modifications.

Regards,

Chris Feldman
IMA SDK Team

[useeee...@gmail.com]

Hi Chris,

It does work. Thanks! I was under the impression that the <a/> links and the window.open were managed in the same way. Thanks to your comment, I see now that they are handled differently by swift.

Thanks for your help on this.

Thanks,

Julian