blob: 71b810bd6618802290c3171331e501fd754dded5 [file] [log] [blame]
<!DOCTYPE html>
<html>
<head>
<style>
input, textarea {
height: 8px;
}
:placeholder-shown {
background-color: green;
}
</style>
</head>
<body>
<p>This test checks how various input elements are styled when :placeholder-shown is applied.</p>
<div>
<textarea></textarea>
<textarea placeholder></textarea>
<textarea placeholder="WebKit"></textarea>
<textarea placeholder="WebKit">Foobar</textarea>
</div>
<div>
<input>
<input placeholder>
<input placeholder="WebKit">
<input placeholder="WebKit" value="Foobar">
</div>
<div>
<input type="">
<input type="" placeholder>
<input type="" placeholder="WebKit">
<input type="" placeholder="WebKit" value="Foobar">
</div>
<div>
<input type="hidden">
<input type="hidden" placeholder>
<input type="hidden" placeholder="WebKit">
<input type="hidden" placeholder="WebKit" value="Foobar">
</div>
<div>
<input type="text">
<input type="text" placeholder>
<input type="text" placeholder="WebKit">
<input type="text" placeholder="WebKit" value="Foobar">
</div>
<div>
<input type="tel">
<input type="tel" placeholder>
<input type="tel" placeholder="WebKit">
<input type="tel" placeholder="WebKit" value="Foobar">
</div>
<div>
<input type="url">
<input type="url" placeholder>
<input type="url" placeholder="WebKit">
<input type="url" placeholder="WebKit" value="Foobar">
</div>
<div>
<input type="email">
<input type="email" placeholder>
<input type="email" placeholder="WebKit">
<input type="email" placeholder="WebKit" value="Foobar">
</div>
<div>
<input type="password">
<input type="password" placeholder>
<input type="password" placeholder="WebKit">
<input type="password" placeholder="WebKit" value="Foobar">
</div>
<div>
<input type="datetime">
<input type="datetime" placeholder>
<input type="datetime" placeholder="WebKit">
<input type="datetime" placeholder="WebKit" value="Foobar">
</div>
<div>
<input type="number">
<input type="number" placeholder>
<input type="number" placeholder="WebKit">
<input type="number" placeholder="WebKit" value="0">
</div>
<div>
<input type="range">
<input type="range" placeholder>
<input type="range" placeholder="WebKit">
<input type="range" placeholder="WebKit" value="1">
</div>
<div>
<input type="checkbox">
<input type="checkbox" placeholder>
<input type="checkbox" placeholder="WebKit">
<input type="checkbox" placeholder="WebKit" value="Foobar">
</div>
<div>
<input type="radio">
<input type="radio" placeholder>
<input type="radio" placeholder="WebKit">
<input type="radio" placeholder="WebKit" value="Foobar">
</div>
<div>
<input type="submit">
<input type="submit" placeholder>
<input type="submit" placeholder="WebKit">
<input type="submit" placeholder="WebKit" value="Foobar">
</div>
</body>
</html>