FormsModule: untouched text input is not pristine in IE 11

[macjohnny]

I'm submitting a ... (check one with "x")

[x ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior
When showing a form in IE 11 with an input field, the initial state of the field is not pristine, leading to error messages being shown to the user before he touched the field.

Expected behavior
The field state should be pristine until the user first entered and removed some text. This works fine in e.g. Google Chrome

Minimal reproduction of the problem with instructions
http://embed.plnkr.co/fm7lH2/
The red error message should only be display when the user entered and removed some text.

What is the motivation / use case for changing the behavior?
Form validation errors should only be displayed when a user touched the form.

Please tell us about your environment:
Windows 7 / IE 11

• Angular version: 2.4.7

• Browser: IE 11

• Language: TypeScript

• Node (for AoT issues): node --version = v6.3.1

[macjohnny]

see angular/angular#14667

[macjohnny]

according to angular/angular#14667 (comment), this is a angular material issue.

[szykov]

It is definitely a material issue. Removing material module from imports solves the issue.

[mmalerba]

Interesting, it does seem to be somehow related to material, though not necessarily mdInput. I am able to reproduce by adding this to the input demo page of the material demo app, but putting this by itself in a plunker I do not see the issue:

<input class="demo-dirty-test" ngModel [placeholder]="'placeholder'">

I will investigate further.

[mmalerba]

It looks like the source of this bug is the fact that MdInputDirective sets up an @Input() on placeholder and then re-binds it in the host. Ideally this should be fixed in angular core.

Here's an example of this happening with pure angular, no material: http://plnkr.co/edit/cpLxYzEVceJ4MUGiOXi5?p=preview

[mmalerba]

Will be fixed in core (follow angular/angular#14667), so closing this one

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}