2 <?xml-stylesheet href=
"chrome://global/skin" type=
"text/css"?>
3 <?xml-stylesheet href=
"chrome://mochikit/content/tests/SimpleTest/test.css" type=
"text/css"?>
5 https://bugzilla.mozilla.org/show_bug.cgi?id=199692
7 <window title=
"Test for Bug 199692"
8 id=
"test_bug199692.xhtml"
9 xmlns:
html=
"http://www.w3.org/1999/xhtml"
10 xmlns:
xul=
"http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
11 xmlns=
"http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
13 <script src=
"chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
14 <script type=
"text/javascript">
16 customElements.define(
"test-xul-element", class CustomElement extends XULElement {
19 const template = document.getElementById(
"template");
20 this.attachShadow({mode:
"open"})
21 .appendChild(template.content.cloneNode(true));
26 <body id=
"body" xmlns=
"http://www.w3.org/1999/xhtml">
27 <template id=
"template">
28 <xul:label id=
"anon-label" value=
"ANON"/>
30 <a target=
"_blank" href=
"https://bugzilla.mozilla.org/show_bug.cgi?id=199692">Mozilla Bug
199692</a>
32 <vbox id=
"content" style=
"position: relative;"
33 xmlns=
"http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
34 <xul:label id=
"non-anon-label" value=
"a textbox!:" control=
"textbox"/>
35 <html:textarea id=
"textbox" rows=
"4"/>
36 <xul:radiogroup style=
"outline: 2px solid orange;">
37 <xul:radio id=
"unselected-radio" label=
"Orange" style=
"outline: 2px solid red;"/>
38 <xul:radio id=
"selected-radio" label=
"Violet" selected=
"true"/>
39 <xul:radio id=
"disabled-radio" label=
"Yellow" disabled=
"true"/>
41 <test-xul-element id=
"bound" style=
"border: 2px solid green;"></test-xul-element>
44 <script class=
"testbody" type=
"text/javascript">
46 SimpleTest.waitForExplicitFinish();
48 // Before onload, XUL docs have no root frame.
49 is(document.elementFromPoint(
10,
10), null,
50 "Calls to elementFromPoint before onload should return null");
54 return {
"x": e.getBoundingClientRect().x + e.getBoundingClientRect().width/
2,
55 "y": e.getBoundingClientRect().y + e.getBoundingClientRect().height/
2 };
57 function lower_right(e) {
58 return {
"x": e.getBoundingClientRect().x + e.getBoundingClientRect().width - d,
59 "y": e.getBoundingClientRect().y + e.getBoundingClientRect().height - d };
61 function upper_left(e) {
62 return {
"x": e.getBoundingClientRect().x + d,
63 "y": e.getBoundingClientRect().y + d };
65 function scrollbar_button(e) { // a bit down from upper right
66 return {
"x": e.getBoundingClientRect().x + e.getBoundingClientRect().width - d,
67 "y": e.getBoundingClientRect().y + d +
15 };
70 function test(ptFunc, id, message) {
71 var pt = ptFunc($(id));
72 var e = document.elementFromPoint(pt.x, pt.y);
73 ok(e != null, message +
" (returned null)");
74 is(e.id, id, message);
78 // Avoid hardcoding x,y pixel values, to better deal with differing default
79 // font sizes or other layout defaults.
81 test(middle, 'textbox',
"Point within textbox should return textbox element");
82 test(lower_right, 'textbox',
"Point on textbox's scrollbar should return textbox element");
83 test(scrollbar_button, 'textbox',
"Point on textbox's scrollbar button should return textbox element");
84 test(middle, 'non-anon-label',
"Point on label should return label");
85 test(upper_left, 'bound',
"Point on custom element content should return custom element");
89 $(
"textbox").setAttribute(
"value",
90 "lorem ipsum dolor sit amet " +
91 "lorem ipsum dolor sit amet " +
92 "lorem ipsum dolor sit amet " +
93 "lorem ipsum dolor sit amet " +
94 "lorem ipsum dolor sit amet " +
95 "lorem ipsum dolor sit amet " +
96 "lorem ipsum dolor sit amet "); // force scrollbars to appear
97 addLoadEvent(do_test);