| <!DOCTYPE html> |
| |
| <html> |
| <head> |
| <title>Cobalt pointer test</title> |
| <script src='black_box_js_test_utils.js'></script> |
| <style> |
| .size10 { |
| padding: 10px; |
| } |
| .size20 { |
| padding: 20px; |
| } |
| .size40 { |
| padding: 40px; |
| } |
| .black { |
| background-color: #FFF; |
| } |
| .grey { |
| background-color: #888; |
| } |
| .green { |
| background-color: #0F0; |
| } |
| .blue { |
| background-color: #00F; |
| } |
| .cyan { |
| background-color: #0FF; |
| } |
| .purple { |
| background-color: #F0F; |
| } |
| .yellow { |
| background-color: #FF0; |
| } |
| </style> |
| </head> |
| <body class="black"> |
| <script> |
| // Fail if the test is not finished within 15 seconds. |
| var kTimeout = 30 * 1000; |
| var failTimer = setTimeout(fail, kTimeout); |
| |
| function fail() { |
| console.log("Failing due to timeout!"); |
| assertTrue(false); |
| } |
| |
| function phasename(phase) { |
| switch(phase) { |
| case 0: return 'none'; |
| case 1: return 'capturing'; |
| case 2: return 'at target'; |
| case 3: return 'bubbling'; |
| } |
| return ' [unknown: ' + phase + ']'; |
| } |
| |
| var expected_events = [ |
| // name, id, phase |
| // actions.move_to_element(top_one).pause(_SLEEP_AFTER_MOVE_TIME) |
| ['pointermove', 'top_one', 'at target'], |
| ['pointermove', 'top', 'bubbling'], |
| ['pointermove', 'outer', 'bubbling'], |
| ['mousemove', 'top_one', 'at target'], |
| ['mousemove', 'top', 'bubbling'], |
| ['mousemove', 'outer', 'bubbling'], |
| ['pointerover', 'top_one', 'at target'], |
| ['pointerover', 'top', 'bubbling'], |
| ['pointerover', 'outer', 'bubbling'], |
| ['pointerenter', 'top_one', 'at target'], |
| ['pointerenter', 'top', 'at target'], |
| ['pointerenter', 'outer', 'at target'], |
| ['mouseover', 'top_one', 'at target'], |
| ['mouseover', 'top', 'bubbling'], |
| ['mouseover', 'outer', 'bubbling'], |
| ['mouseenter', 'top_one', 'at target'], |
| ['mouseenter', 'top', 'at target'], |
| ['mouseenter', 'outer', 'at target'], |
| // actions.move_to_element(top_two).pause(_SLEEP_AFTER_MOVE_TIME) |
| ['pointerout', 'top_one', 'at target'], |
| ['pointerout', 'top', 'bubbling'], |
| ['pointerout', 'outer', 'bubbling'], |
| ['pointerleave', 'top_one', 'at target'], |
| ['mouseout', 'top_one', 'at target'], |
| ['mouseout', 'top', 'bubbling'], |
| ['mouseout', 'outer', 'bubbling'], |
| ['mouseleave', 'top_one', 'at target'], |
| ['pointermove', 'top_two', 'at target'], |
| ['pointermove', 'top', 'bubbling'], |
| ['pointermove', 'outer', 'bubbling'], |
| ['mousemove', 'top_two', 'at target'], |
| ['mousemove', 'top', 'bubbling'], |
| ['mousemove', 'outer', 'bubbling'], |
| ['pointerover', 'top_two', 'at target'], |
| ['pointerover', 'top', 'bubbling'], |
| ['pointerover', 'outer', 'bubbling'], |
| ['pointerenter', 'top_two', 'at target'], |
| ['pointerenter', 'top', 'at target'], |
| ['pointerenter', 'outer', 'at target'], |
| ['mouseover', 'top_two', 'at target'], |
| ['mouseover', 'top', 'bubbling'], |
| ['mouseover', 'outer', 'bubbling'], |
| ['mouseenter', 'top_two', 'at target'], |
| ['mouseenter', 'top', 'at target'], |
| ['mouseenter', 'outer', 'at target'], |
| // actions.move_to_element_with_offset(top_two, 10, 10).pause(_SLEEP_AFTER_MOVE_TIME) |
| ['pointermove', 'top_two', 'at target'], |
| ['pointermove', 'top', 'bubbling'], |
| ['pointermove', 'outer', 'bubbling'], |
| ['mousemove', 'top_two', 'at target'], |
| ['mousemove', 'top', 'bubbling'], |
| ['mousemove', 'outer', 'bubbling'], |
| // actions.move_to_element_with_offset(top_two, 0, 0).pause(_SLEEP_AFTER_MOVE_TIME) |
| ['pointermove', 'top_two', 'at target'], |
| ['pointermove', 'top', 'bubbling'], |
| ['pointermove', 'outer', 'bubbling'], |
| ['mousemove', 'top_two', 'at target'], |
| ['mousemove', 'top', 'bubbling'], |
| ['mousemove', 'outer', 'bubbling'], |
| // actions.move_to_element_with_offset(top_two, -10, 0).pause(_SLEEP_AFTER_MOVE_TIME) |
| ['pointerout', 'top_two', 'at target'], |
| ['pointerout', 'top', 'bubbling'], |
| ['pointerout', 'outer', 'bubbling'], |
| ['pointerleave', 'top_two', 'at target'], |
| ['mouseout', 'top_two', 'at target'], |
| ['mouseout', 'top', 'bubbling'], |
| ['mouseout', 'outer', 'bubbling'], |
| ['mouseleave', 'top_two', 'at target'], |
| ['pointermove', 'top_one', 'at target'], |
| ['pointermove', 'top', 'bubbling'], |
| ['pointermove', 'outer', 'bubbling'], |
| ['mousemove', 'top_one', 'at target'], |
| ['mousemove', 'top', 'bubbling'], |
| ['mousemove', 'outer', 'bubbling'], |
| ['pointerover', 'top_one', 'at target'], |
| ['pointerover', 'top', 'bubbling'], |
| ['pointerover', 'outer', 'bubbling'], |
| ['pointerenter', 'top_one', 'at target'], |
| ['pointerenter', 'top', 'at target'], |
| ['pointerenter', 'outer', 'at target'], |
| ['mouseover', 'top_one', 'at target'], |
| ['mouseover', 'top', 'bubbling'], |
| ['mouseover', 'outer', 'bubbling'], |
| ['mouseenter', 'top_one', 'at target'], |
| ['mouseenter', 'top', 'at target'], |
| ['mouseenter', 'outer', 'at target'], |
| // actions.click(top_three) |
| ['pointerout', 'top_one', 'at target'], |
| ['pointerout', 'top', 'bubbling'], |
| ['pointerout', 'outer', 'bubbling'], |
| ['pointerleave', 'top_one', 'at target'], |
| ['mouseout', 'top_one', 'at target'], |
| ['mouseout', 'top', 'bubbling'], |
| ['mouseout', 'outer', 'bubbling'], |
| ['mouseleave', 'top_one', 'at target'], |
| ['pointermove', 'top_three', 'at target'], |
| ['pointermove', 'top', 'bubbling'], |
| ['pointermove', 'outer', 'bubbling'], |
| ['mousemove', 'top_three', 'at target'], |
| ['mousemove', 'top', 'bubbling'], |
| ['mousemove', 'outer', 'bubbling'], |
| ['pointerover', 'top_three', 'at target'], |
| ['pointerover', 'top', 'bubbling'], |
| ['pointerover', 'outer', 'bubbling'], |
| ['pointerenter', 'top_three', 'at target'], |
| ['pointerenter', 'top', 'at target'], |
| ['pointerenter', 'outer', 'at target'], |
| ['mouseover', 'top_three', 'at target'], |
| ['mouseover', 'top', 'bubbling'], |
| ['mouseover', 'outer', 'bubbling'], |
| ['mouseenter', 'top_three', 'at target'], |
| ['mouseenter', 'top', 'at target'], |
| ['mouseenter', 'outer', 'at target'], |
| ['pointerdown', 'top_three', 'at target'], |
| ['pointerdown', 'top', 'bubbling'], |
| ['pointerdown', 'outer', 'bubbling'], |
| ['mousedown', 'top_three', 'at target'], |
| ['mousedown', 'top', 'bubbling'], |
| ['mousedown', 'outer', 'bubbling'], |
| ['pointerup', 'top_three', 'at target'], |
| ['pointerup', 'top', 'bubbling'], |
| ['pointerup', 'outer', 'bubbling'], |
| ['mouseup', 'top_three', 'at target'], |
| ['mouseup', 'top', 'bubbling'], |
| ['mouseup', 'outer', 'bubbling'], |
| ['click', 'top_three', 'at target'], |
| ['click', 'top', 'bubbling'], |
| ['click', 'outer', 'bubbling'], |
| // actions.click_and_hold(top_four) |
| ['pointerout', 'top_three', 'at target'], |
| ['pointerout', 'top', 'bubbling'], |
| ['pointerout', 'outer', 'bubbling'], |
| ['pointerleave', 'top_three', 'at target'], |
| ['mouseout', 'top_three', 'at target'], |
| ['mouseout', 'top', 'bubbling'], |
| ['mouseout', 'outer', 'bubbling'], |
| ['mouseleave', 'top_three', 'at target'], |
| ['pointermove', 'top_four', 'at target'], |
| ['pointermove', 'top', 'bubbling'], |
| ['pointermove', 'outer', 'bubbling'], |
| ['mousemove', 'top_four', 'at target'], |
| ['mousemove', 'top', 'bubbling'], |
| ['mousemove', 'outer', 'bubbling'], |
| ['pointerover', 'top_four', 'at target'], |
| ['pointerover', 'top', 'bubbling'], |
| ['pointerover', 'outer', 'bubbling'], |
| ['pointerenter', 'top_four', 'at target'], |
| ['pointerenter', 'top', 'at target'], |
| ['pointerenter', 'outer', 'at target'], |
| ['mouseover', 'top_four', 'at target'], |
| ['mouseover', 'top', 'bubbling'], |
| ['mouseover', 'outer', 'bubbling'], |
| ['mouseenter', 'top_four', 'at target'], |
| ['mouseenter', 'top', 'at target'], |
| ['mouseenter', 'outer', 'at target'], |
| ['pointerdown', 'top_four', 'at target'], |
| ['pointerdown', 'top', 'bubbling'], |
| ['pointerdown', 'outer', 'bubbling'], |
| ['mousedown', 'top_four', 'at target'], |
| ['mousedown', 'top', 'bubbling'], |
| ['mousedown', 'outer', 'bubbling'], |
| // actions.release(top_five) |
| ['pointermove', 'top_four', 'at target'], |
| ['pointermove', 'top', 'bubbling'], |
| ['pointermove', 'outer', 'bubbling'], |
| ['mousemove', 'top_four', 'at target'], |
| ['mousemove', 'top', 'bubbling'], |
| ['mousemove', 'outer', 'bubbling'], |
| ['pointerup', 'top_four', 'at target'], |
| ['pointerup', 'top', 'bubbling'], |
| ['pointerup', 'outer', 'bubbling'], |
| ['mouseup', 'top_four', 'at target'], |
| ['mouseup', 'top', 'bubbling'], |
| ['mouseup', 'outer', 'bubbling'], |
| ['click', 'top_four', 'at target'], |
| ['click', 'top', 'bubbling'], |
| ['click', 'outer', 'bubbling'], |
| // actions.move_to_element(top_six).pause(_SLEEP_AFTER_MOVE_TIME) |
| ['pointerout', 'top_four', 'at target'], |
| ['pointerout', 'top', 'bubbling'], |
| ['pointerout', 'outer', 'bubbling'], |
| ['pointerleave', 'top_four', 'at target'], |
| ['mouseout', 'top_four', 'at target'], |
| ['mouseout', 'top', 'bubbling'], |
| ['mouseout', 'outer', 'bubbling'], |
| ['mouseleave', 'top_four', 'at target'], |
| ['pointermove', 'top_six', 'at target'], |
| ['pointermove', 'top', 'bubbling'], |
| ['pointermove', 'outer', 'bubbling'], |
| ['mousemove', 'top_six', 'at target'], |
| ['mousemove', 'top', 'bubbling'], |
| ['mousemove', 'outer', 'bubbling'], |
| ['pointerover', 'top_six', 'at target'], |
| ['pointerover', 'top', 'bubbling'], |
| ['pointerover', 'outer', 'bubbling'], |
| ['pointerenter', 'top_six', 'at target'], |
| ['pointerenter', 'top', 'at target'], |
| ['pointerenter', 'outer', 'at target'], |
| ['mouseover', 'top_six', 'at target'], |
| ['mouseover', 'top', 'bubbling'], |
| ['mouseover', 'outer', 'bubbling'], |
| ['mouseenter', 'top_six', 'at target'], |
| ['mouseenter', 'top', 'at target'], |
| ['mouseenter', 'outer', 'at target'], |
| // actions.move_to_element(bottom_six).pause(_SLEEP_AFTER_MOVE_TIME) |
| ['pointerout', 'top_six', 'at target'], |
| ['pointerout', 'top', 'bubbling'], |
| ['pointerout', 'outer', 'bubbling'], |
| ['pointerleave', 'top_six', 'at target'], |
| ['pointerleave', 'top', 'at target'], |
| ['mouseout', 'top_six', 'at target'], |
| ['mouseout', 'top', 'bubbling'], |
| ['mouseout', 'outer', 'bubbling'], |
| ['mouseleave', 'top_six', 'at target'], |
| ['mouseleave', 'top', 'at target'], |
| ['pointermove', 'bottom_six', 'at target'], |
| ['pointermove', 'bottom', 'bubbling'], |
| ['pointermove', 'outer', 'bubbling'], |
| ['mousemove', 'bottom_six', 'at target'], |
| ['mousemove', 'bottom', 'bubbling'], |
| ['mousemove', 'outer', 'bubbling'], |
| ['pointerover', 'bottom_six', 'at target'], |
| ['pointerover', 'bottom', 'bubbling'], |
| ['pointerover', 'outer', 'bubbling'], |
| ['pointerenter', 'bottom_six', 'at target'], |
| ['pointerenter', 'bottom', 'at target'], |
| ['pointerenter', 'outer', 'at target'], |
| ['mouseover', 'bottom_six', 'at target'], |
| ['mouseover', 'bottom', 'bubbling'], |
| ['mouseover', 'outer', 'bubbling'], |
| ['mouseenter', 'bottom_six', 'at target'], |
| ['mouseenter', 'bottom', 'at target'], |
| ['mouseenter', 'outer', 'at target'], |
| // actions.click(bottom_five) |
| ['pointerout', 'bottom_six', 'at target'], |
| ['pointerout', 'bottom', 'bubbling'], |
| ['pointerout', 'outer', 'bubbling'], |
| ['pointerleave', 'bottom_six', 'at target'], |
| ['mouseout', 'bottom_six', 'at target'], |
| ['mouseout', 'bottom', 'bubbling'], |
| ['mouseout', 'outer', 'bubbling'], |
| ['mouseleave', 'bottom_six', 'at target'], |
| ['pointermove', 'bottom_five', 'at target'], |
| ['pointermove', 'bottom', 'bubbling'], |
| ['pointermove', 'outer', 'bubbling'], |
| ['mousemove', 'bottom_five', 'at target'], |
| ['mousemove', 'bottom', 'bubbling'], |
| ['mousemove', 'outer', 'bubbling'], |
| ['pointerover', 'bottom_five', 'at target'], |
| ['pointerover', 'bottom', 'bubbling'], |
| ['pointerover', 'outer', 'bubbling'], |
| ['pointerenter', 'bottom_five', 'at target'], |
| ['pointerenter', 'bottom', 'at target'], |
| ['pointerenter', 'outer', 'at target'], |
| ['mouseover', 'bottom_five', 'at target'], |
| ['mouseover', 'bottom', 'bubbling'], |
| ['mouseover', 'outer', 'bubbling'], |
| ['mouseenter', 'bottom_five', 'at target'], |
| ['mouseenter', 'bottom', 'at target'], |
| ['mouseenter', 'outer', 'at target'], |
| ['pointerdown', 'bottom_five', 'at target'], |
| ['pointerdown', 'bottom', 'bubbling'], |
| ['pointerdown', 'outer', 'bubbling'], |
| ['pointerup', 'bottom_five', 'at target'], |
| ['pointerup', 'bottom', 'bubbling'], |
| ['pointerup', 'outer', 'bubbling'], |
| ['click', 'bottom_five', 'at target'], |
| ['click', 'bottom', 'bubbling'], |
| ['click', 'outer', 'bubbling'], |
| // actions.click_and_hold(bottom_four) |
| ['pointerout', 'bottom_five', 'at target'], |
| ['pointerout', 'bottom', 'bubbling'], |
| ['pointerout', 'outer', 'bubbling'], |
| ['pointerleave', 'bottom_five', 'at target'], |
| ['mouseout', 'bottom_five', 'at target'], |
| ['mouseout', 'bottom', 'bubbling'], |
| ['mouseout', 'outer', 'bubbling'], |
| ['mouseleave', 'bottom_five', 'at target'], |
| ['pointermove', 'bottom_four', 'at target'], |
| ['pointermove', 'bottom', 'bubbling'], |
| ['pointermove', 'outer', 'bubbling'], |
| ['mousemove', 'bottom_four', 'at target'], |
| ['mousemove', 'bottom', 'bubbling'], |
| ['mousemove', 'outer', 'bubbling'], |
| ['pointerover', 'bottom_four', 'at target'], |
| ['pointerover', 'bottom', 'bubbling'], |
| ['pointerover', 'outer', 'bubbling'], |
| ['pointerenter', 'bottom_four', 'at target'], |
| ['pointerenter', 'bottom', 'at target'], |
| ['pointerenter', 'outer', 'at target'], |
| ['mouseover', 'bottom_four', 'at target'], |
| ['mouseover', 'bottom', 'bubbling'], |
| ['mouseover', 'outer', 'bubbling'], |
| ['mouseenter', 'bottom_four', 'at target'], |
| ['mouseenter', 'bottom', 'at target'], |
| ['mouseenter', 'outer', 'at target'], |
| ['pointerdown', 'bottom_four', 'at target'], |
| ['pointerdown', 'bottom', 'bubbling'], |
| ['pointerdown', 'outer', 'bubbling'], |
| // actions.release(bottom_three) |
| ['pointermove', 'bottom_four', 'at target'], |
| ['pointermove', 'bottom', 'bubbling'], |
| ['pointermove', 'outer', 'bubbling'], |
| ['pointerup', 'bottom_four', 'at target'], |
| ['pointerup', 'bottom', 'bubbling'], |
| ['pointerup', 'outer', 'bubbling'], |
| ['click', 'bottom_four', 'at target'], |
| ['click', 'bottom', 'bubbling'], |
| ['click', 'outer', 'bubbling'], |
| // actions.move_to_element(bottom_two).pause(_SLEEP_AFTER_MOVE_TIME) |
| ['pointerout', 'bottom_four', 'at target'], |
| ['pointerout', 'bottom', 'bubbling'], |
| ['pointerout', 'outer', 'bubbling'], |
| ['pointerleave', 'bottom_four', 'at target'], |
| ['mouseout', 'bottom_four', 'at target'], |
| ['mouseout', 'bottom', 'bubbling'], |
| ['mouseout', 'outer', 'bubbling'], |
| ['mouseleave', 'bottom_four', 'at target'], |
| ['pointermove', 'bottom_two', 'at target'], |
| ['mousemove', 'bottom_two', 'at target'], |
| ['pointerover', 'bottom_two', 'at target'], |
| ['pointerenter', 'bottom_two', 'at target'], |
| ['pointerenter', 'bottom', 'at target'], |
| ['pointerenter', 'outer', 'at target'], |
| ['mouseover', 'bottom_two', 'at target'], |
| ['mouseenter', 'bottom_two', 'at target'], |
| ['mouseenter', 'bottom', 'at target'], |
| ['mouseenter', 'outer', 'at target'], |
| // actions.move_to_element(bottom_one).pause(_SLEEP_AFTER_MOVE_TIME) |
| ['pointerout', 'bottom_two', 'at target'], |
| ['pointerleave', 'bottom_two', 'at target'], |
| ['mouseout', 'bottom_two', 'at target'], |
| ['mouseleave', 'bottom_two', 'at target'], |
| ['pointermove', 'bottom_one', 'at target'], |
| ['mousemove', 'bottom_one', 'at target'], |
| ['pointerover', 'bottom_one', 'at target'], |
| ['pointerenter', 'bottom_one', 'at target'], |
| ['pointerenter', 'bottom', 'at target'], |
| ['pointerenter', 'outer', 'at target'], |
| ['mouseover', 'bottom_one', 'at target'], |
| ['mouseenter', 'bottom_one', 'at target'], |
| ['mouseenter', 'bottom', 'at target'], |
| ['mouseenter', 'outer', 'at target'], |
| // find_element_by_id(runner, 'end').click() |
| ['pointerout', 'bottom_one', 'at target'], |
| ['pointerleave', 'bottom_one', 'at target'], |
| ['pointerleave', 'bottom', 'at target'], |
| ['mouseout', 'bottom_one', 'at target'], |
| ['mouseleave', 'bottom_one', 'at target'], |
| ['mouseleave', 'bottom', 'at target'], |
| ['pointermove', 'end', 'at target'], |
| ['pointermove', 'outer', 'bubbling'], |
| ['mousemove', 'end', 'at target'], |
| ['mousemove', 'outer', 'bubbling'], |
| ['pointerover', 'end', 'at target'], |
| ['pointerover', 'outer', 'bubbling'], |
| ['pointerenter', 'end', 'at target'], |
| ['pointerenter', 'outer', 'at target'], |
| ['mouseover', 'end', 'at target'], |
| ['mouseover', 'outer', 'bubbling'], |
| ['mouseenter', 'end', 'at target'], |
| ['mouseenter', 'outer', 'at target'], |
| ['pointerdown', 'end', 'at target'], |
| ['pointerdown', 'outer', 'bubbling'], |
| ['mousedown', 'end', 'at target'], |
| ['mousedown', 'outer', 'bubbling'], |
| ['pointerup', 'end', 'at target'], |
| ['pointerup', 'outer', 'bubbling'], |
| ['mouseup', 'end', 'at target'], |
| ['mouseup', 'outer', 'bubbling'], |
| ['click', 'end', 'at target'], |
| ['click', 'outer', 'bubbling']]; |
| |
| var current_event_number = 0 |
| var failure_count = 0; |
| |
| function CheckEvent(name, id, phase) { |
| while ((current_event_number < expected_events.length) && |
| ((expected_events[current_event_number][0] != name) || |
| (expected_events[current_event_number][1] != id) || |
| (expected_events[current_event_number][2] != phase))) { |
| console.log('ERROR: Missing Event [\'' + |
| expected_events[current_event_number][0] + '\', \'' + |
| expected_events[current_event_number][1] + '\', \'' + |
| expected_events[current_event_number][2] + '\'],'); |
| failure_count += 1; |
| current_event_number += 1; |
| } |
| if (current_event_number < expected_events.length) { |
| current_event_number += 1; |
| } else { |
| failure_count += 1; |
| console.log('ERROR: Unexpected Event [\'' + name + '\', \'' + |
| id + '\', \'' + phase + '\'],'); |
| } |
| } |
| |
| function LogEvent(e) { |
| var pointertype = e.pointerType ? e.pointerType + ' ' : ''; |
| var id = this.getAttribute('id') |
| CheckEvent(e.type, id, phasename(e.eventPhase)) |
| console.log(e.type + ' ' + pointertype + id + |
| ' (' + this.getAttribute('class') + ')' + |
| ' [' + phasename(e.eventPhase) + ']' + |
| ' (' + e.screenX + ',' + e.screenY + ')'); |
| } |
| |
| function EndTest(e) { |
| console.log('Ending test.') |
| assertTrue(failure_count == 0); |
| onEndTest(); |
| } |
| |
| function Cancel(e) { |
| console.log('cancel'); |
| e.preventDefault(); |
| } |
| |
| function Stop(e) { |
| console.log('stop'); |
| e.stopPropagation(); |
| } |
| |
| function Capture(e) { |
| console.log('capture'); |
| e.target.setPointerCapture(e.pointerId); |
| } |
| |
| function SetHandlers(event, classname, callback) { |
| var elements = document.getElementsByClassName(classname); |
| for (var i = 0; i < elements.length; ++i) { |
| elements[i].addEventListener(event, callback); |
| } |
| } |
| |
| function SetAllHandlers(prefix, classname, callback) { |
| SetHandlers(prefix + 'enter', classname, callback); |
| SetHandlers(prefix + 'leave', classname, callback); |
| SetHandlers(prefix + 'over', classname, callback); |
| SetHandlers(prefix + 'out', classname, callback); |
| SetHandlers(prefix + 'down', classname, callback); |
| SetHandlers(prefix + 'up', classname, callback); |
| SetHandlers(prefix + 'move', classname, callback); |
| } |
| |
| window.onload = function() { |
| SetAllHandlers('mouse', 'track', LogEvent); |
| SetAllHandlers('pointer', 'track', LogEvent); |
| SetHandlers('click', 'track', LogEvent); |
| SetAllHandlers('mouse', 'cancel', Cancel); |
| SetAllHandlers('pointer', 'cancel', Cancel); |
| SetAllHandlers('mouse', 'stop', Stop); |
| SetAllHandlers('pointer', 'stop', Stop); |
| SetHandlers('pointerdown', 'capture', Capture); |
| SetHandlers('click', 'end', EndTest); |
| console.log("Setup finished"); |
| setupFinished(); |
| } |
| |
| </script> |
| <div id="outer" class="track size40 grey"> |
| <div id="top" class="track size20 blue"> |
| <span id="top_one" class="track size10 cyan"></span> |
| <span id="top_two" class="track size10 purple"></span> |
| *A* |
| <span id="top_three" class="track size10 yellow"></span> |
| *B* |
| <span id="top_four" class="track capture size10 grey"></span> |
| <span id="top_five" class="track size10 green"></span> |
| <span id="top_six" class="track size10 cyan"></span> |
| </div> |
| <div id="bottom" class="track size20 green"> |
| <span id="bottom_one" class="track stop size10 cyan"></span> |
| <span id="bottom_two" class="track stop size10 purple"></span> |
| *A* |
| <span id="bottom_three" class="track cancel size10 yellow"></span> |
| *B* |
| <span id="bottom_four" class="track cancel capture size10 grey"></span> |
| <span id="bottom_five" class="track cancel size10 blue"></span> |
| <span id="bottom_six" class="track size10 cyan"></span> |
| </div> |
| <div id="end" class="end track size10 blue"> |
| </div> |
| </body> |
| </html> |
