Bug: Form marked as dirty on initial load #1560
Description
🐞 bug report
Is this a regression?
Yes, the previous version 19.06 was working fine.
Problem started in 19.07.
Description
Form by default is marked as dirty when use ngx-mask in version 19.07.
🔬 Minimal Reproduction
import { Component, provideZoneChangeDetection } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { bootstrapApplication } from '@angular/platform-browser';
import { provideRouter } from '@angular/router';
import { NgxMaskDirective, provideEnvironmentNgxMask } from 'ngx-mask';
import { routes } from './app/app.routes';
@Component({
selector: 'app-root',
imports: [NgxMaskDirective, FormsModule],
template: `
<form #phoneForm="ngForm">
<input
name="phoneNumber"
[(ngModel)]="phoneNumber"
[pattern]="phoneValidationPattern"
[dropSpecialCharacters]="false"
[mask]="phoneMask"
/>
<div>
<p>Form is dirty: {{ phoneForm.dirty }}</p>
<p>Form is touched: {{ phoneForm.touched }}</p>
<p>Form is valid: {{ phoneForm.valid }}</p>
</div>
</form>
`,
})
export class AppComponentNew {
phoneValidationPattern =
/^\(?([2-9][0-8][0-9])\)?[\-. ]*([2-9][0-9]{2})[\-. ]*([0-9]{4})$/;
phoneMask = '(000) 000-0000';
phoneNumber = '3333333333';
}
bootstrapApplication(AppComponentNew, {
providers: [provideZoneChangeDetection({ eventCoalescing: true }), provideRouter(routes), provideEnvironmentNgxMask()]
})🔥 Exception or Error
Expected:
Form is dirty - false with initial loads
Actual:
🌍 Your Environment
Angular Version:
@angular-devkit/architect 0.1902.15
@angular-devkit/build-angular 19.2.15
@angular-devkit/core 19.2.15
@angular-devkit/schematics 19.2.15
@angular/cli 19.2.15
@schematics/angular 19.2.15
rxjs 7.8.2
typescript 5.7.3
zone.js 0.15.1
Anything else relevant?
Comparing v1.16.9...v1.17.0
I suspect this could be the cause
Before it checks new input value not equal current value but now that logic is removed so the value always emit?