113 lines
1.9 KiB
HTML
113 lines
1.9 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<style>
|
|
|
|
#outer {
|
|
overflow: auto;
|
|
width: 200px;
|
|
height: 200px;
|
|
}
|
|
|
|
#inner {
|
|
position: relative;
|
|
height: 400px;
|
|
}
|
|
|
|
#inner:focus {
|
|
background-color: lightblue;
|
|
}
|
|
|
|
#inner:active {
|
|
background-color: blue;
|
|
}
|
|
|
|
#h, #h2 {
|
|
background: rgba(255, 255, 255, 0);
|
|
}
|
|
|
|
#h {
|
|
position: absolute;
|
|
height: 200px;
|
|
width: 200px;
|
|
}
|
|
|
|
#h2 {
|
|
position: absolute;
|
|
top: 200px;
|
|
height: 200px;
|
|
width: 100%;
|
|
}
|
|
|
|
#h:hover,
|
|
#h2:hover {
|
|
background: pink;
|
|
}
|
|
|
|
#h:active,
|
|
#h2:active {
|
|
background: red;
|
|
}
|
|
|
|
pre {
|
|
position: absolute;
|
|
left: 250px;
|
|
top: 80px;
|
|
}
|
|
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<p>Manual test for <a href="https://bugs.webkit.org/show_bug.cgi?id=38129">bug 38129</a></p>
|
|
|
|
<p>Click the div below and press the context menu key on your keyboard (Shift+F10 also works)</p>
|
|
|
|
<div id=outer>
|
|
<div id=inner tabindex=0>
|
|
<div id=h2></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id=h></div>
|
|
|
|
<pre></pre>
|
|
|
|
<script>
|
|
|
|
function cs(el)
|
|
{
|
|
if (window.getComputedStyle)
|
|
return window.getComputedStyle(el, '');
|
|
return el.currentStyle;
|
|
}
|
|
|
|
document.addEventListener('contextmenu', function(e)
|
|
{
|
|
var inner = document.querySelector('#inner');
|
|
var outer = document.querySelector('#outer');
|
|
var h = document.querySelector('#h');
|
|
var h2 = document.querySelector('#h2');
|
|
var result = [];
|
|
|
|
result.push(e.target, document.querySelector('#inner'));
|
|
result.push(cs(inner, '').backgroundColor, 'rgb(0, 0, 255)');
|
|
result.push(cs(h, '').backgroundColor, 'rgba(255, 255, 255, 0)');
|
|
result.push(cs(h2, '').backgroundColor, 'rgba(255, 255, 255, 0)');
|
|
|
|
var s = '';
|
|
for (var i = 0; i < result.length; i += 2) {
|
|
s += result[i] + ' == ' + result[i + 1] + ' - ' +
|
|
(result[i] == result[i + 1] ? 'PASS' : 'FAIL') + '<br>';
|
|
}
|
|
|
|
document.querySelector('pre').innerHTML = s;
|
|
|
|
return true;
|
|
}, false);
|
|
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|