Xamarin.Forms WebView - Adaptive Cards Action.OpenURL Buttons Not Working on iOS

[torynfarr]

Description

I'm working on a fairly simple Xamarin.Forms mobile app for Android and iOS. It has a WebView which loads a website (an ASPX file hosted internally on a SharePoint site) which contains a Direct Line chatbot control so that users can chat with a chatbot from the app. The bot (which happens to use the Microsoft Bot Framework) outputs the majority of its responses as Adaptive Cards. Some of those Adaptive Cards have _Action.OpenURL_ buttons on them. When tapped, the mobile app should open the URL behind the button in the default browser on the mobile device. The buttons work properly on Android but not on iOS.

To prevent the URLs behind the buttons from loading in the WebView (thus navigating away from the chatbot's page) and instead, loads the URL in the native browser, I have a WebView behavior setup to catch navigation events.

private void WebViewOnNavigating(object sender, WebNavigatingEventArgs e)
{
     e.Cancel = true;
     _ = Browser.OpenAsync(e.Url, LaunchOptions);
}

This works perfectly on Android. On iOS, if I test the WebView with it pointing to just a basic HTML file with a hyperlink in it, it works on iOS. The navigation event is triggered and the URL opens in Safari. It just doesn't work with _Action.OpenURL_ buttons on Adaptive Cards. The navigation event is never triggered and tapping the button on the card does nothing.

As an alternative to using a behavior on the WebView, I also tried simply catching the WebView navigation like this:

myWebView.Navigating += async (s, e) =>
{
     Uri uri = new Uri(e.Url);
     e.Cancel = true;

     if (Device.RuntimePlatform == Device.iOS)
     {
           await Browser.OpenAsync(uri, BrowserLaunchMode.SystemPreferred);
     }

     if (Device.RuntimePlatform == Device.Android)
     {
          await Launcher.OpenAsync(uri);
     }
};

Again, the navigation event is never triggered on iOS when I tap the Adaptive Card _Action.OpenURL_ button.

Steps to Reproduce

1. Point a WebView to an HTML file which instantiates a Direct Line chat bot control to chat with a Microsoft Bot Framework chatbot.
2. Have the chatbot output an Adaptive Card with an _Action.OpenURL_ button on the card,
3. Tap the button to navigate to the URL behind the button.

Expected Behavior

As it does on Android, tapping the button should trigger a navigation event in the WebView. It does not. The navigation event lets us cancel the event and then have it open the URL using the default browser on the device.

Actual Behavior

Nothing happens. Tapping the _Action.OpenURL_ button on the Adaptive Card does not trigger the WebView navigation event. Not only that, it doesn't load the URL in the WebView itself (navigating away from the chatbot's page). Nothing happens at all.

Basic Information

• Version with issue: Xamarin.Forms v4.8.0.1269
• Last known good version: NA
• IDE: Visual Studio 2019 v16.7.2
• Platform Target Frameworks:
  
  
  
  • iOS: 13.6.1
  
  
  • Android: 10
  
  
  • UWP: NA
  
  
• Android Support Library Version: NA
• Nuget Packages:
  
  
  
  • Behaviors.Forms v1.4.0
  
  
  • NETStandard.Library v2.0.3
  
  
  • Xamarin.Essentials v1.5.3.2
  
  
  • Xamarin.Forms v4.8.0.1269
  
  
• Affected Devices:
  
  
  
  • iPhone SE 2nd gen
  
  

[jsuarezruiz]

@torynfarr I don't know if it would be possible but, could you attach a small example where reproduce the issue and debug what happens with the navigation events?

[torynfarr]

@torynfarr I don't know if it would be possible but, could you attach a small example where reproduce the issue and debug what happens with the navigation events?

Unfortunately, I can't share the specific sample as it's an app internal to our company accessing an internal chatbot.

But... even if that wasn't the case, there's quite literally nothing that occurs. The issue is that the navigation event does not occur at all.

If I create a simple HTML file with a hyperlink on it and set that as the source for my WebView, when I tap the URL it triggers the navigation event and properly opens the URL in the default browser. This works both on iOS and Android.

When there's an _Action.OpenURL_ button on an Adaptive Card, tapping the button does nothing on iOS. The navigation event is not triggered (so there's no debug info I can share). On Android, the navigation event occurs... and the URL opens in the default browser as intended.

I have an idea that I'm going to follow-up on today. One possibility is that this issue is due to the version of the Direct Line chat component used by the webpage.

Because we have users who are still using IE11, it was necessary to use the https://cdn.botframework.com/botframework-webchat/master/webchat-es5.js version of the component. This ensured that Adaptive Cards rendered properly on older browsers.

That applies to using the bot on the desktop, but (obviously) it's not something we need to worry about with the mobile app. So... I'm going to point the WebView in the mobile app to a new webpage (dedicated for use by our mobile app) and have that webpage use the latest version of the Direct Line component: https://cdn.botframework.com/botframework-webchat/latest/webchat.js

Will update as soon as that test is finished.

[jsuarezruiz]

Ok, I await your feedback about the Direct Line chat component to try to reproduce the issue.

[EnglishDave]

We are seeing this as well. Its a critical bug for us. Was working in old build that uses XF 3.6.0

[torynfarr]

Ok, I await your feedback about the Direct Line chat component to try to reproduce the issue.

This morning, I setup a local HTML file in my Xamarin.Forms app (in the resources folder of the iOS project) and pointed the WebView to it.

This local HTML file uses the newer https://cdn.botframework.com/botframework-webchat/latest/webchat.js library for the Direct Line chatbot control rather than the webchat-es5.js library.

Unfortunately, it didn't resolve the issue. The _Action.OpenURL_ buttons on Adaptive Cards still don't load and they don't trigger the navigation event.

I guess for my next test, I can try downgrading to XF 3.6.0.

[torynfarr]

Ok, I await your feedback about the Direct Line chat component to try to reproduce the issue.

This morning, I setup a local HTML file in my Xamarin.Forms app (in the resources folder of the iOS project) and pointed the WebView to it.

This local HTML file uses the newer https://cdn.botframework.com/botframework-webchat/latest/webchat.js library for the Direct Line chatbot control rather than the webchat-es5.js library.

Unfortunately, it didn't resolve the issue. The _Action.OpenURL_ buttons on Adaptive Cards still don't load and they don't trigger the navigation event.

I guess for my next test, I can try downgrading to XF 3.6.0.

I downgraded the _Xamarin.Forms_ package to v3.6.0.220655 (lowest 3.6 version available), but the problem persists.

I can try downgrading _Xamarin.Essentials_ package next.

[torynfarr]

Ok, I await your feedback about the Direct Line chat component to try to reproduce the issue.

This morning, I setup a local HTML file in my Xamarin.Forms app (in the resources folder of the iOS project) and pointed the WebView to it.
This local HTML file uses the newer https://cdn.botframework.com/botframework-webchat/latest/webchat.js library for the Direct Line chatbot control rather than the webchat-es5.js library.
Unfortunately, it didn't resolve the issue. The _Action.OpenURL_ buttons on Adaptive Cards still don't load and they don't trigger the navigation event.
I guess for my next test, I can try downgrading to XF 3.6.0.

I downgraded the _Xamarin.Forms_ package to v3.6.0.220655 (lowest 3.6 version available), but the problem persists.

I can try downgrading _Xamarin.Essentials_ package next.

I downgraded _Xamarin.Essentials_ all the way down to v1.0.0. I had to remove my WebView behavior class, as it referenced a handful of namespaces not present in the older package.

Unfortunately, still no impact. With no navigation event overriding and with the oldest Xamarin Essentials, still nothing. The expected behavior here would be that tapping the button would navigate the WebView away from the local HTML file and open the URL behind the button. But... nothing happens.

[EnglishDave]

With our application, I have confirmed that the bug/breaking change occurred between Xamarin Forms 4.3.0.991250 and 4.4.0.991265. Build it with 4.3.x and Card Action.OpenURL works, upgrade to 4.4.x and it doesn't.

We utilize the https://cdn.botframework.com/botframework-webchat/latest/webchat.js library for the chatbot client.

We have worked around the issue by using 'in-text' links instead of 'Buttons with Actions' in the cards. These still seem to work. Luckily, our next feature release will replace the very limited web based client with custom native client, so this whole issue will be moot from that point forward. As a result we have decided is not worth investing too much more time investigating yet another Xamarin bug.

[torynfarr]

With our application, I have confirmed that the bug/breaking change occurred between Xamarin Forms 4.3.0.991250 and 4.4.0.991265. Build it with 4.3.x and Card Action.OpenURL works, upgrade to 4.4.x and it doesn't.

We utilize the https://cdn.botframework.com/botframework-webchat/latest/webchat.js library for the chatbot client.

We have worked around the issue by using 'in-text' links instead of 'Buttons with Actions' in the cards. These still seem to work. Luckily, our next feature release will replace the very limited web based client with custom native client, so this whole issue will be moot from that point forward. As a result we have decided is not worth investing too much more time investigating yet another Xamarin bug.

I was able to reproduce this exactly as you laid it out. I downgraded _Xamarin.Forms_ to v4.3.0.991250. I found that I had to clean and then rebuild, but once I did that... the _Action.OpenURL_ buttons work as they should. So, this is definitely a bug introduced with v4.4.x and up.

The challenge for me now, unfortunately, is that I need the WebView to support the _Cookies_ property. The app reaches out to a resource on the web which requires 2FA to access. Without the instantiating a CookieContainer and assigning it to the _Cookies_ property of the WebView, the authentication will fail. It looks like the _Cookies_ property was introduced in a later version of _Xamarin.Forms_. So... yeah, it's a critical bug for us as well.

[EnglishDave]

@torynfarr You could try using text links instead of buttons in the card. It doesn't look as good but it would be a work around until Xamarin fix the problem. The other option would be to roll out your own native client, which would give you complete control over both the UI and the functionality, however that's a non trivial task (if you do this, I'd drop Adaptive Cards and use Hero Cards instead)

[torynfarr]

@torynfarr You could try using text links instead of buttons in the card. It doesn't look as good but it would be a work around until Xamarin fix the problem. The other option would be to roll out your own native client, which would give you complete control over both the UI and the functionality, however that's a non trivial task (if you do this, I'd drop Adaptive Cards and use Hero Cards instead)

Unfortunately, it's an existing chatbot which is also accessed from a website and in Teams and has 245 Adaptive Cards (not counting the ones which are created in code because they pull in dynamic data). So, changing the output isn't a viable route for us.

The easiest solution for us will probably be to just store the bot's HTML file locally in the resources folder to get rid of the need for cookie support or wait for Microsoft to fix the _Xaramin.Forms_ package.

[torynfarr]

Another option might be to try using the _Xam.Plugin.WebView_ package. I'm starting to look into this now.

[EnglishDave]

Good luck! If we hadn't found a work around my next step would have been to build with the XF source code and step though what was happening to try to debug, hopefully found the issue then create a custom ios renderer. Was also toying with injecting a javascript function to call a C# method to handle the 'action', but that would have meant changing the action to call that function, which would not be possible in your situation..

[torynfarr]

@jsuarezruiz through our testing and input from @EnglishDave, we both confirmed that the issue was introduced with _Xamarin.Forms_ v4.4.x and up. If we downgrade to v4.3.0.991250, the _Action.OpenURL_ buttons work on iOS.

[torynfarr]

Just wanted to say thanks to the Xamarin team at Microsoft for tackling this and being responsive. 👍🏻

[EnglishDave]

Upgrading to XF 4.8.0.1364 breaks text links opening URLs and URIs on Android. Basically the latest XF is now unusable for chatbots using the WebClient and a WebView.

[torynfarr]

Upgrading to XF 4.8.0.1364 breaks text links opening URLs and URIs on Android. Basically the latest XF is now unusable for chatbots using the WebClient and a WebView.

I've confirmed the same with my app. Upgrading to _Xamarin.Forms_ v4.8.0.1364 made it so that the Open URL action buttons on Adaptive Cards no longer function / no longer trigger a navigation event (just like they were behaving on iOS).

[torynfarr]

I've managed to implement a functioning workaround for this issue.

In the Android project of my Xamarin Forms app, I've installed _Xamarin.Forms_ v4.8.0.1629 (currently one version lower than the most up-to-date release). With that, the Open URL action buttons work properly on the Android build of our app.

Then, I isolated the cookie container related code using the Android preprocessor directive (conditional compilation). This was necessary, because the version of _Xamarine.Forms_ I'm installing in the iOS project pre-dates when that capability was added to the library.

Finally, in the iOS project, I've installed _Xamarin.Forms_ v4.3.0.991250. Thankfully, it seems to have its own built-in ability to handle cookies, as our 2FA which relies on storing a cookie does indeed work!

So, with all of that, there's only one thing that doesn't work on either Android or iOS... and that's the in-chat OAuth prompt button. (So not the 2FA prompt to reach the web address where the bot's HTML file is stored, but rather... the in-chat authentication used by one or two of our dialogs for the purpose of accessing MS Graph). Not a big deal... we can just handle this in the bot's code and let the user know that they need to chat with the bot on the website itself, rather than the mobile app, when one of these dialogs is reached.

[PureWeen]

Does it look like this resolves your issue?

https://github.com/xamarin/Xamarin.Forms/pull/12029

You can test the nightly to see if it's fixed there
https://github.com/xamarin/Xamarin.Forms/wiki/Nightly-Builds

[Redth]

Since we haven't heard from you in more than 30 days, we hope this issue is no longer affecting you. If it is, please reopen this issue and provide the requested information so that we can look into it further. Thank you!

[torynfarr]

Since we haven't heard from you in more than 30 days, we hope this issue is no longer affecting you. If it is, please reopen this issue and provide the requested information so that we can look into it further. Thank you!

@Redth @PureWeen

Sorry for the slow reply, I've been swamped with other projects.

Unfortunately, the issue is still present.

I updated the _Xamarin.Forms_ package to version 4.8.1560 and tested opening links. They still do not trigger a navigation event.

I also tested out the latest prerelease version of the package: _Xamarin.Forms_ version 5.0.0.1558-pre3. The issue still occurs.

I'm assuming whatever changes were made in the nightly releases have long since made their way into (at least) the prerelease versions?

If that's not the case, please let me know what specific version of the _Xamarin.Forms_ package I should test.