UIWebView's content height returns wrong value while using mathjax

Question

I am using mathjax for displaying the mathematical expressions on UIWebView. So i want to change the UIWebView height dynamically. For that , i have used

CGFloat newHeight = [[self.questionWebView stringByEvaluatingJavaScriptFromString:@"document.documentElement.scrollHeight;"] floatValue];

in webViewDidFinishLoad: delegate method.

Here my problem is if i am using normal expression the UIWebView height returns correct value as like in the following image,

enter image description here

if i enter the expression which contains /,(,) it will give the wrong height as like in the following image

enter image description here

 NSString *html = [NSString stringWithFormat:@"<html><head><title>Untitled</title><meta http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\" /><meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\" /><script type=\"text/x-mathjax-config\">MathJax.Hub.Config({extensions: [\"tex2jax.js\"],jax: [\"input/TeX\",\"output/HTML-CSS\"],tex2jax: {inlineMath: [[\"$\",\"$\"],[\"\\(\",\"\\)\"]]}});</script><script type=\"text/javascript\" src=\"../MathJax.js?config=AM_HTMLorMML-full\"></script></head><style>.Question {font-family:'Times New Roman',arial;font-weight:normal;font-size:12px;color:#323232;}</style><body><table cellpadding=\"0\" cellspacing=\"0\" border=\"0\" class=\"Question\" align=\"left\" width=\"260\" height=\"40\"><tr><td> `x + 3 = 2` </td></tr></div></body></html>"];

[self writeStringToFile:tempDir fileName:@"test1.html" pathName:filePath content:html];

NSURLRequest* req = [[NSURLRequest alloc] initWithURL:url];

[self.myWebView loadRequest:req];

In writeStringToFile: method,

-(void)writeStringToFile:(NSString *)dir fileName:(NSString *)strFileName pathName:(NSString *)strPath content:(NSString *)strContent{

    NSString *path = [dir stringByAppendingPathComponent:strFileName];
    NSString *foo0 = @"<html><head><meta name='viewport' content='initial-scale=1.0;maximum-scale=100.0;user-scalable=1'/>"
    "<script type='text/javascript' src='";
    NSString *foo1 = @"?config=AM_HTMLorMML-full'></script>"
    "</head>"
    "<body>";
    NSString *foo2 = @"</body></html>";
    NSString *fooFinal = [NSString stringWithFormat:@"%@%@%@%@%@",foo0,strPath,foo1,strContent,foo2];

    [fooFinal writeToFile:path atomically:YES encoding:NSUTF8StringEncoding error:nil];
}

How to get the exact height?

Thanks in advance!

Maybe you could also post your code on how you load the web view. — Valent Richie, May 22 '13 at 06:58

score 3 · Answer 1 · answered May 22 '13 at 21:09

The problem is that MathJax takes some time to perform its actions, and you are getting the new height before MathJax has typeset the mathematics (i.e., when it is still just a line of text). You will have to synchronize your new height with the actions of MathJax. I don't know anything about UIWebView programming, but you can have MathJax tell you about when it is finished with its typesetting by including

<script type="text/x-mathjax-config">
  MathJax.Hub.Queue(function () {alert("done")});
</script>

in the HTML somewhere before the script that loads MathJax.js itself. Of course, you would need to replace alert("done") with whatever action is required to communicate back to the code running your UIWebView (that's the part I don't know). Can you detect events or changes to values inside the UIWebView from outside? If so, that is what you would do in the function that is queued, and your outside code would need to wait for that action before it changed the height.

Not personally, but [this post](http://stackoverflow.com/a/1662762/502334) describes one method (be sure to read the other answers as well). Also, there is [documentation from Apple](https://developer.apple.com/library/mac/#documentation/AppleApplications/Conceptual/SafariJSProgTopics/Tasks/ObjCFromJavaScript.html) on the topic. — Davide Cervone, May 23 '13 at 10:03

score 2 · Accepted Answer · answered May 23 '13 at 12:10

Finally after a long research, i have found the solution with the help of @Davide Cervone answer and the sample https://github.com/dannywartnaby/KPWebViewInterceptor,

Just added the objective-c method call in .html file

<script type="text/x-mathjax-config">
  MathJax.Hub.Queue(function myFunction() {
                          objc_msgsend('myFunction');
                          });
</script>

in.js file

var KP_INTERCEPTOR_INVOCATION_COMMAND = "invoke"
var KP_INTERCEPTOR_SEPERATOR = ":"
function objc_msgsend() {
    var selector = arguments[0];
    var invocation = selector;

    if ( arguments.length > 1 ) {

        for( var i = 1; i < arguments.length; i++ ) {
            invocation = invocation + KP_INTERCEPTOR_SEPERATOR + arguments[i];
        }
    }

    window.location = KP_INTERCEPTOR_INVOCATION_COMMAND + KP_INTERCEPTOR_SEPERATOR + invocation;
}

in webView Delegate

- (BOOL)webView:(UIWebView *)source shouldStartLoadWithRequest:(NSURLRequest *)request  navigationType:(UIWebViewNavigationType)navigationType {

    if([[[request URL] absoluteString] hasPrefix:@"invoke"]) {
        [self myFunction];
        return NO;
    }
    return YES;
}

Does it actually work? I use the same callback, calculate height with -sizeThatFits:(CGSize)size and always get wrong values ( +-30 pts wrong ). — Dennis Pashkov, Mar 07 '14 at 09:32

score -1 · Answer 3 · answered May 22 '13 at 06:04

-1

I usually use the height of the scrollView contentSize of the web view after it is finished loading:

- (void)webViewDidFinishLoad:(UIWebView *)aWebView {
    CGFloat newHeight = aWebView.scrollView.contentSize.height;
}

Try that and see if it returns the correct height for you.

answered May 22 '13 at 06:04

Valent Richie

5,226
1
20
21

i have tried `CGSize mWebViewTextSize = [webView sizeThatFits:CGSizeMake(1.0f, 1.0f)];` and `CGFloat newHeight = [[webView stringByEvaluatingJavaScriptFromString:@"document.body.offsetHeight;"] floatValue];` too – Venk May 22 '13 at 06:07
If you are entering other normal content that span multiple lines, will it return the correct result? I just want to see if the issue is caused by the content or whether the height is assigned correctly to the webview. – Valent Richie May 22 '13 at 06:15
yes, if i enter the normal contant with multiple lines will give the correct height... – Venk May 22 '13 at 06:22

UIWebView's content height returns wrong value while using mathjax

3 Answers3