node.html revision b4bd98fdbecaafbd2f8e490a5c5be0eb2e6286ce
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
d592e9155bb1ceb2b977abd5008e7474b214a2b2Eric Ferraiuolo<html>
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney<head>
0cf10c63df6e2a8987111847ea456ac9e464f5eeMatt Sweeney<title>Node Test Suite</title>
0cf10c63df6e2a8987111847ea456ac9e464f5eeMatt Sweeney
0cf10c63df6e2a8987111847ea456ac9e464f5eeMatt Sweeney<script type="text/javascript" src="/build/yui/yui.js"></script>
0cf10c63df6e2a8987111847ea456ac9e464f5eeMatt Sweeney
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney<style type="text/css">
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeneybody {
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney font:13px/1.22 arial;
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney}
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney#doc {
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney min-height:200px;
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney width:1000px;
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney}
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney#get-style {
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney background:#ccc;
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney float:left;
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney font-size:10px;
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney height:10em;
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney padding:15px 0;
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney width:200px;
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney}
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney.mask {
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney background:#ccc;
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney position:absolute;
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney top:0;
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney left:0;
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney overflow:hidden;
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney}
81d93d38efaf7a1b64cadce31010d3368548483dMatt Sweeney
#test-xy {
background:green;
position:absolute;
height:10px;
width:10px;
}
#test-computed {
border: medium solid #000;
position:relative;
width:50%;
margin:auto;
padding:10px;
z-index: 2;
zoom:1;
}
#test-scroll {
height: 100px;
width: 100px;
overflow:auto;
}
#test-scroll p {
height:1000px;
width:1000px;
}
button {
display:block;
}
.yui3-skin-sam .yui-console-entry-pass .yui-console-entry-cat {
background: #070;
color: #fff;
}
.yui3-skin-sam .yui-console-entry-fail .yui-console-entry-cat {
background: #700;
color: #fff;
}
</style>
</head>
<body class="yui3-skin-sam">
<div id="test-append"></div>
<div id="test-xy"></div>
<div id="test-remove"></div>
<div id="test-replace"><p>replace me</p></div>
<div id="test-scroll">
<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).</p>
</div>
<div id="test-frag">
<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).</p>
<p>Lorem ipsum dolor <em>sit</em>.</p>
</div>
<div id="doc" class="doc-wrap">
<a href="http://www.yahoo.com/foo" id="link-1">Yahoo!</a>
<a href="foo.html" id="link-2" tabIndex="-1">foo</a>
<form id="test-form" class="test-class" action="#">
<label for="test-text-value"><em>label</em></label>
<input name="test-text-value" id="test-text-value" value="text value">
<input name="test-text-novalue">
<textarea name="test-textarea-value" value="textarea value"></textarea>
<textarea name="test-textarea-novalue"></textarea>
<textarea name="test-textarea-textvalue">textarea text</textarea>
<button name="test-button-value" value="button value">button</button>
<button name="test-button-novalue"></button>
<button name="test-button-textvalue">button text</button>
</form><div id="test-class">test class</div>
<div id="test-prop" tabindex="4">text<em id="test-contains">test<span></span></em><strong>node</strong></div>
<div id="set-style"><div class="bar" id="bar">setStyle</div>foo<div>blah</div></div>
<div id="get-style">getStyle</div>
<div id="baz">baz</div>
text
<div id="test-extras">extras</div>
<div id="test-children">foo <span>bar</span> <strong>baz</strong> </div>
<div id="test-empty-children"></div>
</div>
<div id="inline-style" style="color: green">inline style</div>
<div id="foo" aria-checked="true"></div>
<div id="test-computed">test computed style</div>
<form id="form.foo@bar:baz">
<select id="test-select" name="test-select">
<option value="0">foo</option>
<option value="1">bar</option>
<option>baz</option>
</select>
</form>
<div id="test-nodes">
<ul>
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
<li>item 4</li>
</ul>
<ol>
<li class="bar">item 1</li>
<li>item 2</li>
<li>item 3</li>
<li class="bar">item 4</li>
</ol>
</div>
<table id="test-table">
<tr><td id="test-td"><div><div>grandchild of td</div></div></td></tr>
</table>
<ol>
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
<li>item 4</li>
</ol>
<iframe src="test-frame.html"></iframe>
<div id="test-insert-html">foo</div>
<div id="test:colon">
<h2>test</h2>
</div>
<ol id="test-swap">
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
<li>item 4</li>
</ol>
<div id="_funky:id{$400}">
<h2>test</h2>
</div>
<div id="yui-log"></div>
<script type="text/javascript">
YUI({base: '/build/', filter: 'raw'}).use('selector-css3', 'anim', 'console', 'test', 'node-event-simulate', function(Y) {
var Assert = Y.Assert,
ArrayAssert = Y.ArrayAssert,
suite = new Y.Test.Suite("yuisuite");
new Y.Console({node: '#yui-log', height: '1000px' }).render('#yui-log');
var byId = function(id) {
return document.getElementById(id);
};
var $ = Y.Selector.query;
suite.add( new Y.Test.Case({
name: 'Y.Node Instance',
test_get: function() {
var node = Y.one('#test-nodes'),
nodes = Y.all('#test-nodes *');
// return null
Y.one("a[href$='?t=5']");
Assert.isNull(Y.one(''), 'Y.one("")');
Assert.isNull(Y.one(null), 'Y.one(null)');
Assert.isNull(Y.one('#fake-id li'), 'Y.one("#fake-id li") === null');
Assert.isNull(Y.one('#fake-id'), 'Y.one("#fake-id") === null');
Assert.isNull(Y.one('#fake-id li'), 'Y.one("#fake-id li") === null');
// return zero length collection
Assert.isTrue((Y.all('') instanceof Y.NodeList), 'Y.all("") instanceof NodeList');
Assert.isTrue((Y.all('null') instanceof Y.NodeList), 'Y.all("null") instanceof NodeList');
Assert.isTrue((Y.all('#foo *') instanceof Y.NodeList), 'Y.all("#foo *") === null');
// return 1
Assert.areEqual(byId('test-nodes').id, Y.one('#test-nodes').get('id'), 'Y.one("#test-nodes")');
Assert.areEqual(byId('test-nodes'), Y.Node.getDOMNode(Y.one('#test-nodes')), 'Y.one("#test-nodes")');
Assert.areEqual(byId('test-nodes'), Y.Node.getDOMNode(Y.one('#test-nodes')), 'Y.one("#test-nodes")');
Assert.areEqual('test-nodes', Y.one('#test-nodes').get('id'), 'Y.one("#test-nodes").get("id")');
Assert.areEqual(node, Y.one('#test-nodes'), 'node === Y.one("#test-nodes")');
Assert.areEqual(byId('test-nodes').getElementsByTagName('li')[0],
Y.Node.getDOMNode(Y.one('#test-nodes li:first-child')), 'Y.one("#test-nodes")');
Assert.areEqual(byId('test-nodes').getElementsByTagName('li')[1],
Y.Node.getDOMNode(Y.one('#test-nodes li:nth-child(2)')), 'Y.one("#test-nodes:nth-child(2)")');
Assert.areEqual(byId('test-nodes').getElementsByTagName('li')[1],
Y.Node.getDOMNode(Y.one('#test-nodes li:nth-child(2)')), 'Y.one("#test-nodes:nth-child(2)")');
Assert.areEqual(byId('form.foo@bar:baz'), Y.Node.getDOMNode(Y.one('[id="form.foo@bar:baz"]')), "[id=form.foo@bar:baz]");
var firstChild = Y.one('body :first-child');
Y.one('body').insertBefore(Y.Node.create('<div>foo</div>'), firstChild);
Assert.isFalse(firstChild._node === Y.one('body :first-child')._node, "wrong node: Y.one('body :first-child')");
Y.one('body').removeChild(Y.one('body :first-child'));
Assert.areEqual(Y.Selector.query('body :first-child', null, true), Y.one('body :first-child')._node, "body :first-child === #test-append");
// return more than 1
ArrayAssert.itemsAreEqual($('#test-select option'), Y.NodeList.getDOMNodes(Y.all('#test-select option')), 'Y.one("#test-select option")');
Assert.areEqual(3, Y.all('#test-select option').size(), 'Y.one("#test-select option").size()');
Assert.areEqual(2, Y.all('form').size(), 'Y.one("form").size()');
Assert.areEqual('FORM', Y.all('form').item(1).get('tagName'), 'Y.one("form").item(1)');
Assert.areEqual(3, Y.all('.bar').size(), 'Y.one(".bar")');
Assert.areNotEqual(nodes, Y.all('#test-nodes *'), 'nodes === Y.all("#test-nodes")');
Assert.areEqual(nodes.size(), Y.all('#test-nodes *').size(), 'nodes.size() === Y.all("#test-nodes").size()');
ArrayAssert.itemsAreEqual(Y.Selector.query('div'), Y.all(Y.Selector.query('div'))._nodes, "Y.all(Y.Selector.query('div'))");
// Firefox fails due to Firebug pollutes document.queryAll but not document.getElementsByTagName
//ArrayAssert.itemsAreEqual(document.getElementsByTagName('div'), Y.all(Y.Selector.query('div'))._nodes, "Y.all(Y.Selector.query('div'))");
ArrayAssert.itemsAreEqual(Y.Selector.query('input[name]'), Y.all(Y.Selector.query('input[name]'))._nodes, "Y.all(Y.Selector.query('input[name]'))");
ArrayAssert.itemsAreEqual(Y.Selector.query('.foo'), Y.all(Y.Selector.query('.foo'))._nodes, "Y.all(Y.Selector.query('.foo'))");
var frameDoc = Y.one('iframe').get('contentWindow.document');
Assert.areEqual('iframe foo', Y.Lang.trim(frameDoc.one('#demo li').get('innerHTML')),
"frameDoc.one('#demo li').get('innerHTML')");
ArrayAssert.itemsAreEqual([document.body], Y.all(document.body)._nodes, "Y.all(document.body)");
Assert.areSame(Y.one('doc'), Y.one('doc'), "Y.one('doc') === Y.one('doc')");
Assert.areEqual(byId('test-text-value'),
Y.one('doc').one('.test-class #test-text-value')._node,
"Y.one('doc').one('.test-class #test-text-value')");
},
test_each: function() {
var count = 0,
nodes = Y.all('#test-nodes *'),
index;
nodes.each(function(node, i, list) {
count++;
index = i;
Assert.areEqual(nodes, list, 'nodes === instance');
Assert.isTrue(node instanceof Y.Node, 'node instanceof Y.Node');
Assert.areEqual(node, this, 'this === node');
});
Assert.areEqual(count, nodes.size(), 'node.each(count) === nodes.size()');
Assert.areEqual(nodes.size() - 1, index, 'nodes.size() - 1 === index');
},
test_some: function() {
var nodes = Y.all('#test-nodes *'),
index, instance, isNode;
Assert.isTrue(nodes.some(function(node, i, list) {
return true;
}), 'nodes.some(function() { return true; })');
Assert.isFalse(nodes.some(function(node, i, list) {
}), 'nodes.some(function() {})');
},
test_indexOf: function() {
Assert.areEqual(0, Y.all('body').indexOf(Y.one('body')),
"Y.all('body').indexOf(Y.one('body'))");
Assert.areEqual(0, Y.all('div').indexOf(Y.one(document.getElementsByTagName('div')[0])),
"Y.all('div').indexOf(Y.one(document.getElementsByTagName('div')[0]))");
Assert.areEqual(-1, Y.all('div').indexOf(Y.one('#test-')),
"Y.all('div').indexOf(Y.one('#test-'))");
Assert.areEqual(-1, Y.all('div').indexOf(Y.one('#test-form')),
"Y.all('div').indexOf(Y.one('#test-form'))");
},
test_getters: function() {
var id = 'test-nodes',
element = byId(id),
node = Y.one('#' + id),
nodes = Y.all('#' + id + ' *');
Assert.areEqual(null, node.get(''), 'node.get("") === null');
Assert.areEqual(null, node.get('fake'), 'node.get("fake") === null');
Assert.areEqual(null, node.get('nodeValue'), 'nodeValue === null');
Assert.areEqual('DIV', node.get('nodeName'), 'nodeName === "DIV"');
Assert.areEqual('UL', nodes.get('nodeName')[0], 'nodeName === "UL"');
Assert.areEqual('LI', nodes.get('nodeName')[nodes.size() - 1], 'nodeName === "LI"');
Assert.areEqual(element.firstChild.nextSibling.nodeName, node.get('firstChild').get('nextSibling').get('nodeName'), 'node.firstChild.nextSibling.nodeName"');
Assert.areEqual(element.lastChild.nodeName, node.get('lastChild').get('nodeName'), 'lastChild.nodeName"');
Assert.areEqual(9, node.get('ownerDocument').get('nodeType'), 'node.ownerDocument.nodeType === 9');
Assert.areEqual('test-nodes', nodes.get('parentNode').get('id')[0], 'nodes.get(parentNode)[0].get("id") === test-nodes');
Assert.areEqual(element.firstChild.nodeType, node.get('firstChild').get('nodeType'), 'firstChild.get("nodeType")');
Assert.areEqual(element.offsetWidth, node.get('offsetWidth'), 'offsetWidth === node.offsetWidth');
Assert.areEqual(element.offsetParent.tagName, node.get('offsetParent').get('tagName'), 'offsetParent.tagName === offsetParent.tagName');
Assert.areEqual('item 1', Y.Lang.trim(nodes.get('children')[0].get('text')[0]), 'nodes.get("children")[0].get("text")[0]');
Assert.areEqual('item 1', Y.Lang.trim(nodes.get('children')[0].get('text')[0]), 'nodes.get("children")[0].get("text")[0]');
var textContainer = Y.Node.create('<div>foo</div>');
Assert.areEqual('foo', textContainer.get('text'), "textContainer.get('text')");
textContainer.set('text', 'bar');
Assert.areEqual('bar', textContainer.get('text'), "textContainer.set('text', 'bar')");
ArrayAssert.itemsAreEqual($('#test-select option'),
Y.NodeList.getDOMNodes(Y.one('#test-select').get('options')),
'Y.one("#test-select.get("options")');
Assert.areEqual(2, node.get('children').size(), 'get("children")');
Assert.areEqual(0, Y.one('#test-empty-children').get('children').size(), "Y.one('#test-empty-children').get('children')");
Assert.areEqual(8, Y.all('#' + id + ' li').size(), 'Y.all("#test-nodes li.size()")');
// size() is deprecated on Node
//Assert.areEqual(1, Y.one('#' + id + ' li').size(), 'Y.one("#test-nodes li.size()")');
Assert.areEqual(byId('test-nodes').childNodes.length, node.get('childNodes').size(), 'node.get("childNodes").size()');
Assert.areEqual(byId('test-nodes').childNodes.length, node.get('childNodes').get('tagName').length, 'node.get("childNodes")');
ArrayAssert.itemsAreEqual(byId('test-nodes').childNodes.length, node.get('childNodes').get('length').length, "node.get('childNodes').get('length')");
Assert.areEqual(element.lastChild.nodeName, node.get('lastChild.nodeName'), 'node.get("lastChild.nodeName")');
Assert.areEqual(element.lastChild.previousSibling.nodeName, node.get('lastChild').get('previousSibling').get('nodeName'), 'node.lastChild.previousSibling.nodeName');
Assert.areEqual('test', Y.one('#test-prop').get('firstChild.nextSibling.firstChild.nodeValue'),
'node.get("firstChild.nextSibling.firstChild.nodeValue")');
Assert.areEqual(byId('test-prop').tabIndex, Y.one('#test-prop').get('tabIndex'), 'Y.one("#test-prop").get("tabIndex")');
Assert.areEqual(byId('doc').tabIndex, Y.one('#doc').get('tabIndex'), 'Y.one("#doc".get("tabIndex"))');
Assert.areEqual(byId('link-1').tabIndex, Y.one('#link-1').get('tabIndex'), 'Y.one("#link1".get("tabIndex"))');
Assert.areEqual(byId('link-2').tabIndex, Y.one('#link-2').get('tabIndex'), 'Y.one("#link1".get("tabIndex"))');
Assert.areEqual(undefined, Y.one('form').get('childNodes')._nodes.item, 'convert live list to static');
Assert.isTrue(Y.all('input').get('parentNode') instanceof Y.NodeList, "Y.all('input').get('parentNode')");
},
test_create: function() {
var id = 'test-nodes',
element = byId(id),
node = Y.one('#' + id);
Assert.areEqual('fresh', node.create('<div id="fresh">fresh</div>').get('id'), 'node.create from string)');
node = Y.Node.create('<select><option>foo</option></select>');
var option = Y.Node.create('<option>bar</option>').set('selected', 'selected');
node.appendChild(option);
Assert.isTrue(Y.Node.getDOMNode(option).selected, "Y.Node.create('<option>test</option>').set('selected', 'selected'))");
var html = '<li><a href=""></a></li>';
node = Y.Node.create(html);
Assert.areEqual('A', node.get('firstChild.tagName'), html);
html = 'baz';
node = Y.Node.create(html);
Assert.areEqual('3', node.get('nodeType'), "node.get('nodeType')");
Assert.areEqual('3', Y.Node.getDOMNode(node).nodeType, "Y.Node.getDOMNode(node).nodeType");
html = '<div>bar</div>';
node = Y.Node.create(html);
Assert.areEqual('3', node.get('firstChild.nodeType'), "node.get('firstChild.nodeType')");
Assert.areEqual('3', node.get('firstChild').get('nodeType'), "node.get('firstChild').get('nodeType')");
Assert.areEqual('3', Y.Node.getDOMNode(node.get('firstChild')).nodeType, "Y.Node.getDOMNode(node.get('firstChild')).nodeType");
node.insertBefore(Y.Node.create('foo'), node.get('firstChild'));
Assert.areEqual('foobar', node.get('innerHTML'), "node.get('innerHTML')");
Assert.areEqual('foobar', node.get('text'), "node.get('text')");
// test setContent with NodeList
html = '<div>foo</div>';
node.setContent(Y.all(Y.Node.create(html)));
Assert.areEqual(html, node.get('innerHTML').toLowerCase(), "node.setContent(Y.all(Y.Node.create(html)))");
},
test_setter: function() {
var id = 'test-prop',
element = byId(id),
node = Y.one('#' + id),
nodes = Y.all('#test-nodes *');
var childNodes = Y.one('body').get('childNodes');
childNodes.set('title', 'foo bar');
Assert.isTrue(byId('test-nodes').title == 'foo bar', 'Y.one("body").get("childNodes").set("title")');
node.set('foo', 'foo');
Assert.isUndefined(node.get('foo'), 'node.get("foo")');
node.set('title', 'my title');
Assert.areEqual('my title', Y.Node.getDOMNode(node).title, 'node.title)');
Assert.areEqual('my title', node.get('title'), 'node.set("title")');
nodes.set('className', 'foo');
Assert.areEqual('foo', Y.NodeList.getDOMNodes(nodes)[0].className, 'node.className');
Assert.areEqual('foo', nodes.get('className')[2], 'node.get("className")');
Assert.areEqual('foo', nodes.item(nodes.size() - 2).get('className'),
'nodes.item(nodes.size - 2).get("className")');
var attrMap = {
className: 'fooclass',
title: 'new title'
};
node.setAttrs(attrMap);
var getAttrs = node.getAttrs(['className', 'title']);
Assert.areEqual(attrMap.className, getAttrs.className, 'node.setAttrs(attrMap) (get className)');
Assert.areEqual(attrMap.title, getAttrs.title, 'node.setAttrs(attrMap) (get title)');
Y.one('#test-select').set('selectedIndex', 2);
Assert.areEqual(2, Y.one('#test-select')._node.selectedIndex,
"Y.one('#test-select').set('selectedIndex', 2)");
Y.one('body > form').set('test-select.selectedIndex', 2);
Assert.areEqual(2, byId('test-select').selectedIndex,
'Y.one("body > form").set("test-select.selectedIndex", 2)');
var index = Y.one('#test-select').one('option[value=1]').set('selected', true);
Assert.areEqual(1, Y.one('#test-select')._node.selectedIndex,
"Y.one('#test-select').set('selectedIndex', 1)");
Y.one('#test-select').set('value', 1);
Assert.areEqual(1, Y.one('#test-select').get('value'), "Y.one('#test-select').set('value', 1)");
Y.one('#test-select').set('value', 'baz');
Assert.areEqual('baz', Y.one('#test-select').get('value'), "Y.one('#test-select').set('value', 1)");
},
test_dom_methods: function() {
var id = 'test-prop';
var element = byId(id);
var parent = Y.one(element.parentNode);
var node = Y.one('#test-prop');
Assert.isTrue(node.hasMethod('appendChild'), "node.hasMethod('appendChild')");
var xmlNode = Y.one(document.createElement('xml'));
Assert.isFalse(xmlNode.hasMethod('onreadystatechange')," xmlNode.hasMethod('onreadystatechange')");
//Assert.isTrue(element === Y.one(node), 'element === Y.one(node)');
Assert.areEqual(element.getElementsByTagName('em')[0].nodeName, node.getElementsByTagName('em').item(0).get('nodeName'), 'getElementsByTagName');
var insertNode = document.createElement('div');
Y.stamp(insertNode);
insertNode.innerHTML = 'inserted node';
Y.one('body').appendChild(Y.one('div'));
Assert.isTrue(Y.one('body').get('lastChild').compareTo(Y.one('#test-append')), 'get("body").appendChild(Y.one("#test-append"))');
Assert.areEqual(byId('test-append'), Y.Node.getDOMNode(Y.one('body').get('lastChild')), 'get("body").appendChild(Y.one([0]"#test-append"))');
Assert.areEqual('inserted node', node.appendChild(insertNode).get('innerHTML'), 'appendChild(element input)');
Assert.areEqual('inserted node', node.removeChild(insertNode).get('innerHTML'), 'removeChild(element input)');
Assert.areEqual('inserted node', node.appendChild(Y.one(insertNode)).get('innerHTML'), 'appendChild(Node input)');
Assert.areEqual('inserted node', node.removeChild(Y.one(insertNode)).get('innerHTML'), 'removeChild(Node input)');
var clone = node.cloneNode();
Assert.isFalse(node === clone, 'node === node.cloneNode()');
Assert.areEqual(1, clone.get('nodeType'), 'cloneNode()');
// TODO: test deep clone with bound descendant
Assert.isTrue(node.get('childNodes').size() === node.cloneNode(true).get('childNodes').size(), 'node.get("childNodes").size() === node.cloneNode(true).get("childNodes").size()');
Assert.isTrue(Y.one('.bar').test('.bar'), "Y.one('.bar').test('.bar')");
clone = Y.one('.bar').cloneNode(true);
Assert.isTrue(clone.hasClass('bar'), "clone.hasClass('bar') (before appending)");
Y.one('body').appendChild(clone);
clone.set('id', 'new-bar');
Assert.isTrue(clone.test('.bar'), "clone.test('.bar') (after appending)");
Assert.isTrue(
Y.Node.create('<div id="foo" class="bar"></div>').test('.bar'),
"Y.Node.create('<div id=\"foo\" class=\"bar\"></div>').test('.bar')");
Assert.isTrue(
Y.Node.create('<div id="foo" class="bar"></div>').test('#foo.bar'),
"Y.Node.create('<div id=\"foo\" class=\"bar\"></div>').test('#foo.bar')");
Assert.isTrue(node.hasChildNodes(), 'hasChildNodes()');
Assert.isTrue(node.compareTo(node), 'compareTo(node)');
Assert.isTrue(node.compareTo(Y.one(node)), 'compareTo(new Y.Node)');
Assert.isFalse(node.compareTo(null), 'compareTo(null)');
Assert.isFalse(node.create('<p>foo</p>').inDoc(), 'node.inDoc()');
Assert.isTrue(node.contains(byId('test-contains')), 'contains()');
Assert.isTrue(node.contains(node), 'contains() self');
Assert.isTrue(node.contains(element), 'contains() self');
Assert.isFalse(node.contains(document.getElementsByTagName('div')), 'contains() false positive for collection');
Assert.areEqual('doc', node.ancestor(function(el) {
return el.get('id') === 'doc';
}).get('id'), 'ancestor');
Assert.areEqual(node.ancestor(), node.get('parentNode'), "node.ancestor()");
Assert.isNull(node.ancestor(function(el) {
return el.getAttribute('foo') !== '';
}), 'ancestor');
Assert.areEqual(node.get('parentNode'), node.ancestor('div'));
Assert.areEqual(node, node.ancestor('div', true));
Assert.areEqual('test-class', node.previous().get('id'), 'node.previous()');
Assert.isTrue(Y.one(document.body).inDoc(document));
Assert.isTrue(node.inDoc(), 'node.inDoc()');
Assert.isTrue(node.inDoc(document), 'node.inDoc(document)');
Assert.isTrue(node.inDoc(Y.one(document)), 'node.inDoc(Y.one(document))');
Assert.areEqual(byId('test-contains'), Y.Node.getDOMNode(node.getById('test-contains')), 'node.getById("test-contains")');
Assert.isTrue(node.hasAttribute('id'), 'node.hasAttribute("id")');
Assert.isTrue(node.hasAttribute('title'), 'node.hasAttribute("title")');
Assert.isFalse(node.hasAttribute('foo'), 'node.hasAttribute("foo")');
Assert.isTrue(node.hasAttribute('tabIndex'), 'node.hasAttribute("tabIndex")');
node.removeAttribute('tabIndex');
Assert.isFalse(node.hasAttribute('tabIndex'), 'node.hasAttribute("tabIndex") (false)');
/*
Assert.areEqual(node.getAttribute('tabIndex'), node.get('tabIndex'),
"node.getAttribute('tabIndex') === node.get('tabIndex')");
*/
Assert.isFalse(Y.one('body').hasAttribute('title'), 'body.hasAttribute("title")');
Assert.areEqual('0', Y.one('select[name=test-select] option:nth-child(1)').getAttribute('value'), 'option1.getAttribute("value") (from innerText)');
Assert.areEqual('1', Y.one('select[name=test-select] option:nth-child(2)').getAttribute('value'), 'option2.getAttribute("value") (from innerText)');
Assert.areEqual('', Y.one('select[name=test-select] option:nth-child(3)').getAttribute('value'), 'option3.getAttribute("value") (from innerText)');
Assert.areEqual('http://www.yahoo.com/foo', Y.one('#link-1').getAttribute('href'), "Y.one('#link1').getAttribute('href')");
Assert.areEqual('foo.html', Y.one('#link-2').getAttribute('href'), "Y.one('#link1').getAttribute('href')");
},
test_fragment: function() {
var frag = Y.one('document').invoke('createDocumentFragment'),
element = byId('test-append');
frag.appendChild(element);
Assert.areEqual(element, Y.Node.getDOMNode(frag.get('firstChild')), 'frag.appendChild()');
Y.one('body').appendChild(frag);
},
test_screen: function() {
var id = 'test-prop';
var element = byId(id);
var parent = Y.one(element.parentNode);
var node = Y.one(element);
var newNode = Y.Node.create('<div id="brand-new-foo">foo</div>');
Assert.areEqual(0, newNode.get('docScrollX'), 'newNode.get("docScrollX")');
Assert.areEqual(0, node.get('docScrollY'), 'node.get("docScrollY")');
node = Y.one('#test-xy');
node.setXY([100, 100]);
var xy = node.getXY();
var x = Math.round(xy[0]);
var y = Math.round(xy[1]);
ArrayAssert.itemsAreEqual([100, 100], [x, y], 'Node.getXY("foo", "bar")');
},
test_region: function() {
Assert.isTrue(Y.DOM.inRegion(byId('baz'), byId('doc')), 'DOM.inRegion(domNode, domNode)');
Assert.isTrue(Y.one('#get-style').inRegion(byId('doc')), 'node.inRegion(domNode)');
Assert.isTrue(Y.one('#get-style').inRegion(Y.one('#doc')), 'node.inRegion(Node)');
ArrayAssert.itemsAreEqual(Y.DOM.region(Y.DOM.byId('doc')), Y.one('#doc').get('region'), 'node.get("region")');
},
test_classes: function() {
var id = 'test-class';
var element = byId(id);
var parent = Y.one(element.parentNode);
var node = Y.one(element);
Assert.isTrue(node.get('previousSibling').hasClass('test-class'), 'node.get("previousSibling").hasClass("test-class")');
node.addClass('foo');
Assert.areEqual('foo', element.className, 'node.addClass("foo")');
node.removeClass('foo');
Assert.areEqual('', element.className, 'node.removeClass("foo")');
node.addClass('foo');
Y.one('body').get('childNodes').addClass('foo');
Assert.isTrue(byId('test-class').className == 'foo', 'NodeList.addClass');
node.replaceClass('foo', 'bar');
Assert.areEqual('bar', element.className, 'Node.replaceClass("foo", "bar")');
var nodes = Y.all('#test-nodes li');
nodes.addClass('foo').addClass('bar');
nodes.each(function(n) {
Assert.isTrue(n.hasClass('foo'));
Assert.isTrue(n.hasClass('bar'));
});
nodes.removeClass('bar');
nodes.each(function(n) {
Assert.isFalse(n.hasClass('bar'));
});
node = Y.DOM.create('<div></div>');
Y.DOM.addClass(node, 'foo');
Y.DOM.replaceClass('foo', 'foo');
Assert.isTrue(Y.DOM.hasClass(node, 'foo'));
},
test_toggle: function() {
var node = Y.one('#test-class');
node.toggleClass('foo');
Assert.isTrue(node.hasClass('foo'), "node.toggleClass('foo')");
node.toggleClass('foo');
Assert.isFalse(node.hasClass('foo'), "node.toggleClass('foo')");
node.toggleClass('foo', false);
Assert.isFalse(node.hasClass('foo'), "node.toggleClass('foo', false)");
node.toggleClass('foo');
Assert.isTrue(node.hasClass('foo'), "node.toggleClass('foo')");
node.toggleClass('foo', true);
Assert.isTrue(node.hasClass('foo'), "node.toggleClass('foo', true)");
},
test_setStyle: function() {
var element = byId('set-style'),
node = Y.one(element),
nodes = node.get('childNodes');
node.setStyle('width', '20em');
Assert.areEqual('20em', element.style.width, "setStyle('width' '20em')");
node.setStyle('marginTop', '1em');
Assert.areEqual('1em', element.style.marginTop, "setStyle('marginTop','1em')");
node.setStyle('opacity', 0.5);
Assert.areEqual(0.5, node.getStyle('opacity'), "setStyle('opacity', 0.5)");
node.setStyle('float', 'left');
Assert.areEqual('left', node.getStyle('float'), "setStyle('float', 'left')");
node.setStyle('float', 'left');
Assert.areEqual('left', node.getStyle('float'), "setStyle('float', 'left')");
nodes.setStyle('marginTop', '1em');
Assert.areEqual('1em', nodes.getStyle('marginTop')[2], "setStyle('marginTop', '1em'");
},
test_getStyle: function() {
var node = Y.one('#get-style');
node.setStyle('opacity', 0.5);
Assert.areEqual(0.5, node.getStyle('opacity'), "node.getStyle('opacity')");
Assert.areEqual('left', node.getStyle('float'), "node.getStyle('float')");
Assert.areEqual('100px', node.getStyle('height'), "getStyle('height')");
Assert.areEqual('200px', node.getStyle('width'), "getStyle('width)'");
Assert.areEqual('visible', node.getStyle('visibility'), "visibility");
node.setStyle('visibility', 'hidden');
Assert.areEqual('hidden', node.getStyle('visibility'), "visibility");
node.setStyle('visibility', 'visible');
},
test_getComputedStyle: function() {
var node = Y.one('#test-computed'),
domNode = byId('test-computed'),
bw = (Y.UA.ie && Y.UA.ie < 8) ? 4 : 3,
w = node.get('offsetWidth'),
h = node.get('offsetHeight');
if (!Y.UA.ie || document.compatMode !== 'BackCompat') {
w = w - 20 - 2 * bw;
h = h - 20 - 2 * bw;
}
Assert.areEqual(bw + 'px', node.getComputedStyle('borderTopWidth'), "borderTopWidth: medium");
Assert.areEqual(h, Math.ceil(parseFloat(node.getComputedStyle('height'))), "height: auto (offset minus padding and border)");
domNode.style.padding = '1em';
Assert.areEqual('13px', node.getComputedStyle('paddingTop'), "padding 13px");
Assert.areEqual('visible', node.getComputedStyle('visibility'), "visibility");
domNode.parentNode.style.visibility = 'hidden';
Assert.areEqual('hidden', node.getComputedStyle('visibility'), "visibility:hidden");
domNode.parentNode.style.visibility = 'visible';
Assert.areEqual(2, node.getComputedStyle('zIndex'), 'node.getComputedStyle("zIndex")');
domNode.style.margin = 'auto';
Assert.areEqual('0px', node.getComputedStyle('marginTop'), "margin auto");
Assert.areEqual(w, Math.round(parseFloat(node.getComputedStyle('width'))), "percent width (from CSS)");
},
test_setStyles: function() {
var node = byId('set-style');
var element = Y.one(node);
element.setStyles({
'top': '5px',
'right': '10em'
});
Assert.isTrue( (node.style.top == '5px' && node.style.right == '10em'), "setStyles()");
},
test_selector: function() {
var id = 'test-prop',
element = byId(id),
node = Y.one('#' + id),
parent = Y.one(element.parentNode),
nodes = Y.all('#test-nodes *');
// Selector methods
Assert.isNull(Y.one(document.body).one("#fake-id"), 'body.one("#fake-id")');
Assert.isTrue(Y.one(node).test('#' + id), 'node.test( "#id")');
Assert.isNull(parent.one("#fake-id"), 'parent.one("#fake-id")');
Assert.areEqual(id, parent.one('#' + id).get('id'), 'parent.one("#id")');
Assert.areEqual(id, parent.one('#' + id).get('id'), 'parent.one("#id")');
Assert.isNull(parent.one('#text-xy'), 'parent.one("test-xy")');
Assert.areEqual(id, parent.all('#' + id).item(0).get('id'), 'parent.all(node, "#id")');
Assert.areEqual(id, parent.all('#' + id).item(0).get('id'), 'parent.all(node, "#id")');
},
test_window: function() {
var win = Y.one(window);
Assert.areEqual(window, Y.Node.getDOMNode(win), 'Y.one(window)');
Assert.areEqual(document, Y.Node.getDOMNode(win.get('document')), 'win.get(document)');
//Assert.areEqual(window, Y.Node.getDOMNode(Y.one('document').get('defaultView')), 'win.get(document)');
},
test_windowSize: function() {
Assert.isNotNull(Y.one('body').get('winHeight'), 'body.get("winHeight")');
},
test_scroll: function() {
Y.one('#test-scroll').set('scrollTop', 100);
Y.one('#test-scroll').set('scrollLeft', 200);
Assert.areEqual(100, byId('test-scroll').scrollTop, 'test-scroll.set("scrollTop", 100)');
Assert.areEqual(200, byId('test-scroll').scrollLeft, 'test-scroll.set("scrollLeft", 200)');
document.body.style.height = '5000px';
document.body.style.width = '5000px';
/*
Y.one(window).set('scrollTop', 100);
Y.one(window).set('scrollLeft', 200);
Assert.areEqual(100, Y.DOM.docScrollY(window), 'window.set("scrollTop", 100)');
Assert.areEqual(200, Y.DOM.docScrollX(window), 'window.set("scrollLeft", 200)');
*/
Y.one(document).set('scrollTop', 200);
Y.one(document).set('scrollLeft', 100);
Assert.areEqual(200, Y.DOM.docScrollY(document), 'document.set("scrollTop", 200)');
Assert.areEqual(100, Y.DOM.docScrollX(document), 'document.set("scrollLeft", 100)');
document.body.style.height = '';
document.body.style.width = '';
window.scrollTo(0, 0);
},
test_setContent: function() {
var content = '<strong>foo</strong>';
Y.one('#test-insert-html').setContent(content);
Assert.areEqual(content,
Y.DOM.byId('test-insert-html').innerHTML.toLowerCase(),
"Y.one('#test-insert-html').setContent(" + content + ")");
Y.one('#test-insert-html').setContent(Y.Node.create(content));
Assert.areEqual(content,
Y.DOM.byId('test-insert-html').innerHTML.toLowerCase(),
"Y.one('#test-insert-html').setContent(Y.Node.create(" + content + "))");
content = '<strong>foo</strong><em>bar</em>';
Y.one('#test-insert-html').setContent(Y.Node.create(content));
Assert.areEqual(content,
Y.DOM.byId('test-insert-html').innerHTML.toLowerCase(),
"Y.one('#test-insert-html').setContent(Y.Node.create(" + content + "))");
var element = document.createElement('strong');
element.innerHTML = 'bar';
content = '<strong>bar</strong>';
Y.one('#test-insert-html').setContent(element);
Assert.areEqual(content,
Y.DOM.byId('test-insert-html').innerHTML.toLowerCase(),
"Y.one('#test-insert-html').setContent(element)");
content = '';
Y.one('#test-insert-html').setContent(content);
Assert.areEqual(content,
Y.DOM.byId('test-insert-html').innerHTML.toLowerCase(),
"Y.one('#test-insert-html').setContent(" + content + ")");
content = null;
Y.one('#test-insert-html').setContent(content);
Assert.areEqual('',
Y.DOM.byId('test-insert-html').innerHTML.toLowerCase(),
"Y.one('#test-insert-html').setContent(" + content + ")");
content = 0;
Y.one('#test-insert-html').setContent(content);
Assert.areEqual('0',
Y.DOM.byId('test-insert-html').innerHTML.toLowerCase(),
"Y.one('#test-insert-html').setContent(" + content + ")");
},
test_insert: function() {
var node = Y.one('#test-insert-html'),
html = '<strong>foo</strong>',
content;
node.setContent('foo');
content = node.get('innerHTML').toLowerCase();
node.insert(html);
Assert.areEqual(node._node.innerHTML.toLowerCase(),
content + html,
"node.insert('" + html + "')");
html = '<em>bar</em>';
content = node.get('innerHTML').toLowerCase();
node.insert(html, 0);
Assert.areEqual(node._node.innerHTML.toLowerCase(),
html + content,
"node.insert(" + html + ", 0)");
html = '<span>baz</span>';
node.insert(html, 1);
Assert.areEqual(node.all('> *').item(1).get('tagName'),
'SPAN',
"node.insert(" + html + ", 1)");
html = '';
content = node.get('innerHTML').toLowerCase();
node.insert(html);
Assert.areEqual(node._node.innerHTML.toLowerCase(),
content,
"node.insert(" + html + ")");
html = null;
content = node.get('innerHTML').toLowerCase();
node.insert(html);
Assert.areEqual(node._node.innerHTML.toLowerCase(),
content,
"node.insert(" + html + ")");
// test fragment insertion
var childCount = node.get('childNodes').size();
html = '<q>bar</q><h2>foo</h2>';
content = node.get('innerHTML').toLowerCase();
node.insert(html);
Assert.areEqual(childCount + 2,
node.get('childNodes').size(),
"node.insert(" + html + ")");
Assert.areEqual('Q',
node.get('childNodes').item(childCount).get('tagName'),
"node.insert(" + html + ")");
Assert.areEqual('H2',
node.get('childNodes').item(childCount + 1).get('tagName'),
"node.insert(" + html + ")");
html = '<label>foo</label><input>';
content = node.get('innerHTML').toLowerCase();
node.insert(html);
Assert.areEqual(node._node.innerHTML.toLowerCase(),
Y.Lang.trim(content + html).toLowerCase(),
"node.insert(" + html + ")");
node.setContent('<em>foo</em><span>bar</span>');
node.insert('<strong>baz</strong>', node.one('span'));
Assert.areEqual(node._node.childNodes[1].tagName, 'STRONG',
"node.insert('<strong>bar</strong>', node.one('span')");
node.insert('<code>var lorem</code>', node.one('em')._node);
Assert.areEqual(node._node.childNodes[0].tagName, 'CODE',
"node.insert('<code>var lorem</code>', node.one('em')._node)");
// insert Node instance
html = Y.Node.create('<div>foo</div>');
node.insert(html, 2);
Assert.areEqual(node._node.childNodes[2], html._node,
"node.insert(Y.Node.create('<div>foo</div>'))");
// insert DOM node
html = document.createElement('div');
Y.one('#test-insert-html').insert(html, 2);
Assert.areEqual(Y.one('#test-insert-html')._node.childNodes[2], html, 'node.insert(someDOMNode, 2)');
},
test_inject: function() {
var node = Y.one('#test-insert-html'),
html = '<strong>foo</strong>',
content = node.get('innerHTML').toLowerCase();
node.prepend(html);
Assert.areEqual(node._node.innerHTML.toLowerCase(),
html + content,
"node.prepend('" + html + "')");
html = '<em>bar</em>';
content = node.get('innerHTML').toLowerCase();
node.append(html);
Assert.areEqual(node._node.innerHTML.toLowerCase(),
content + html,
"node.append('" + html + "')");
},
test_getValue: function() {
// text
Assert.isTrue(Y.one('input[name=test-text-value]').hasAttribute('value'),
'input[name=test-text-value].hasAttribute("value")');
Assert.isFalse(Y.one('input[name=test-text-novalue]').hasAttribute('value'),
'input[name=test-text-novalue].hasAttribute("value")');
Assert.areEqual('text value',
Y.one('input[name=test-text-value]').get('value'),
"Y.one('input[name=test-text-value]').get('value')");
Assert.areEqual('', // TODO: normalize to null?
Y.one('input[name=test-text-novalue]').get('value'),
"Y.one('input[name=test-text-novalue]').get('value')");
// textarea
// textarea doesn't use value attribute
//Assert.isTrue(Y.one('textarea[name=test-textarea-value]').hasAttribute('value'),
// 'textarea[name=test-textarea-value].hasAttribute("value")');
Assert.isFalse(Y.one('textarea[name=test-textarea-novalue]').hasAttribute('value'),
'textarea[name=test-textarea-value].hasAttribute("value")');
Assert.areEqual('textarea text',
Y.one('textarea[name=test-textarea-textvalue]').get('value'),
'textarea[name=test-textarea-textvalue].get("value")');
Assert.areEqual('',
Y.one('textarea[name=test-textarea-novalue]').get('value'),
'textarea[name=test-textarea-novalue].get("value")');
Assert.areEqual('',
Y.one('textarea[name=test-textarea-value]').get('value'),
'textarea[name=test-textarea-value].get("value")');
// button
Assert.isTrue(Y.one('button[name=test-button-value]').hasAttribute('value'),
'textarea[name=test-button-value].hasAttribute("value")');
Assert.isFalse(Y.one('button[name=test-button-novalue]').hasAttribute('value'),
'textarea[name=test-button-value].hasAttribute("value")');
Assert.areEqual('button value',
Y.one('button[name=test-button-value]').get('value'),
'button[name=test-button-value].get("value")');
Assert.areEqual('',
Y.one('button[name=test-button-novalue]').get('value'),
'button[name=test-button-novalue].get("value")');
Assert.areEqual('',
Y.one('button[name=test-button-textvalue]').get('value'),
'button[name=test-button-textvalue].get("value")');
},
test_remove: function() {
var node = Y.one('#test-remove'),
domNode = Y.DOM.byId('test-remove'),
parent = domNode.parentNode;
node.remove();
Assert.isTrue(parent !== domNode.parentNode, 'node.remove()');
// ensure remove doesnt fail when no parent
node = Y.Node.create('<div/>');
node.remove();
},
test_replace: function() {
var node = Y.one('#test-replace').get('firstChild'),
newNode = document.createElement('div');
node.replace(newNode);
Assert.areEqual(newNode, Y.one('#test-replace').get('firstChild')._node, 'node.replace(domNode)');
node = Y.one('#test-replace').get('firstChild');
newNode = Y.Node.create('<div/>');
node.replace(newNode);
Assert.areEqual(newNode, Y.one('#test-replace').get('firstChild'), 'node.replace()');
Assert.areEqual(newNode._node, Y.one('#test-replace').get('firstChild')._node, 'node.replace()');
},
test_elements: function() {
var elements = Y.one('#test-form').get('elements');
ArrayAssert.itemsAreEqual(Y.DOM.byId('test-form').elements, elements._nodes, "Y.one('#test-form').get('elements')");
},
test_toFrag: function() {
var frag = Y.all('#test-frag p').toFrag();
Assert.areEqual(11, frag.get('nodeType'), "Y.all('#test-frag p').toFrag();");
},
test_aria: function() {
Y.one('body').set('role', 'menu');
Assert.isTrue(document.body.getAttribute('role') === 'menu', "Y.one('body').set('role', 'menu')")
Y.one('body').set('aria-checked', true);
Assert.areEqual('true', document.body.getAttribute('aria-checked', 2), "Y.one('body').set('aria-checked', true)")
Assert.areEqual('true', Y.one('body').getAttribute('aria-checked'), "Y.one('body').set('aria-checked', true)")
Assert.areEqual('true', Y.one('#foo').get('aria-checked'), "Y.one('#foo').get('aria-checked')");
Y.one('body').set('aria-checked', false);
Assert.areEqual('false', Y.one('body').get('aria-checked'), "Y.one('body').set('aria-checked', false)");
},
test_plugin: function() {
Y.Node.plug(Y.Plugin.NodeFX);
Assert.isTrue(!!Y.Node.create('<div></div>').fx, 'Node.plug()');
Y.Node.unplug(Y.Plugin.NodeFX);
Assert.isFalse(!!Y.Node.create('<div></div>').fx, 'Node.unplug()');
Y.all('input').plug(Y.Plugin.NodeFX);
Y.all('input').each(function(n) {
Assert.isObject(n.fx, "Y.all('input').plug(Y.Plugin.NodeFX)");
});
Y.all('input').unplug(Y.Plugin.NodeFX);
Y.all('input').each(function(n) {
Assert.areEqual(undefined, n.fx, "Y.all('input').unplug(Y.Plugin.NodeFX)");
});
},
test_props: function() {
var mask = document.createElement('div');
mask.className = 'mask';
document.body.appendChild(mask);
var doc = Y.one('document');
window.scrollTo(0,0);
mask.style.height = doc.get('docHeight') + 'px';
mask.style.width = doc.get('docWidth') + 'px';
Y.DOM.setStyle(mask, 'opacity', 0.4);
Assert.areEqual('DIV', Y.one('#test-prop').get('nodeName'), 'one("test-prop")');
Assert.areEqual('test-xy', doc.one('#test-xy').get('id'), 'doc.one("#test-xy")');
Assert.isNull(doc.one('fake-id'), 'doc.one("#fake-id")');
Assert.areEqual(mask.offsetHeight, doc.get('docHeight'), 'get("docHeight")');
Assert.areEqual(mask.offsetWidth, doc.get('docWidth'), 'get("docWidth")');
mask.className = '';
},
test_refresh: function() {
var node = Y.one('#test-nodes'),
nodelist = node.all('li');
nodelist.item(1).remove();
ArrayAssert.itemsAreEqual( node.one('li'), nodelist, "Y.one('#test-node').all('li')");
nodelist = Y.all('#test-nodes li');
nodelist.item(1).remove();
ArrayAssert.itemsAreEqual( node.one('li'), nodelist, "Y.one('#test-node').all('li')");
},
test_one: function() {
var node = Y.DOM.byId('test:colon');
Assert.areEqual(node.getElementsByTagName('h2')[0], Y.one(node).one('h2')._node,
"Y.one(Y.DOM.byId('test:colon')).one(h2)");
node = Y.DOM.byId('_funky:id{$400}');
Assert.areEqual(node.getElementsByTagName('h2')[0], Y.one(node).one('h2')._node,
"Y.one(Y.DOM.byId('_funky:id{$400}')).one(h2)");
},
test_all: function() {
var node = Y.DOM.byId('test:colon');
ArrayAssert.itemsAreEqual(node.getElementsByTagName('h2'),
Y.one(node).all('h2')._nodes,
"Y.one(Y.DOM.byId('test:colon')).all(h2)");
node = Y.DOM.byId('_funky:id{$400}');
ArrayAssert.itemsAreEqual(node.getElementsByTagName('h2'),
Y.one(node).all('h2')._nodes,
"Y.one(Y.DOM.byId('_funky:id{$400}')).all(h2)");
node = Y.one('body');
ArrayAssert.itemsAreEqual([node._node], Y.all(node)._nodes,
"Y.all(Y.one('body'))");
},
test_isEmpty: function() {
Assert.isFalse(Y.all('input').isEmpty());
Assert.isTrue(Y.all('.nomatch').isEmpty());
},
test_siblings: function() {
var parent = Y.one('#test-nodes > ol'),
children = parent.get('children');
ArrayAssert.itemsAreEqual(
[children.item(0)._node, children.item(1)._node, children.item(3)._node],
children.item(2).siblings()._nodes,
"children.item(2).siblings()"
);
ArrayAssert.itemsAreEqual(
[children.item(0)._node, children.item(1)._node, children.item(3)._node],
children.item(2).siblings('li')._nodes,
"children.item(2).siblings('li')"
);
children.addClass('bar');
children.item(1).removeClass('bar');
ArrayAssert.itemsAreEqual(
[children.item(0)._node, children.item(3)._node],
children.item(2).siblings('li.bar')._nodes,
"children.item(2).siblings('li.bar')"
);
},
test_swap: function() {
var elements = Y.DOM.byId('test-swap').getElementsByTagName('li'),
nodes = Y.all('#test-swap li');
Assert.areEqual(elements[0], nodes.item(0)._node);
nodes.item(0).swap(nodes.item(3));
Assert.areEqual(elements[0], nodes.item(3)._node, "nodes.item(0).swap(nodes.item(3))");
nodes.item(0).swap(nodes.item(3));
Assert.areEqual(elements[0], nodes.item(0)._node);
Assert.areEqual(elements[3], nodes.item(3)._node);
nodes.item(1).swap(nodes.item(2));
Assert.areEqual(elements[1], nodes.item(2)._node);
nodes.item(1).swap(nodes.item(2));
Assert.areEqual(elements[1], nodes.item(1)._node);
Assert.areEqual(elements[2], nodes.item(2)._node);
},
test_data: function() {
var node = Y.one('body');
// deprecated usage
node.set('data', 'foo');
Assert.areEqual('foo', node.get('data'),
"node.set('data', 'foo')");
node.setData('foo', 'foo');
Assert.areEqual('foo', node.getData('foo'),
"node.setData('foo', 'foo')");
node.setData({'bar': 'bar', 'baz': 'baz'});
Assert.areEqual('bar', node.getData('bar'),
"node.setData({'bar': 'bar', 'baz': 'baz'})");
Assert.areEqual('baz', node.getData('baz'),
"node.setData({'bar': 'bar', 'baz': 'baz'})");
node.clearData('bar');
Assert.areEqual(undefined, node.getData('bar'),
"node.clearData('bar')");
Assert.areEqual('baz', node.getData('baz'),
"node.clearData('bar')");
node.clearData();
Assert.areEqual(undefined, node.getData('baz'),
"node.clearData()");
},
test_appendStyle: function() {
var html = '<style>body {height:100px}</style>';
Y.one('head').append(html);
Assert.areEqual('100px', Y.one('body').getStyle('height'),
"Y.one('head').append(" + html + ")");
},
test_ancestor: function() {
var node = Y.one('#test-table div div').ancestor('td');
Y.Assert.areEqual(byId('test-td'), node._node,
"Y.one('#test-table div').ancestor('td'))");
node = Y.Node.create('<div><div><table><tbody><tr></tr><tr></tr><tr><td><div><div class="inner"></div></div></td></tr></tbody></table></div></div>');
var inner = node.one('.inner');
inner.ancestor('td');
},
test_nodelistEvent: function() {
var nodelist = Y.all('div'),
item = nodelist.item(0),
evtObj = {
mousedown: function(e, foo, bar) {
Assert.areEqual('DIV', e.currentTarget.get('nodeName'), "e.currentTarget.get('nodeName')");
Assert.areEqual('foo', foo, "foo === 'foo'");
Assert.areEqual('bar', bar, "bar === 'bar'");
}
};
nodelist.on('click', function(e) {
Assert.areEqual(this, nodelist);
Assert.areEqual('DIV', e.currentTarget.get('nodeName'), "e.currentTarget.get('nodeName')");
});
Y.on(evtObj, null, nodelist, null, 'foo', 'bar');
nodelist.on(evtObj, null, null, 'foo', 'bar');
nodelist.on({mouseup: true}, function(e) {
Assert.areEqual(this, nodelist);
Assert.areEqual('DIV', e.currentTarget.get('nodeName'), "e.currentTarget.get('nodeName')");
});
nodelist.on({mouseup: function(e) {
Assert.areEqual(this, nodelist);
Assert.areEqual('DIV', e.currentTarget.get('nodeName'), "e.currentTarget.get('nodeName')");
}});
nodelist.on({keydown: true}, function(e) {
Assert.areEqual(this, nodelist.item(0));
Assert.areEqual('DIV', e.currentTarget.get('nodeName'), "e.currentTarget.get('nodeName')");
}, item);
nodelist.on({keydown: true}, function(e) {
Assert.areEqual(this, nodelist.item(0));
Assert.areEqual('DIV', e.currentTarget.get('nodeName'), "e.currentTarget.get('nodeName')");
}, item);
nodelist.after('click', function(e) {
Assert.areEqual(this, nodelist);
Assert.areEqual('DIV', e.currentTarget.get('nodeName'), "e.currentTarget.get('nodeName')");
});
Y.after(evtObj, null, nodelist, null, 'foo', 'bar');
nodelist.after(evtObj, null, null, 'foo', 'bar');
nodelist.after({mouseup: true}, function(e) {
Assert.areEqual(this, nodelist);
Assert.areEqual('DIV', e.currentTarget.get('nodeName'), "e.currentTarget.get('nodeName')");
});
nodelist.after({keydown: true}, function(e) {
Assert.areEqual(this, nodelist.item(0));
Assert.areEqual('DIV', e.currentTarget.get('nodeName'), "e.currentTarget.get('nodeName')");
}, item);
item.simulate('mousedown');
item.simulate('click');
item.simulate('mouseup');
item.simulate('keydown');
}
}));
Y.Test.Runner.add(suite);
Y.on('load', function() {
Y.Test.Runner.run();
}, window);
});
</script>
</body>
</html>