@@ -32,32 +32,6 @@ import {
 } from './native';
 import {observeSelectMutations} from './select';
 
-/**
- * Normalizes a control value for comparison, collapsing an invalid `Date` to `null`.
- *
- * A `Date` with a `NaN` timestamp has no representation a date-like input can hold: assigning it to
- * `valueAsDate` empties the input, which then reads back as `null`. Treating the two as the same
- * value keeps that round-trip from looking like an edit.
- */
-function normalizeControlValue(value: unknown): unknown {
-  return value instanceof Date && Number.isNaN(value.getTime()) ? null : value;
-}
-
-/**
- * Compares two control values, treating `Date`s for the same instant as equal.
- *
- * Date-like inputs are read through `valueAsDate`, which returns a fresh `Date` on every access, so
- * identity comparison alone would report a change even when the input was never touched.
- */
-function controlValuesEqual(a: unknown, b: unknown): boolean {
-  const normalizedA = normalizeControlValue(a);
-  const normalizedB = normalizeControlValue(b);
-  if (normalizedA instanceof Date && normalizedB instanceof Date) {
-    return normalizedA.getTime() === normalizedB.getTime();
-  }
-  return Object.is(normalizedA, normalizedB);
-}
-
 export function nativeControlCreate(
   host: ControlDirectiveHost,
   parent: FormField<unknown>,
@@ -67,40 +41,42 @@ export function nativeControlCreate(
   validityMonitor: InputValidityMonitor,
 ): () => void {
   let updateMode = false;
-  // While true, a write that leaves the value untouched must not dirty the field.
-  //
-  // A native validity change isn't necessarily a user edit: the browser runs the `:valid` /
-  // `:invalid` animation as soon as the input is rendered, which would otherwise dirty every
-  // date-like field on load (#69632). Syncs that clear a parse error are exempt, because a parse
-  // error can only exist in response to the user typing something the input couldn't parse.
-  let dirtyOnlyIfValueChanged = false;
   const input = parent.nativeFormElement;
+  // The input's value as the DOM itself holds it, recorded after each write we make.
+  //
+  // Comparing model values can't tell a user edit from the browser reshaping what we wrote: an
+  // unparseable string or a `Date` the input can't represent is rejected and leaves the value
+  // empty, and a `Date` carrying more precision than the input keeps is truncated. In each case the
+  // value read back differs from the model through no action of the user, which would dirty every
+  // date-like field on load (#69632). The DOM's own string is the one representation both sides
+  // agree on.
+  let lastWrittenDomValue = input.value;
 
   // TODO: (perf) ok to always create this?
   const parser = createParser(
     // Read from the model value
     () => parent.state().value(),
     // Write to the buffered "control value"
-    (rawValue: unknown) => {
-      const state = parent.state();
-      if (dirtyOnlyIfValueChanged && controlValuesEqual(untracked(state.controlValue), rawValue)) {
-        return;
-      }
-      // Outside of `dirtyOnlyIfValueChanged` we intentionally write even when the value is
-      // unchanged, so that re-entering the same value still dirties the field.
-      state.controlValue.set(rawValue);
-    },
+    (rawValue: unknown) => parent.state().controlValue.set(rawValue),
     // Our parse function doesn't care about the raw value that gets passed in,
     // It just reads the newly parsed value directly off the input element.
     (_rawValue: unknown) => getNativeControlValue(input, parent.state().value, validityMonitor),
   );
 
   parseErrorsSource.set(parser.errors);
+  // Writes to the DOM and records what the DOM ended up holding, which is not necessarily what we
+  // asked for: the browser rejects values it can't parse and truncates ones carrying more precision
+  // than the input type keeps.
+  const writeNativeControlValue = (value: unknown) => {
+    setNativeControlValue(input, value);
+    lastWrittenDomValue = input.value;
+  };
+
   parent.onReset = () => {
     parser.reset();
     const value = parent.state().value();
     bindings['controlValue'] = value;
-    setNativeControlValue(input, value);
+    writeNativeControlValue(value);
   };
   // Pass undefined as the raw value since the parse function doesn't care about it.
   host.listenToDom('input', () => {
@@ -115,14 +91,21 @@ export function nativeControlCreate(
   // TODO: move extraction to first update pass?
   if (isInput(input) && inputRequiresValidityTracking(input)) {
     validityMonitor.watchValidity(parent.destroyRef, input, () => {
-      // Resolving a parse error is always a user edit, so let those syncs dirty the field even
-      // when the parsed value is unchanged.
-      dirtyOnlyIfValueChanged = untracked(parser.errors).length === 0;
-      try {
-        parser.setRawValue(undefined);
-      } finally {
-        dirtyOnlyIfValueChanged = false;
+      // The browser runs the `:valid` / `:invalid` animation as soon as the input renders, which is
+      // not a user edit. If the DOM still holds exactly what we last wrote then nothing changed and
+      // there is nothing to sync.
+      //
+      // Two states are exempt, because in both the user did edit the input while its `value` stayed
+      // empty: entering text the input can't convert (`badInput`, which reports an empty `value`),
+      // and clearing that text again, which resolves the parse error the previous sync recorded.
+      if (
+        untracked(parser.errors).length === 0 &&
+        !validityMonitor.isBadInput(input) &&
+        input.value === lastWrittenDomValue
+      ) {
+        return;
       }
+      parser.setRawValue(undefined);
     });
   }
 
@@ -179,7 +162,7 @@ export function nativeControlCreate(
       input.type === 'radio' && bindingUpdated(bindings, 'radioValue', input.value);
 
     if (controlValueChanged || radioValueChanged) {
-      setNativeControlValue(input, controlValue);
+      writeNativeControlValue(controlValue);
     }
 
     updateMode = true;
 
@@ -5690,6 +5690,90 @@ describe('field directive', () => {
       expect(Number.isNaN((field().value() as Date).getTime())).toBe(true);
     });
 
+    // A string the input can't parse as a date is rejected outright, so the DOM value stays empty
+    // while the model still holds the original string. Comparing the two as values reports a change
+    // on every sync and dirties the field on load. See #69632.
+    it('should not be dirty when the initial validity animation fires on an unparseable string model', () => {
+      @Component({
+        imports: [FormField],
+        template: `<input type="date" [formField]="f" />`,
+      })
+      class TestCmp {
+        f = form(signal('invalid-date'));
+      }
+
+      const fix = act(() => TestBed.createComponent(TestCmp));
+      const input = fix.nativeElement.firstChild as HTMLInputElement;
+      const field = fix.componentInstance.f;
+
+      // The browser refuses a value it can't parse as a date, leaving the input empty.
+      expect(input.value).toBe('');
+      expect(field().dirty()).toBe(false);
+
+      act(() => {
+        input.dispatchEvent(
+          new AnimationEvent('animationstart', {animationName: 'ng-invalid', bubbles: true}),
+        );
+      });
+
+      expect(field().dirty()).toBe(false);
+      // The model keeps the value the app supplied; the sync must not silently empty it.
+      expect(field().value()).toBe('invalid-date');
+    });
+
+    // A `Date` can hold more precision than any of these inputs keeps: `date` drops the time,
+    // `month` the day, `time` the date, and `week` snaps to the start of the week. The value read
+    // back therefore differs from the model through no action of the user. See #69632.
+    it('should not be dirty when the initial validity animation fires on a Date the input truncates', () => {
+      @Component({
+        imports: [FormField],
+        template: `
+          <input type="date" [formField]="f.date" />
+          <input type="month" [formField]="f.month" />
+          <input type="time" [formField]="f.time" />
+          <input type="week" [formField]="f.week" />
+        `,
+      })
+      class TestCmp {
+        f = form(
+          signal<{date: Date | null; month: Date | null; time: Date | null; week: Date | null}>({
+            date: new Date('2024-03-15T12:34:56.000Z'),
+            month: new Date('2024-03-15T12:34:56.000Z'),
+            time: new Date('2024-03-15T12:34:56.000Z'),
+            week: new Date('2024-03-15T12:34:56.000Z'),
+          }),
+        );
+      }
+
+      const fix = act(() => TestBed.createComponent(TestCmp));
+      const cmp = fix.componentInstance as TestCmp;
+      const inputs = Array.from(
+        (fix.nativeElement as HTMLElement).querySelectorAll('input'),
+      ) as HTMLInputElement[];
+      const fields = [cmp.f.date, cmp.f.month, cmp.f.time, cmp.f.week];
+
+      expect(inputs.map((i) => i.getAttribute('type'))).toEqual(['date', 'month', 'time', 'week']);
+      expect(fields.map((field) => field().dirty())).toEqual([false, false, false, false]);
+
+      act(() => {
+        for (const input of inputs) {
+          input.dispatchEvent(
+            new AnimationEvent('animationstart', {animationName: 'ng-invalid', bubbles: true}),
+          );
+        }
+      });
+
+      expect(fields.map((field) => field().dirty())).toEqual([false, false, false, false]);
+      // Each model keeps its full instant rather than the truncated value the input displays.
+      const instant = new Date('2024-03-15T12:34:56.000Z').getTime();
+      expect(fields.map((field) => (field().value() as Date).getTime())).toEqual([
+        instant,
+        instant,
+        instant,
+        instant,
+      ]);
+    });
+
     // The initial `:valid` / `:invalid` animation fires for every input type we track validity on,
     // not just `date`, so none of them may dirty their field on load. See #69632.
     //