| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../../../resources/js-test-pre.js"></script> |
| </head> |
| <body> |
| <p id="description">Clicking middle of input type=range with padding should set the value to middle.</p> |
| <div id="console"></div> |
| <input id="ltr" type=range min=0 max=50 step=1 value="0" style="width: 100px; padding: 0 40px;"> |
| <input id="rtl" dir="rtl" type=range min=0 max=50 step=1 value="0" style="width: 100px; padding: 0 40px;"> |
| <input id="vertical_ltr" type=range min=0 max=50 step=1 value="0" style="-webkit-appearance:slider-vertical; width: 20px; height: 100px; padding: 40px 0;"> |
| <input id="vertical_rtl" dir="rtl" type=range min=0 max=50 step=1 value="0" style="-webkit-appearance:slider-vertical; width: 20px; height: 100px; padding: 40px 0;"> |
| <script> |
| function clickHorizontalSlider(input, offsetLeft) { |
| var centerY = input.offsetTop + input.offsetHeight / 2; |
| if (!window.eventSender) |
| return; |
| eventSender.mouseMoveTo(input.offsetLeft + offsetLeft, centerY); |
| eventSender.mouseDown(); |
| eventSender.mouseUp(); |
| } |
| |
| function clickVerticalSlider(input, offsetTop) { |
| var centerX = input.offsetLeft + input.offsetWidth / 2; |
| if (!window.eventSender) |
| return; |
| eventSender.mouseMoveTo(centerX, input.offsetTop + offsetTop); |
| eventSender.mouseDown(); |
| eventSender.mouseUp(); |
| } |
| |
| var input_ltr = document.getElementById("ltr"); |
| clickHorizontalSlider(input_ltr, 90); // left padding (40px) + middle (50px) |
| shouldBe('input_ltr.value', '"25"'); |
| |
| var input_rtl = document.getElementById("rtl"); |
| clickHorizontalSlider(input_rtl, 90); // left padding (40px) + middle (50px) |
| shouldBe('input_rtl.value', '"25"'); |
| |
| var input_vertical_ltr = document.getElementById("vertical_rtl"); |
| clickVerticalSlider(input_vertical_ltr, 90); // top padding (40px) + middle (50px) |
| shouldBe('input_vertical_ltr.value', '"25"'); |
| |
| var input_vertical_rtl = document.getElementById("vertical_rtl"); |
| clickVerticalSlider(input_vertical_rtl, 90); // top padding (40px) + middle (50px) |
| shouldBe('input_vertical_rtl.value', '"25"'); |
| </script> |
| |
| <script src="../../../resources/js-test-post.js"></script> |
| </body> |
| </html> |
