Placeholder class is not removed on input[type='email']

[oliverbenns]

Any text added to the input is also treated as a placeholder (is removed when refocused).

[fidian]

Would you tell me more information? For instance, is it in all browsers or a specific browser/version that you are seeing this behavior?

[oliverbenns]

Hey. Yep I'm experiencing this in Chrome, so I'm expecting all browsers.

So the original placeholder appears as normal, I click the input field, the placeholder disappears as expected.

However, it fails to remove the .placeholder class, giving me .placeholder styles.

Then, if I blur the input, and refocus into it, any text that I've entered into it is removed (acting like a placeholder).

[fidian]

Before I try to replicate the behavior with a fiddle of my own, do you have somewhere online that I can see this behavior? Also, what OS are you using and what version of Chrome are you running? It shouldn't matter, but I'd like to make sure that I test with as similar of an environment as possible.

[oliverbenns]

Yeah absolutely.

Browser: Chrome 38.0.2125.104
Angular: v1.2.0
OS: Mac Yosemite

Unfortunately I can't upload it as it's a company project. We defaulted to a type=text field in the end (client deadlines). But you can view the test environment here: url removed 9/4/2015 . It'll be up for a week or so, hope this helps.

[fidian]

Interestingly, this is because of the validation associated with <input type="email">. I found discussion on this as Angular issue #1426. I guess I can't use the model's value and instead much check if the element has a value. I have a demo up on Plunker that really shows this off well. Enter a valid email and the form below updates. Any time the email is invalid, the value on the model is empty.

[fidian]

I made a change that works for me - could you test the issue-5 branch to see how well it works for you?

[CullenShane]

Issue-5 branch is working quite nicely for this issue.

[vitvad]

Issue-5 branch fix this issue and seems fix issues/9

[fidian]

Merged.