Powershell: Using jQuery through InternetExplorer.

Question

I followed this article, explaining how to spice up an Internet Explorer COM-Object with jQuery. While the author used Python, I want to do something similar in Powershell.

Right now I have this code:

function addJQuery ($browser) {
    $url="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"

    $document = $browser.document
    $window = $document.parentWindow
    $head = @($document.getElementsByTagName("head"))[0]
    $script = $document.createElement("script")
    $script.type = "text/javascript"
    $script.src = $url
    $head.appendChild($script)
    while (!$window.jQuery) {
        sleep -milliseconds 100
    }
    return $window.jQuery
}

$ie = New-Object -comobject InternetExplorer.Application
$ie.visible = $true
$ie.Navigate("https://some.site.com")
while ($ie.busy) {start-sleep -milliseconds 500}
$j = addJQuery $ie

With Fiddler and via the document.scripts collection I verified that the file gets downloaded. However, the script sleeps forever and when I try to output $window.jQuery it prints nothing in the Powershell ISE console.

The Script is nevertheless correctly loaded, since jQuery-Functions can be called from the browser's console or via execScript().

It seems the problem is that the DOM-representation available via $ie.document isn't updated when DOM-changes are made via JavaScript. But shouldn't the Internet Explorer COM-Object behave the same way in Powershell as it does in Python?

Answer 1

For some reason I needed to make the browser window visible for mine to even remotely work - without it the Navigate method was unbearably slow and the $ie.Busy property would never seem to to return anything but True. You shouldn't have to do that, but oh well.

$ie.Visible = $true

Inspecting the $ie.Document.Scripts collection, you can verify the jQuery file has been loaded, but I couldn't seem to make the reference $ie.Document.parentWindow work - which also means I can't seem to get at the jQuery property either. It is a known property, but it doesn't seem to be populated with anything useful as it is passed around in PowerShell.

Answer 2

In your while loop, the expression (!$window.jQuery) always returns true because $window is a ComObject and COM Objects are not expandos like JavaScript objects, so even if window.jQuery exists in JavaScript, it won't automatically become visible on the $window object in PowerShell.

I really couldn't find a workaround to make jQuery objects available in powershell and I'm also interested to know if there is a way to do that. See this and this question I created on that.

But I figured this trick to run javascript/jquery on the web page and receive some results back from the page in PowerShell:

# some web page with jQuery in it
$url = "http://jquery.com/"

# Use this function to run JavaScript on a web page. Your $jsCommand can
# return a value which will be returned by this function unless $global
# switch is specified in which case $jsCommand will be executed in global
# scope and cannot return a value. If you received error 80020101 it means
# you need to fix your JavaScript code.
Function ExecJavaScript($ie, $jsCommand, [switch]$global)
{
    if (!$global) {
        $jsCommand = "document.body.setAttribute('PSResult', (function(){$jsCommand})());"
    }
    $document = $ie.document
    $window = $document.parentWindow
    $window.execScript($jsCommand, 'javascript') | Out-Null
    if (!$global) {
        return $document.body.getAttribute('PSResult')
    }
}

Function CheckJQueryExists
{
    $result = ExecJavaScript $ie 'return window.hasOwnProperty("$");'
    return ($result -eq $true)
}

$ie = New-Object -COM InternetExplorer.Application -Property @{
    Navigate = $url
    Visible = $false
}
do { Start-Sleep -m 100 } while ( $ie.ReadyState -ne 4 )

$jQueryExists = CheckJQueryExists $ie
echo "jQuery exists? $jQueryExists"

# make a jQuery call
ExecJavaScript $ie @'
    // this is JS code, remember to use semicolons
    var content = $('#home-content');
    return content.text();
'@

# Quit and dispose IE COM
$ie.Quit()
[System.Runtime.Interopservices.Marshal]::ReleaseComObject($ie) | out-null
Remove-Variable ie

Answer 3

You may look into the source code of Invoke-JQuery. I've tried it and I was able to use jquery to manipuate the page, though I've not modified the script to add jquery.

Answer 4

I wish I read this last year. I was also trying to integrate or "inject" JQuery in a Windows Scripting Host Environment. Also tried Powershell. None worked. I did however succeed in using this object "InternetExplorer.Application" with IE7, IE8 and now IE9.

try{
    var ie = new ActiveXObject("InternetExplorer.Application");
    ie.navigate(url);
    ie.visible = false;
    ie.left=800; ie.top=0; ie.height=600; ie.width=900; //use this with ie.visible = true;
    do{} while (ie.busy);
}
catch (e){
    console.log("Exception thrown: "+e)
}
finally {
    IE_waitLoad(ie);
    var webpage=ie.document.body.innerHTML ;
    $("#cache").append($(webpage));
    ie.quit();
}

After the above, JQuery is your friend. Again!!!

I found this nice "wait" function somewhere on the web:

function IE_waitLoad(pIE) {
    var stat, dstart;
    stat = 0;
    while(true){
        if(stat == 0) {
            if(!pIE.Busy){
                if(pIE.Document.readyState == "complete") {
                    dstart = new Date().getTime();
                    stat = 1;
                }
            }
        }else{
            if(!pIE.Busy && pIE.Document.readyState == "complete") {
                if(new Date().getTime() >= dstart + 1000){
                    break;
                }
            }else{
                stat = 0;
            }
        }
        sleep(1000)
    }
}

The navigate function has all these optional parameters

// ie.navigate(url,0x1000);
navOpenInNewWindow = 0x1,
navNoHistory = 0x2,
navNoReadFromCache = 0x4,
navNoWriteToCache = 0x8,
navAllowAutosearch = 0x10,
navBrowserBar = 0x20,
navHyperlink = 0x40,
navEnforceRestricted = 0x80,
navNewWindowsManaged = 0x0100,
navUntrustedForDownload = 0x0200,
navTrustedForActiveX = 0x0400,
navOpenInNewTab = 0x0800,
navOpenInBackgroundTab = 0x1000,
navKeepWordWheelText = 0x2000,
navVirtualTab = 0x4000

Answer 5

Even though I also couldn't figure a way to work directly with JQuery as an object, the below is as close as I could get using Posh (I had to put the end of the first here-string in the same line in order to get the code formatting working):

function addJQuery ($browser) { 
#helper function to highlight text 
$func=@"
function SelectText(element) { 
    var text = document.getElementById(element); 
    var range = document.body.createTextRange(); 
    range.moveToElementText(text); 
    range.select(); 
}"@ #needs to be at the beginning of the next line
$url='http://code.jquery.com/jquery-1.4.2.min.js'
$document = $browser.document 
$window = $document.parentWindow 
$head = @($document.getElementsByTagName("head"))[0] 
$script = $document.createElement('script') 
$script.type = 'text/javascript'
$script.src = $url 
$head.appendChild($script) | Out-Null
#inject helper function
$script = $document.createElement('script') 
$script.type = 'text/javascript'
$script.text = $func 
$head.appendChild($script) | Out-Null}#end function
$ie = new-object -com internetexplorer.application
$ie.visible = $true
$ie.navigate2("http://www.example.com")
# Wait for page load
while($ie.busy) {start-sleep 1}
# Inject jQuery
addJQuery $ie
#Test whether JQuery is usable
$code1=@"
    `$('a').hide();
"@

$code2=@"
var str=`$('p:first').text();`$('#myResult').html(str);
"@

#add addtional div to store results
$div="<div id='myResult'>"
$ie.Document.body.innerHTML += $div
#hide anchor tag
$ie.document.parentWindow.execScript("$code1","javascript")
#change innerhtml of div
$ie.document.parentWindow.execScript("$code2","javascript")
#retrieve the value
$result = $ie.document.getElementById("myResult") 
$result.innerHtml
#call SelectText function
$ie.document.parentWindow.execScript("SelectText('myResult')","javascript")