<!DOCTYPE html>
<html>
<head>
<script>
if (window.testRunner)
testRunner.dumpAsText()
function runTest()
{
document.body.offsetWidth;
var elt = document.elementFromPoint(130, 130);
if (elt == document.getElementById('progress'))
document.getElementById('console').innerHTML = 'PASS';
else
document.getElementById('console').innerHTML = 'FAIL';
}
</script>
<style type="text/css">
#progress {
width: 2px;
height: 2px;
margin: 10px;
transform: scale(60);
-webkit-transform-origin: 0 0;
background-color: blue;
}
#progress:hover {
background-color: red;
}
</style>
</head>
<body onload="runTest()">
<p>The blue box only responds to hover over some of its area. It has a scale() transform</p>
<div id="progress"></div>
<div id="console"></div>
</body>
</html>