fast/css/text-security.html

<script>

function finishTest()
{
    document.getElementById("test").setAttribute("class", "bullet");
    if (window.testRunner)
        testRunner.notifyDone();
}

function init()
{
    if (window.testRunner)
        testRunner.waitUntilDone();
    setTimeout(finishTest, 0);
}

</script>

<style>

@font-face {
    font-family: 'times';
    src: local('Times');
}

/* Match Mac OS X's font fallback behavior on Windows */

@font-face {
    font-family: 'times';
    src: local('Lucida Grande');
    /* black square and white bullet */
    unicode-range: U+25A0, U+25E6;
}

.square { -webkit-text-security: square; }
.bullet { -webkit-text-security: disc; }
.circle { -webkit-text-security: circle; }
.none { -webkit-text-security: disc; -webkit-text-security: none; }
.invalid { -webkit-text-security: disc; -webkit-text-security: not-secure; }

</style>

<body onload="init()">
<p>Bullets: <span class="bullet">xxx</span>.</p>
<p>Squares: <span class="square">xxx</span>.</p>
<p>Circles: <span class="circle">xxx</span>.</p>
<p>Plain letters: <span class="none">xxx</span>.</p>
<p>Bullets (invalid): <span class="invalid">xxx</span>.</p>
<p>Bullets (dynamic): <span id="test" class="square">xxx</span>.</p>
</body>