43 lines
1.1 KiB
HTML
43 lines
1.1 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>client rect precision test</title>
|
|
<style>
|
|
#test {
|
|
width: 4.5px;
|
|
height: 4.5px;
|
|
background: navy;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="test"></div>
|
|
<div id="console">
|
|
Box above should be 5x5px.<br>
|
|
</div>
|
|
</body>
|
|
<script>
|
|
var testElement = document.getElementById('test');
|
|
var consoleElement = document.getElementById('console');
|
|
|
|
function test()
|
|
{
|
|
var rect = testElement.getBoundingClientRect();
|
|
var width = rect.right - rect.left;
|
|
|
|
if (width == 4.5 && testElement.clientWidth == 5)
|
|
log('PASS: getBoundingClientRect reports width with subpixel precision (4.5) and clientWidth reports snapped size (5).');
|
|
else
|
|
log('FAIL: getBoundingClientRect reports width of ' + width + ', expected 4.5. clientWidth reports width of ' + testElement.clientWidth + ', expected 5.');
|
|
}
|
|
|
|
function log(str)
|
|
{
|
|
consoleElement.appendChild(document.createTextNode(str));
|
|
consoleElement.appendChild(document.createElement('br'));
|
|
}
|
|
|
|
test();
|
|
</script>
|
|
</html>
|