dom.html revision e69255aa5a65f8406ba2fabaf69fe4e1d05daf69
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore<html>
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore<head>
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore <title>YUI DOM Event Tests</title>
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore</head>
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore<body class="yui-skin-sam">
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore <div id="doc">
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore <div id="clickcontainer">
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore <div id="clicker1" class="clickers">click1</div>
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore <div id="clicker2" class="clickers">click2</div>
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore </div>
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore </div>
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore <!-- YUI3 Core //-->
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore <script type="text/javascript" src="/build/yui/yui-debug.js"></script>
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore <!-- Initialization process //-->
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore <script type="text/javascript">
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore YUI({
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore base: "/build/",
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore filter: 'debug',
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore combine: false,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore useConsole: true,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore logExclude: {yui:true, get: true, loader: true, Dom: true, Selector: true, Node: true, attribute: true, base: true, event: true, widget: true}
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore }).use('console', 'test', 'node', 'event-simulate', function (Y) {
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore // creating the console...
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore (new Y.Console()).render();
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore // starting the testing process
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore // add the test cases and suites
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Test.Runner.add(new Y.Test.Case({
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore name: "DOM Event Tests",
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore test_on_with_string: function() {
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore var clicked = false,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore context,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex1,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex2,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore obj = {
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore a: 1
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore };
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.on('click', function(e, extra1, extra2) {
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore clicked = true;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore context = this;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex1 = extra1;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex2 = extra2;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore }, '#clickcontainer', obj, 2, 3);
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Event.simulate(document.getElementById('clickcontainer'), 'click');
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.isTrue(clicked, "click handler via Y.on didn't work when passed a string.");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(1, context.a, "context didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(2, ex1, "extra arg1 didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(3, ex2, "extra arg2 didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore },
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore test_on_with_node: function() {
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore var clicked = false,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore context,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex1,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex2,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore obj = {
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore a: 1
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore },
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore node = Y.get('#clickcontainer');
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.on('click', function(e, extra1, extra2) {
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore clicked = true;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore context = this;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex1 = extra1;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex2 = extra2;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore }, node, obj, 2, 3);
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Event.simulate(document.getElementById('clickcontainer'), 'click');
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.isTrue(clicked, "click handler via Y.on didn't work when passed a node.");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(1, context.a, "context didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(2, ex1, "extra arg1 didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(3, ex2, "extra arg2 didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore },
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore test_node_on: function() {
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore var clicked = false,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore context,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex1,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex2,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore obj = {
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore a: 1
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore },
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore node = Y.get('#clickcontainer');
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore node.on('click', function(e, extra1, extra2) {
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore clicked = true;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore context = this;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex1 = extra1;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex2 = extra2;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore }, obj, 2, 3);
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Event.simulate(document.getElementById('clickcontainer'), 'click');
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.isTrue(clicked, "click handler didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(1, context.a, "context didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(2, ex1, "extra arg1 didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(3, ex2, "extra arg2 didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore },
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore test_nodelist_on: function() {
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore var clicked = 0,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore context,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex1,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex2,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore obj = {
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore a: 1
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore },
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore nodelist = Y.all('.clickers');
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore nodelist.on('click', function(e, extra1, extra2) {
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore clicked++;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore context = this;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex1 = extra1;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex2 = extra2;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore }, obj, 2, 3);
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Event.simulate(document.getElementById('clicker1'), 'click');
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(1, clicked, "click handler didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(1, context.a, "context didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore // Y.Assert.areEqual(2, ex1, "extra arg1 didn't work"); // bug #2528155
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore // Y.Assert.areEqual(3, ex2, "extra arg2 didn't work"); // bug #2528155
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Event.simulate(document.getElementById('clicker2'), 'click');
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(2, clicked, "click handler didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(1, context.a, "context didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore // Y.Assert.areEqual(2, ex1, "extra arg1 didn't work"); // bug #2528155
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore // Y.Assert.areEqual(3, ex2, "extra arg2 didn't work"); // bug #2528155
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore },
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore test_y_on_with_nodelist: function() {
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore var clicked = 0,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore context,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex1,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex2,
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore obj = {
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore a: 1
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore },
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore nodelist = Y.all('.clickers');
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.on('click', function(e, extra1, extra2) {
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore clicked++;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore context = this;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex1 = extra1;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore ex2 = extra2;
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore }, nodelist, obj, 2, 3);
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Event.simulate(document.getElementById('clicker1'), 'click');
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(1, clicked, "click handler didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(1, context.a, "context didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(2, ex1, "extra arg1 didn't work"); // bug #2528155
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(3, ex2, "extra arg2 didn't work"); // bug #2528155
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Event.simulate(document.getElementById('clicker2'), 'click');
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(2, clicked, "click handler didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(1, context.a, "context didn't work");
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(2, ex1, "extra arg1 didn't work"); // bug #2528155
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Assert.areEqual(3, ex2, "extra arg2 didn't work"); // bug #2528155
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore }
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore }));
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore //run all tests
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore Y.Test.Runner.run();
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore /* finishing the testing process */
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore });
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore </script>
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore</body>
e69255aa5a65f8406ba2fabaf69fe4e1d05daf69Adam Moore</html>