101 lines
3.1 KiB
HTML
101 lines
3.1 KiB
HTML
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
|
|
<html>
|
|
<head>
|
|
<script src="../../resources/js-test-pre.js"></script>
|
|
</head>
|
|
<body>
|
|
<p id="description"></p>
|
|
<div id="console"></div>
|
|
<script>
|
|
description('<select> selection test for scrolling.');
|
|
|
|
var parent = document.createElement('div');
|
|
parent.innerHTML = '<select id="sl1" multiple size=5>'
|
|
+ '<option>one</option>'
|
|
+ '<option>two</option>'
|
|
+ '<option>three</option>'
|
|
+ '<option>four</option>'
|
|
+ '<option>five</option>'
|
|
+ '<option>six</option>'
|
|
+ '<option>seven</option>'
|
|
+ '<option>eight</option>'
|
|
+ '<option>nine</option>'
|
|
+ '<option>ten</option>'
|
|
+ '<option>eleven</option>'
|
|
+ '<option>twelve</option>'
|
|
+ '<option>thirteen</option>'
|
|
+ '<option>fourteen</option>'
|
|
+ '<option>fifteen</option>'
|
|
+ '<option>sixteen</option>'
|
|
+ '<option>seventeen</option>'
|
|
+ '</select>'
|
|
+ '<select id="sl2" multiple style="height: 135px; border: 10px solid; padding: 5px;">'
|
|
+ '<option>one</option>'
|
|
+ '<option>two</option>'
|
|
+ '<option>three</option>'
|
|
+ '</select>';
|
|
document.body.appendChild(parent);
|
|
|
|
// Determine the item height.
|
|
var sl1 = document.getElementById('sl1');
|
|
var sl2 = document.getElementById('sl2');
|
|
var itemHeight = Math.floor(sl1.offsetHeight / sl1.size);
|
|
sl1.removeAttribute('size');
|
|
var height = itemHeight * 9 + 9;
|
|
sl1.setAttribute('style', 'height: ' + height + 'px; border: 10px solid; padding: 5px;');
|
|
|
|
function mouseDownOnSelect(selId, index)
|
|
{
|
|
var sl = document.getElementById(selId);
|
|
var borderPaddingTop = 15;
|
|
var borderPaddingLeft = 15;
|
|
var y = index * itemHeight + itemHeight / 3 - window.pageYOffset + borderPaddingTop;
|
|
var event = document.createEvent("MouseEvent");
|
|
event.initMouseEvent("mousedown", true, true, document.defaultView, 1, sl.offsetLeft + borderPaddingLeft, sl.offsetTop + y, sl.offsetLeft + borderPaddingLeft, sl.offsetTop + y, false, false, false, false, 0, document);
|
|
sl.dispatchEvent(event);
|
|
}
|
|
|
|
function selectionPattern(selectId)
|
|
{
|
|
var select = document.getElementById(selectId);
|
|
var result = "";
|
|
for (var i = 0; i < select.options.length; i++)
|
|
result += select.options[i].selected ? '1' : '0';
|
|
return result;
|
|
}
|
|
|
|
mouseDownOnSelect("sl1", 0);
|
|
shouldBe('selectionPattern("sl1")', '"10000000000000000"');
|
|
|
|
mouseDownOnSelect("sl1", 1);
|
|
shouldBe('selectionPattern("sl1")', '"01000000000000000"');
|
|
|
|
mouseDownOnSelect("sl1", 6);
|
|
shouldBe('selectionPattern("sl1")', '"00000010000000000"');
|
|
|
|
mouseDownOnSelect("sl1", 7);
|
|
shouldBe('selectionPattern("sl1")', '"00000001000000000"');
|
|
|
|
mouseDownOnSelect("sl1", 8);
|
|
shouldBe('selectionPattern("sl1")', '"00000001000000000"');
|
|
|
|
mouseDownOnSelect("sl1", 0);
|
|
shouldBe('selectionPattern("sl1")', '"01000000000000000"');
|
|
|
|
for (i = 0; i < 9; i++)
|
|
mouseDownOnSelect("sl1", 7);
|
|
shouldBe('selectionPattern("sl1")', '"00000000000000001"');
|
|
|
|
mouseDownOnSelect("sl2", 1);
|
|
shouldBe('selectionPattern("sl2")', '"010"');
|
|
|
|
mouseDownOnSelect("sl2", 3);
|
|
shouldBe('selectionPattern("sl2")', '"010"');
|
|
|
|
mouseDownOnSelect("sl2", 2);
|
|
shouldBe('selectionPattern("sl2")', '"001"');
|
|
</script>
|
|
<script src="../../resources/js-test-post.js"></script>
|
|
</body>
|
|
</html>
|