Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Reactive forms, updateOn: 'blur' - control getting dirty when blurring despite no changes #410

Open
michael-koch787 opened this issue Jan 13, 2025 · 0 comments

Comments

@michael-koch787
Copy link

michael-koch787 commented Jan 13, 2025

Create binding via reactive forms, set updateOn: blur.

formGroup = new FormGroup({
    control: new FormControl('text', { updateOn: 'blur' }),
  },
  { updateOn: 'blur' }
);

Focusing & blurring marks control as dirty despite no changes being made.
Example: https://stackblitz.com/edit/stackblitz-starters-tiunc5dt?file=src%2Fmain.ts

I think I found the cause:
If I create a FormControl with an initial value, that value is written to initalValue

public writeValue(value: string | null): void {
  if (this._editor && this._editor.initialized) {
    this._editor.setContent(isNullOrUndefined(value) ? '' : value);
  } else {
    this.initialValue = value === null ? undefined : value;
  }
}

Later in the initEditor method emitOnChange is called if an initialValue is set.
Therefore the control gets marked as dirty.

if (typeof this.initialValue === 'string') {
  this.ngZone.run(() => {
    editor.setContent(this.initialValue as string);
    if (editor.getContent() !== this.initialValue) {
      this.emitOnChange(editor);           // <- that's the problem I guess
    }
    if (this.onInitNgModel !== undefined) {
      this.onInitNgModel.emit(editor as unknown as EventObj<any>);
    }
  });
}

What is the expected behavior?
Control should not be marked as dirty.

Which versions of TinyMCE/TinyMCE-Angular, and which browser / OS are affected by this issue? Did this work in previous versions of TinyMCE or TinyMCE-Angular?
"@angular/core": "^19.0.0"
"@tinymce/tinymce-angular": "^8.0.1"

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant