Friday, 15 March 2013

Writing an IE Automation script to login into UK’s Wifi (using O2 Platform’s WatiN ExtensionMethods)

Here is an example of how to write an O2 Platform IE Automation script that will login a user into a wifi connection that needs a username and password.

Open the IE Script tool which you can get from this stand-alone version (see Packaging an O2 Platform Script as a stand alone tool (in this case the WatiN based ‘IE Script’ tool) )

Or from the main O2 Platform gui:

image

When opened it, should look like this:

image

Leave the first line and open the default wifi connection page (see at the end of this post for the scripts created in a format you can copy and paste):

image

Take a look at the HTML links of this page (I commented out the ie.open since the browser session is persisted on multiple executions):

image

Here is how to get a specific link (note the multiple variations caused by the fact that the Get Online link has no ID and a new line in its text:

image

Next step is to click on the link:

image

Next get the links for this page and look at the details of the link we want to click next:

image

Which has the same issue of a new line at the beginning and no ID

image

Let’s click on that Link:

image

And look at the fields in this page:

image

In there find the password one

image

Note that we can edit this field and see its changes in real-time:

image  image

We can now get the reference to the password field:

image

and change its value programmatically:

image

Now the email field is going to be a little more complicated since it wasn't picked up by the fields WatiN Extension Method.

So take a look at the .elements() :

image

And get a programmatic reference to it:

image

Get its outerHtml (at this stage I’m trying to figure out the most efficient way to populate it)

image

Here are the element attributes:

image

Btw: taking a look at the parent’s element outerHtml we can see that this input element is not properly terminated:

image

Ok, here is one way to populate the Email field (by directly changing/replacing the outerHtml)

image

And since they are using jQuery on this site, we can use also use jQuery to populate that field:

image

Top tip: you can also get javascript objects into your C# script. For example here is how to get the value of the email we just populated:

image

The document.location object

image

The window.screen object

image

A jQuery selector:

image

The body html (as seen by jQuery)

image

ok, moving back to our login page….

Now that we can populate data into both input fields, we need to find the button:

image

and click on it:

image

Now that its working let’s package the whole script into a lamdba method:

image

Note: since we have jQuery, we could use it to add an attribute to the link, and then get that link from the C# REPL (instead of doing that lamda search):

image

Next step is to ask the user for the account details and use it to login:

image

Now, when you click execute you will get a popup you can use to enter the email and password:

image

And if all goes good you will be logged in, and google should open up:

image

Finally, we can make this into a stand alone script:

image

which will open the IE/WatiN control in a popup window:

image and  image

and even package it as a stand-alone exe:

image

which can then be executed directly:

image

(note that in this case there are no extra folders since the embedded dlls are extracted directly into memory and there are no scripts to dynamically compile)

image


Scripts used in this blog:

Open web page
var ie = "ie_aenoN".o2Cache<WatiN_IE>(()=> panel.clear().add_IE()).silent(false);  // ie random value for o2cache makes this object to unique amongst multiple instances of this control
ie.open("https://service.thecloud.net/service-platform/");

return "done";              

//O2File:WatiN_IE_ExtensionMethods.cs 
//O2Ref:WatiN.Core.1x.dll
//O2Tag_DontAddExtraO2Files;            

Multiple ways to get the GetOnline link:
var ie = "ie_aenoN".o2Cache<WatiN_IE>(()=> panel.clear().add_IE()).silent(false); 
//ie.open("https://service.thecloud.net/service-platform/");
var getOnlineLink = ie.link(@"
Get Online");
return getOnlineLink.text();

//there also work;
return ie.links()[2].text();
return ie.links().third().text();
return ie.links().where((link)=> link.text().contains("Get Online")).first();
 

//O2File:WatiN_IE_ExtensionMethods.cs 
//O2Ref:WatiN.Core.1x.dll
//O2Tag_DontAddExtraO2Files;            

Populating the email field using jQuery:
var ie = "ie_aenoN".o2Cache<WatiN_IE>(()=> panel.clear().add_IE()).silent(false); 
//ie.open("https://service.thecloud.net/service-platform/");
//var getOnlineLink = ie.links().where((link)=> link.text().contains("Get Online")).first();
//getOnlineLink.click();
//ie.link(@"
//Free Cloud WiFi").click();
ie.eval("$('#username').val('AAAAAanother@email.com')");
return ie.getJsVariable("$('#username').val()");
return "done"; 

//O2File:WatiN_IE_ExtensionMethods.cs 
//O2Ref:WatiN.Core.1x.dll
//O2Tag_DontAddExtraO2Files;            

Login script as Lambda method
var ie = "ie_aenoN".o2Cache<WatiN_IE>(()=> panel.clear().add_IE()).silent(false); 

Action<string,string> loginIntoTheCloud = 
    (email, password)=>
        {        
            ie.open("https://service.thecloud.net/service-platform/");
            ie.links()
              .where((link)=> link.text().contains("Get Online")).first().click();
            ie.links()
              .where((link)=> link.text().contains("Free Cloud WiFi")).first().click();
            ie.link(@"").click();

            ie.eval("$('#username').val('{0}')".format(email));
            ie.field("password").value(password);
            ie.buttons().first().click();
        };

loginIntoTheCloud("another@email.com", "password");
return "done";
//O2File:WatiN_IE_ExtensionMethods.cs 
//O2Ref:WatiN.Core.1x.dll
//O2Tag_DontAddExtraO2Files;            

Adding an ID to an element using jQuery:
var ie = "ie_aenoN".o2Cache<WatiN_IE>(()=> panel.clear().add_IE()).silent(false); 

ie.open("https://service.thecloud.net/service-platform/");
ie.eval("$(\"a :contains('Online')\").first().parent().attr('id','myLink')");
return ie.link("myLink");

Full script with login and redirect to google:
var ie = "ie_aenoN".o2Cache<WatiN_IE>(()=> panel.clear().add_IE()).silent(false); 

Action<string,string> loginIntoTheCloud = 
    (email, password)=>
        {        
            ie.open("https://service.thecloud.net/service-platform/");
            ie.links()
              .where((link)=> link.text().contains("Get Online")).first().click();
            ie.links()
              .where((link)=> link.text().contains("Free Cloud WiFi")).first().click();
            ie.link(@"").click();

            ie.eval("$('#username').val('{0}')".format(email));
            ie.field("password").value(password);
            ie.buttons().first().click();
        };

var credentials =  ie.askUserForUsernameAndPassword();

loginIntoTheCloud(credentials.UserName, credentials.Password);
ie.waitForComplete();
ie.open("http://www.google.com");

//O2File:WatiN_IE_ExtensionMethods.cs 
//O2Ref:WatiN.Core.1x.dll
//O2Tag_DontAddExtraO2Files;            

Final version of the script:
//var ie = "ie_aenoN".o2Cache<WatiN_IE>(()=> panel.clear().add_IE()).silent(false); 
var ie = "Util - Login into the cloud Wifi".popupWindow()
                                           .add_IE();
                                           
Action<string,string> loginIntoTheCloud = 
    (email, password)=>
        {        
            ie.open("https://service.thecloud.net/service-platform/");
            ie.links()
              .where((link)=> link.text().contains("Get Online")).first().click();
            ie.links()
              .where((link)=> link.text().contains("Free Cloud WiFi")).first().click();
            ie.link(@"").click();

            ie.eval("$('#username').val('{0}')".format(email));
            ie.field("password").value(password);
            ie.buttons().first().click();
        };

var credentials =  ie.askUserForUsernameAndPassword();

loginIntoTheCloud(credentials.UserName, credentials.Password);
ie.waitForComplete();
ie.open("http://www.google.com");

//O2File:WatiN_IE_ExtensionMethods.cs 
//O2Ref:WatiN.Core.1x.dll
//O2Tag_DontAddExtraO2Files;

Post a Comment