Skip to content

Instantly share code, notes, and snippets.

@jonpacker
Created November 14, 2011 14:36
Show Gist options
  • Save jonpacker/1364072 to your computer and use it in GitHub Desktop.
Save jonpacker/1364072 to your computer and use it in GitHub Desktop.
Weird selector behaviour in jsdom
Tysfjord:repub jonpacker$ coffee testpage_test
QuerySelector: 6
jQuery: 3
var firstEl = document.querySelector("#scopeContainer .resultItem");
undefined
var result = firstEl.querySelectorAll(".subItems li");
undefined
result.length
3
Tysfjord:repub jonpacker$ coffee testpage_test
QuerySelector: 6
jQuery/Sizzle: 3
<!doctype html>
<html>
<head>
<title>Test page!</title>
</head>
<body>
<div id="scopeContainer">
<div class="resultItem">
<span class="resultTitle">
<em> testTitle1 </em>
</span>
<div class="subItems">
<ul>
<li> testSubItem1</li>
<li>testSubItem2</li>
<li>testSubItem3 </li>
</ul>
</div>
<div class="sometimesExistingSubItems">
<ul>
<li>
<span>seSubTitle1</span>
<span>seSubDetail1</span>
</li>
<li>
<span>seSubTitle2</span>
<span>seSubDetail2</span>
</li>
</ul>
</div>
</div>
<div class="resultItem">
<span class="resultTitle">
<em>testTitle2</em>
</span>
<div class="subItems">
<ul>
<li>subTestSubItem1</li>
<li>subTestSubItem2</li>
<li>subTestSubItem3</li>
</ul>
</div>
</div>
</div>
</body>
</html>
jsdom = require 'jsdom'
fs = require 'fs'
page = fs.readFileSync('./test/testpage.html').toString()
jsdom.env
html: page
features:
QuerySelector: true
done: (err, w) ->
firstEl = w.document.querySelector "#scopeContainer .resultItem"
console.log "QuerySelector:", firstEl.querySelectorAll(".subItems li").length
jsdom.env
html: page
scripts: ['http://code.jquery.com/jquery-1.5.min.js']
done: (err, w) ->
result = w.$("#scopeContainer .resultItem").first()
subresult = result.find(".subItems li")
console.log "jQuery:", subresult.length
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment