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:



When opened it, should look like this:



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):



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):



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:



Next step is to click on the link:



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



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



Let’s click on that Link:



And look at the fields in this page:



In there find the password one



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

 

We can now get the reference to the password field:



and change its value programmatically:



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() :



And get a programmatic reference to it:



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



Here are the element attributes:



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



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



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



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:



The document.location object



The window.screen object



A jQuery selector:



The body html (as seen by jQuery)



ok, moving back to our login page….

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



and click on it:



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



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):



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



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



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



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



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

and 

and even package it as a stand-alone exe:



which can then be executed directly:



(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)




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;