WebView text too small cannot make bigger XForms (4.8) - xamarin

Question

wondering if anyone can help, the text on the webView is too small, I have an HTML that I have NO control over.
How can I increase the size?
I have tried Xamarin forms: Webview content default size is too small
but did not work for me as the page does not load at all.
Is this a bug?
Am I missing something?
Any suggestions
<WebView VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand">
<WebView.Source>
<HtmlWebViewSource
Html="{Binding HtmlSource}" />
</WebView.Source>
</WebView>
using Foundation;
using WebKit;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;
[assembly: ExportRenderer(typeof(WebView), typeof(MyWebViewRenderer))]
namespace MyCompany
{
public class MyWebViewRenderer : ViewRenderer<WebView, WKWebView>
{
WKWebView wkWebView;
protected override void OnElementChanged(ElementChangedEventArgs<WebView> e)
{
base.OnElementChanged(e);
if (Control != null) return;
var config = new WKWebViewConfiguration();
wkWebView = new WKWebView(Frame, config) {NavigationDelegate = new MyNavigationDelegate()};
SetNativeControl(wkWebView);
}
}
}
public class MyNavigationDelegate : WKNavigationDelegate
{
public override void DidFinishNavigation(WKWebView webView, WKNavigation navigation)
{
string fontSize = "200%";
string stringHtml = string.Format("document.getElementsByTagName('body')[0].style.webkitTextSizeAdjust= '{0}'", fontSize);
WKJavascriptEvaluationResult handler = (NSObject result, NSError err) =>
{
if (err != null)
{
System.Console.WriteLine(err);
}
if (result != null)
{
System.Console.WriteLine(result);
}
};
webView.EvaluateJavaScript(stringHtml, handler);
}
}

Answer 1

The viewport element on a page
<meta name="viewport" content="width=device-width, initial-scale=1.0">
can be set with a renderer (omitting initial-scale):
using Foundation;
using WebKit;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;
using MyNamespace.iOS.Renderers;
[assembly: ExportRenderer(typeof(WebView), typeof(MyWebViewRenderer))]
namespace MyNamespace.iOS.Renderers
{
//'WebViewRenderer' is obsolete: 'WebViewRenderer is obsolete as of 4.4.0. Please use the WkWebViewRenderer instead'
//WkWebViewRenderer inherits from WKWebView
public class MyWebViewRenderer : WkWebViewRenderer
{
protected override void OnElementChanged(VisualElementChangedEventArgs e)
{
base.OnElementChanged(e);
if (e.NewElement != null)
{
WebView webView = Element as WebView;
webView.VerticalOptions = LayoutOptions.FillAndExpand;
string jScript = #"var meta = document.createElement('meta'); " +
"meta.setAttribute('name', 'viewport');" +
"meta.setAttribute('content', 'width=device-width');" +
"document.getElementsByTagName('head')[0].appendChild(meta);";
//WKUserScriptInjectionTime should be AtDocumentEnd
var userScript = new WKUserScript((NSString)jScript, WKUserScriptInjectionTime.AtDocumentEnd, true);
WKWebView wkWebView = this;
WKWebViewConfiguration wkWebViewConfig = wkWebView.Configuration;
wkWebViewConfig.UserContentController.AddUserScript(userScript);
}
}
}
}
See also "Using the viewport meta tag to control layout on mobile browsers" for a closer description on screen size, pixel scale, device orientation and zoom.
Note:
The meta tag seems to be set as follows in Safari in an iPad/iPhone simulator:
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">