| <!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" class="placeholder-shown"></textarea> |
| <textarea placeholder="WebKit">Foobar</textarea> |
| </div> |
| <div> |
| <input> |
| <input placeholder> |
| <input placeholder="WebKit" class="placeholder-shown"> |
| <input placeholder="WebKit" value="Foobar"> |
| </div> |
| <div> |
| <input type=""> |
| <input type="" placeholder> |
| <input type="" placeholder="WebKit" class="placeholder-shown"> |
| <input type="" placeholder="WebKit" value="Foobar"> |
| </div> |
| <div> |
| <input type="hidden"> |
| <input type="hidden" placeholder> |
| <input type="hidden" placeholder="WebKit" class="placeholder-shown"> |
| <input type="hidden" placeholder="WebKit" value="Foobar"> |
| </div> |
| <div> |
| <input type="text"> |
| <input type="text" placeholder> |
| <input type="text" placeholder="WebKit" class="placeholder-shown"> |
| <input type="text" placeholder="WebKit" value="Foobar"> |
| </div> |
| <div> |
| <input type="tel"> |
| <input type="tel" placeholder> |
| <input type="tel" placeholder="WebKit" class="placeholder-shown"> |
| <input type="tel" placeholder="WebKit" value="Foobar"> |
| </div> |
| <div> |
| <input type="url"> |
| <input type="url" placeholder> |
| <input type="url" placeholder="WebKit" class="placeholder-shown"> |
| <input type="url" placeholder="WebKit" value="Foobar"> |
| </div> |
| <div> |
| <input type="email"> |
| <input type="email" placeholder> |
| <input type="email" placeholder="WebKit" class="placeholder-shown"> |
| <input type="email" placeholder="WebKit" value="Foobar"> |
| </div> |
| <div> |
| <input type="password"> |
| <input type="password" placeholder> |
| <input type="password" placeholder="WebKit" class="placeholder-shown"> |
| <input type="password" placeholder="WebKit" value="Foobar"> |
| </div> |
| <div> |
| <input type="datetime"> |
| <input type="datetime" placeholder> |
| <input type="datetime" placeholder="WebKit" class="placeholder-shown"> |
| <input type="datetime" placeholder="WebKit" value="Foobar"> |
| </div> |
| <div> |
| <input type="number"> |
| <input type="number" placeholder> |
| <input type="number" placeholder="WebKit" class="placeholder-shown"> |
| <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> |