How to get HtmlUnit to update page after javascript has finished

Question

I am trying to load the contents of a div which changes when a listener is triggered.

The java code I currently have is:

public static void main(String arg[]) throws IOException{
    String url = "http://localhost/chartsTest/test.html";
    WebClient wc = new WebClient();

    HtmlPage p = null;
    try {
        System.out.println("Attempting to load page: " + url);
        p = wc.getPage(url);
        System.out.println("Sucsess!");
    } catch (Exception e) {
        System.err.println("Failed to get page");
    }

    JavaScriptJobManager m = p.getEnclosingWindow().getJobManager();
    int c;
    while ((c = m.getJobCount()) > 0){
        System.out.println("Jobs: " + c);
        try {
            Thread.sleep(1000);
        } catch (InterruptedException e) {}
    }

    div = p.getHtmlElementById("test");
    content = div.asText();
    System.out.println(content);

    wc.close();
}

and my test.html page (which loads a google chart) is:

<html>
<head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>

    <script type="text/javascript">
        google.load("visualization", '1', {packages:['corechart']});
        google.setOnLoadCallback(drawChart);
        function drawChart() {

            // var query = new google.visualization.Query('simpleexample?tq=select name,population');
            // query.send(handleSimpleDsResponse);
            handleSimpleDsResponse(true);

            function handleSimpleDsResponse(response) {

                // var data = response.getDataTable();
                var data = google.visualization.arrayToDataTable([
                    ['Year', 'Sales', 'Expenses'],
                    ['2013',  1000,      400],
                    ['2014',  1170,      460],
                    ['2015',  660,       1120],
                    ['2016',  1030,      540]
                ]);


                var chart_div = document.getElementById('chart_div');
                var chart_data = document.getElementById('chart_data');
                var test = document.getElementById('test');
                var chart = new google.visualization.AreaChart(chart_div);

                // Wait for the chart to finish drawing before calling the getImageURI() method.
                google.visualization.events.addListener(chart, 'ready', function () {
                    chart_div.innerHTML = '<img src="' + chart.getImageURI() + '">';
                    chart_data.innerHTML = chart.getImageURI();
                    test.innerHTML = "after";
                });

                chart.draw(data);
            }

        }
    </script>
</head>

<body>

    <div id="test">before</div>

    <div id='chart_div'></div>

    <div id="chart_data"></div>

</body>
</html>

but when I print the div it always equals before and not after . How can I get the value for after the chart has finished loading?

Answer 1

This is a bug of handling Promise.resolve() , and it has been fixed in SVN .

Please use new WebClient(BrowserVersion.CHROME) , with the latest build or snapshot.

There is no need to wait() , as it is not AJAX-based.

How to get HtmlUnit to update page after javascript has finished

Question

1 answers

solution1
0 ACCPTED 2015-10-16 14:54:13

How to get HtmlUnit to update page after javascript has finished

Question

1 answers

solution1 0 ACCPTED 2015-10-16 14:54:13

solution1
0 ACCPTED 2015-10-16 14:54:13