Blank page in WebView when using GoBack

Bug Reports
1

When using GoBack on a Webview, a white blank page is presented when there are no more pages in the history, even when combined with WhileCanGoBack. The bug is experienced on iOS 10.3.3 in both preview and debug build.

<WhileCanGoBack NavigationContext="clientWebView">
    <Clicked>
        <GoBack TargetNode="clientWebView" />
    </Clicked>
</WhileCanGoBack>
2

Could you please post a complete reproduction that exhibits the problem? Are you by chance using an Observable for the Url property on the WebView?

3

Hi Again!

Here is an example:

<App>
   <ClientPanel>
      <DockPanel>
         <JavaScript>
            var Observable = require('FuseJS/Observable');
            var url = new Observable('http://www.fusetools.com');
            module.exports = {
            url : url
            }
         </JavaScript>
         <NativeViewHost>
            <WebView Url="{url}" ux:Name="clientWebView">
            </WebView>
         </NativeViewHost>
         <Panel Dock="Bottom">
            <Button Text="GoBack" Height="40" Background="Black">
               <WhileCanGoBack NavigationContext="clientWebView">
                  <Clicked>
                     <GoBack TargetNode="clientWebView"/>
                  </Clicked>
               </WhileCanGoBack>
            </Button>
         </Panel>
      </DockPanel>
   </ClientPanel>
</App>
4

Right, Observable it is.

That’s a known issue which we haven’t had the time to sort out yet. The cause of this is that an Observable string is by default created as "" and only gets the value you assign it after that. So the WebView still thinks it can go back, when you would correctly expect it to know that it can’t.

For a workaround, I’d suggest something like this:

<WhileCanGoBack NavigationContext="clientWebView">
    <!-- make it match the initial value of the observable url -->
    <WhileString Value="{url}" Equals="http://www.fusetools.com" Invert="true">
        <Clicked>
            <GoBack TargetNode="clientWebView"/>
        </Clicked>
    </WhileString>
</WhileCanGoBack>