<!DOCTYPE html>
<html>
<head>
<style>
#fixedTransformed {
    position: fixed;
    transform: translateZ(0)
}
#fixedOverlapping {
    position: fixed;
    z-index: 0;
    width: 100%;
    height: 100%;
}
#moveMe {
    position: fixed;
    z-index: 1;
    background: green;
    width: 100px;
    height: 100px;
}
</style>
<script src="../resources/text-based-repaint.js"></script>
<script>
function repaintTest() {
    var mP = document.getElementById("moveMe");
    mP.style.top = "150px";
    mP.style.left = "150px";
}

runRepaintAndPixelTest();
</script>
</head>

<body>
    <p>This test checks that we correctly invalidate a shifted fixed positioned element overlapping another fixed positioned element.</p>
    <p>For this test, there should be only one green square below.</p>
    <div id="fixedTransformed"></div>
    <div id="fixedOverlapping"></div>
    <div id="moveMe"></div>
</body>