[Bug report]: TdsTextField not marked as 'touched' after unfocusing

[Patrick2607]

Requirements before reporting

• [X] No duplicated issue reported.
• [X] I have checked the latest version if the bug exist there. See all available packages at npmJS.com
• [X] I have followed the installation guide.

Package versions

@scania/tegel-angular: 1.6.1

Browser

Firefox

Framework

Angular

Version

Angular 16.2.0

Reproduction steps

1. Add <tds-text-field> to html template
2. Add formControl property to it
3. Log or render the touched property
4. Click inside the textbox
5. Click outside the textbox

Code example

<form [formGroup]="testForm">
  <tds-text-field
    ngDefaultControl
    [formControl]="testForm.controls.text"
    type="text"
    size="lg"
    label="Bugreport"
    label-position="inside"
    placeholder="Bugreport" />

  <p>Touched: {{ testForm.controls.text.touched }}</p>
</form>

interface TestForm {
  text: FormControl<string | null>;
}

@Component({...})
export class TestComponent {
  readonly testForm = this.fb.group<TestForm>({
    text: this.fb.control(''),
  });
}

Now I have temporarily solved this issue by creating a directive for the tds-text-field. I manually mark the control as dirty and subsequently mark the view as changed in the tdsBlur() handle:

@Directive({ selector: 'tds-text-field[tdsExt]' })
export class TdsTextFieldExtDirective implements OnDestroy {
  private readonly tdsTextField = inject(TdsTextField);
  private readonly cdr = inject(ChangeDetectorRef);

  @Input({ alias: 'formControl', required: true }) control!: FormControl;

  private readonly tdsBlurSub = this.tdsTextField.tdsBlur
    .pipe(
      tap(() => {
        this.control.markAsTouched();
        this.cdr.markForCheck();
      })
    )
    .subscribe();

  ngOnDestroy(): void {
    this.tdsBlurSub.unsubscribe();
  }

  // ...
}

Screenshots

Current:

Expected:

Expected behaviour

When a user focuses on a text field and subsequently unfocuses, the field should be marked as touched.

Console errors

No response

Contact information

[email protected]