I'm new to node, and looking to extract javascript info from the following example page:
contrived.html:
<html>
<head>
<title>
This is a contrived example
</title>
<script type="text/javascript">
var filenames = new Array()
filenames[filenames.length] = "http://domainwhatever.s3.amazonaws.com/780BONNYVILLECOLDLAKECHRYSLER/4431716.jpg";
filenames[filenames.length] = "http://domainwhatever.s3.amazonaws.com/780BONNYVILLECOLDLAKECHRYSLER/4431716_1.jpg";
filenames[filenames.length] = "http://domainwhatever.s3.amazonaws.com/780BONNYVILLECOLDLAKECHRYSLER/4431716_2.jpg";
filenames[filenames.length] = "http://domainwhatever.s3.amazonaws.com/780BONNYVILLECOLDLAKECHRYSLER/4431716_3.jpg";
filenames[filenames.length] = "http://domainwhatever.s3.amazonaws.com/780BONNYVILLECOLDLAKECHRYSLER/4431716_4.jpg";
function pixplosion_Content()
{
var eElement = document.getElementById('idLoading');
if( eElement ) eElement.style.display = 'none';
return "<pixplosion test=\"test\" flashGasket=\"http://www.realelivepeople.com/pixplosion/assets/flashGasket.swf?contentPath=\" ytBridge=\"/images/image.php?pixplosion=ytbridge\"><tab test=\"test\" label=\"Photos (%1)\" icon=\"Image\" autoIterate=\"false\" ><tab test=\"test\" label=\"Vehicle Photos (%1)\" icon=\"\" autoIterate=\"true\" startFocused=\"true\" >
<image>http://s3.domainwhatever_2.com/vehicles/photos/3726/1300025.jpg</image>
<image>http://s3.domainwhatever_2.com/vehicles/photos/3726/1300025/35102537.jpg</image>
<image>http://s3.domainwhatever_2.com/vehicles/photos/3726/1300025/35102538.jpg</image>
<image>http://s3.domainwhatever_2.com/vehicles/photos/3726/1300025/35102539.jpg</image>
<image>http://s3.domainwhatever_2.com/vehicles/photos/3726/1300025/35102540.jpg</image>
<image>http://s3.domainwhatever_2.com/vehicles/photos/3726/1300025/35102541.jpg</image>
<image>http://s3.domainwhatever_2.com/vehicles/photos/3726/1300025/35102542.jpg</image>
<image>http://s3.domainwhatever_2.com/vehicles/photos/3726/1300025/35102543.jpg</image><image>http://s3.domainwhatever_2.com/vehicles/photos/3726/1300025/35102544.jpg</image><image>http://s3.domainwhatever_2.com/vehicles/photos/3726/1300025/35102545.jpg</image><image>http://s3.domainwhatever_2.com/vehicles/photos/3726/1300025/35102546.jpg</image></tab></tab></pixplosion>";
}
</script>
</head>
<body>
</body>
</html>
Jsdom chokes on this HTML using its default parser, so I've used aredridel/html5 parser from github. It seems to work for reading in HTML, through jQuery, but I don't have access to function definitions like I did with jsdom and its default parser.
For example, the following:
console.log(window.filenames);
With the default parser gives me an array.
With the HTML5 parser, it gives me:
undefined
Here is my code:
var jsdom = require("jsdom"),
fs = require('fs'),
HTML5 = require('html5');
fs.readFile('contrived.html', 'utf-8', function(err, data) {
if (err) {
throw err;
}
var document = jsdom.jsdom(data, null, {parser: HTML5});
// HTML data should be in document creation call
var script = document.createElement("script");
// HTML data SHOULD NOT be in window creation call
var window = document.createWindow();
var parser = new HTML5.Parser({document: window.document});
parser.parse(data);
script.src = 'http://code.jquery.com/jquery-1.4.2.js';
script.onload = function(window) {
console.log('this is a test');
console.log(window.filenames);
console.log(window.pixplosion_Content);
}
document.head.appendChild(script);
});
Am I missing something, or is this functionality just not available?
Many thanks.