OWASP O2 Platform Blog

Running Javascript in O2’s IE Automation environment

O2 has quite a good support for Javascript editing and execution. It is able to from handle simple script execution to full two-data-exchange and invocation between O2 and the Browser (in this case IE)

Lets start with a simple script execution.

Open the IE Script Execution script (which can be found on the main O2 Gui at the Security Analysis Tab via the IE  Automation button):

 

The image above shows what happens when the following default script is executed:

panel.clear();
var ie = panel.add_IE().silent(true);ie.open("<a href="http://www.google.com">http://www.google.com</a>");

//O2File:WatiN_IE_ExtensionMethods.cs
//using O2.XRules.Database.Utils.O2
//O2Ref:WatiN.Core.1x.dll

To make sure that all is ok, lets run a simple test (in this case a simple Javascript alert)

ie.open("<a href="http://www.google.com">http://www.google.com</a>");
ie.invokeEval("alert('hello')");

If this doesn’t work, the most likely reason is because the site you are trying to open is not on IE’s trusted site list.

To address this issue you have three choices: 

  1. go to IE and add it here
  2. use this O2 Script: O2 Util: Add sites to IE trusted zone (Note that at the moment the IE instance running inside O2 is not picking up the zone change, so you will need to restart O2)
  3. run the following script in the current O2 script environment, or on another script (also needs O2 restart)
    "yahoo.com".makeDomainTrusted("uk");   // will add the domain <a href="http://uk.yahoo.com">http://uk.yahoo.com</a> to IE's trusted zone
    

As the name says the ie.invokeEval method will invoke the provided script via an javasript eval command.

The javascript executed can be as complex has you want. Here are a couple simple examples:

Swapping DWR’s logo with O2’s Logo

ie.open("<a href="http://www.directwebremoting.org/">http://www.directwebremoting.org/</a>");
ie.invokeEval("document.images[0].src='http://o2platform.googlecode.com/svn/trunk/O2_Scripts/_DataFiles/_Images/O2_Logo.gif';");

 

Showing up a popup alert with the user’s submited search (the return false prevents the form from being submited)

ie.open("<a href="http://www.google.com/">http://www.google.com/</a>");
ie.invokeEval("document.forms[0].onsubmit = function() {alert('you submited the query: ' + document.forms[0].q.value);return false;};");


Creating a new javascript function and invoking it

ie.invokeEval("myFunction = function() { alert('this is a new function')} ; myFunction();");   // invoking it on the same eval
//ie.invokeEval("myFunction();");   // can also be invoked here


Invoking the new javascript function using O2’s InvokeScript method

There is another way to invoke javascript functions which is to the use the ie.invokeScript O2 method (instead of using ie.InvokeEval)

ie.invokeEval("myFunction = function() { alert('this is a new function')}");
ie.invokeScript("myFunction");

 

Passing Dynamic values from C# to Javascript (i.e. invoking javascript functions with dynamic data)

The ie.invokeScript method can be used to invoke javascript methods that expect parameters

ie.invokeEval("myFunction = function(name) { alert('hello ' + name)}");
ie.invokeScript("myFunction", "john");
ie.invokeEval("myFunction = function(name1, name2) { alert('hello ' + name1 + ' and ' + name2)}");
ie.invokeScript("myFunction", "john", "paul");


Getting the return value of a function

 The most powerful capability of the ie.invokeScript function is that it can be used to access the return value of a function (with the added bonus that C# types will be translated into javascript types).

For example this script will return 42

ie.invokeEval("myFunction = function(a, b) { return a+b;}");
return ie.invokeScript("myFunction", 10, 32);

and this one will return 1032

ie.invokeEval("myFunction = function(a, b) { return a+b;}");
return ie.invokeScript("myFunction", "10", "32");


Invoking C# method from Javascript

For really advanced analysis and injection you probably will want to have javascript functions/scripts that are able to callback into an O2/C# function.

For example the following code will inject a javascript function into the current page that can be used to send a message to the O2 Log Viewer:

To undestand how this happens, here are the relevant O2 C# functions (that are part of the WatiN_IE_ExtensionMethods.cs script)

        public static WatiN_IE injectJavascriptFunctions(this WatiN_IE ie)
        {
            if (ie.WebBrowser.isNull())
                "in InjectJavascriptFunctions, ie.WebBrowser was null".error();
            else
            {
                if (ie.WebBrowser.ObjectForScripting.isNull())
                    ie.WebBrowser.ObjectForScripting = new WatiN_IE.ToCSharp();
                   
                "Injecting Javascript Hooks * Functions for page: {0}".debug(ie.url());
                ie.eval("var o2Log = function(message) { window.external.write(message) };");
                ie.invokeScript("o2Log","Test from Javascript (via toCSharp(message) )");
                "Injection complete".info();
            }
            return ie;
        }
[System.Runtime.InteropServices.ComVisible(true)]
        public class ToCSharp
        {
           
            public void write(string message)
            {
                "[IE to ToCSharp] : {0}".info(message);
            }
           
            public string ping(string message)
            {
                "[ping from IE] : {0}".info(message);
                return "pong: " + message;
            }
            ....
        }

March 8, 2011 - Posted by | IE Automation, WatiN

2 Comments »

  1. […] Javascript manipulation and debug,  built of top of O2 Javascript support (see Running Javascript in O2′s IE Automation environment for more details on how to execute javascript inside a browser) , here is an O2 module that really […]

    Pingback by O2 Script: Util – Javascript Object viewer « O2Platform.com for Developers | March 31, 2011 | Reply


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: