From 2cd389c73da458c7cc93c721f72a63a9951b9432 Mon Sep 17 00:00:00 2001
From: George <george.balanesc@gmail.com>
Date: Wed, 8 Feb 2023 17:25:31 +0200
Subject: [PATCH] RED-6129, add ids to inputs.

---
 .../input-with-action/input-with-action.component.html | 10 +++++++++-
 .../input-with-action/input-with-action.component.ts   |  3 +++
 .../table-content/table-item/table-item.component.html |  2 +-
 3 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/src/lib/inputs/input-with-action/input-with-action.component.html b/src/lib/inputs/input-with-action/input-with-action.component.html
index 2859049..610d45d 100644
--- a/src/lib/inputs/input-with-action/input-with-action.component.html
+++ b/src/lib/inputs/input-with-action/input-with-action.component.html
@@ -1,5 +1,6 @@
 <form (submit)="executeAction(null)" [style.max-width]="computedWidth" [style.width]="computedWidth" class="iqser-input-group">
     <input
+        [id]="inputId"
         (ngModelChange)="valueChange.emit($event)"
         [(ngModel)]="value"
         [autocomplete]="autocomplete"
@@ -13,9 +14,16 @@
 
     <mat-icon *ngIf="isSearch && !hasContent" class="icon-right" svgIcon="iqser:search"></mat-icon>
 
-    <iqser-circle-button (action)="reset()" *ngIf="isSearch && hasContent" [size]="25" icon="iqser:close"></iqser-circle-button>
+    <iqser-circle-button
+        [buttonId]="inputId + '-clear'"
+        (action)="reset()"
+        *ngIf="isSearch && hasContent"
+        [size]="25"
+        icon="iqser:close"
+    ></iqser-circle-button>
 
     <iqser-circle-button
+        [buttonId]="actionButtonId"
         (action)="executeAction($event)"
         *ngIf="!isSearch"
         [disabled]="!hasContent"
diff --git a/src/lib/inputs/input-with-action/input-with-action.component.ts b/src/lib/inputs/input-with-action/input-with-action.component.ts
index 3ebf3be..66dc354 100644
--- a/src/lib/inputs/input-with-action/input-with-action.component.ts
+++ b/src/lib/inputs/input-with-action/input-with-action.component.ts
@@ -1,4 +1,5 @@
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Input, Output } from '@angular/core';
+import { randomString } from '../../utils';
 
 @Component({
     selector: 'iqser-input-with-action',
@@ -7,6 +8,8 @@ import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, In
     changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class InputWithActionComponent {
+    @Input() inputId = `${randomString() + '-search-input'}`;
+    @Input() actionButtonId = `${randomString() + '-action-input'}`;
     @Input() placeholder = '';
     @Input() hint?: string;
     @Input() width: number | 'full' = 250;
diff --git a/src/lib/listing/table-content/table-item/table-item.component.html b/src/lib/listing/table-content/table-item/table-item.component.html
index eef369e..62a632b 100644
--- a/src/lib/listing/table-content/table-item/table-item.component.html
+++ b/src/lib/listing/table-content/table-item/table-item.component.html
@@ -1,4 +1,4 @@
-<div (click)="toggleEntitySelected($event, entity)" *ngIf="selectionEnabled" class="selection-column">
+<div [id]="'select-' + entity.id" (click)="toggleEntitySelected($event, entity)" *ngIf="selectionEnabled" class="selection-column">
     <iqser-round-checkbox [active]="isSelected$ | async"></iqser-round-checkbox>
 </div>