[ACS-7768] ADF Form fields cleanup (#11484)

* [ACS-7768] ADF Form fields cleanup

* [ACS-7768] CR fixes

* [ACS-7768] Bring back label condition

* ACS-7768 Fixing storybook build

* [ACS-7768] Fix rebase issues

---------

Co-authored-by: Ehsan Rezaei <ehsan.rezaei@hyland.com>
This commit is contained in:
Michal Kinas
2026-01-27 08:10:15 +01:00
committed by GitHub
co-authored by Ehsan Rezaei
parent b2c105dd67
commit 1028df91da
78 changed files with 620 additions and 1167 deletions
@@ -63,7 +63,7 @@ describe('ProcessInstanceHeaderComponent', () => {
component.processInstance.ended = new Date('2016-11-03');
component.ngOnChanges();
fixture.detectChanges();
const valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-dateitem-ended"]');
const valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-date-value-ended"]');
expect(valueEl.innerText).toBe('Nov 3, 2016');
});
@@ -71,7 +71,7 @@ describe('ProcessInstanceHeaderComponent', () => {
component.processInstance.ended = null;
component.ngOnChanges();
fixture.detectChanges();
const valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-dateitem-ended"]');
const valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-date-value-ended"]');
expect(valueEl.innerText).toBe('ADF_PROCESS_LIST.PROPERTIES.END_DATE_DEFAULT');
});
@@ -97,7 +97,7 @@ describe('ProcessInstanceHeaderComponent', () => {
component.processInstance.started = new Date('2016-11-03');
component.ngOnChanges();
fixture.detectChanges();
const valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-dateitem-created"]');
const valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-date-value-created"]');
expect(valueEl.innerText).toBe('Nov 3, 2016');
});
@@ -9,7 +9,7 @@
<div class="adf-title" *ngIf="title">{{ title | translate}}</div>
<div class="content">
<div class="adf-start-process-definition-container">
<mat-form-field *ngIf="showSelectApplicationDropdown" [floatLabel]="'always'" class="adf-start-process-app-list" [subscriptSizing]="'dynamic'">
<mat-form-field *ngIf="showSelectApplicationDropdown" class="adf-start-process-app-list">
<mat-label>{{ 'ADF_PROCESS_LIST.START_PROCESS.FORM.LABEL.SELECT_APPLICATION' | translate }}</mat-label>
<mat-select
placeholder="{{ 'ADF_PROCESS_LIST.START_PROCESS.FORM.LABEL.SELECT_APPLICATION' | translate }}"
@@ -26,7 +26,7 @@
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field class="adf-process-input-container" [floatLabel]="'always'" [subscriptSizing]="'dynamic'">
<mat-form-field class="adf-process-input-container">
<mat-label>{{'ADF_PROCESS_LIST.START_PROCESS.FORM.LABEL.TYPE' | translate}}</mat-label>
<input
type="text"
@@ -62,7 +62,7 @@
</div>
</mat-form-field>
</div>
<mat-form-field class="adf-process-input-container adf-process-input-container-process-name" [floatLabel]="'always'">
<mat-form-field class="adf-process-input-container adf-process-input-container-process-name">
<mat-label>{{'ADF_PROCESS_LIST.START_PROCESS.FORM.LABEL.NAME' | translate}}</mat-label>
<input
matInput
@@ -191,19 +191,6 @@ describe('StartProcessComponent', () => {
expect(inputLabels.length).toBe(2);
});
it('should have floating labels for process name and type', async () => {
component.processDefinitionInput.setValue('My Default Name');
component.processNameInput.setValue('claim');
fixture.detectChanges();
await fixture.whenStable();
const inputLabelsNodes = document.querySelectorAll('.adf-start-process .adf-process-input-container');
inputLabelsNodes.forEach((labelNode) => {
expect(labelNode.getAttribute('ng-reflect-float-label')).toBe('always');
});
});
it('should load start form from service', async () => {
fixture.detectChanges();
await fixture.whenStable();
@@ -26,7 +26,6 @@ import { PROCESS_LIST_DIRECTIVES } from './process-list';
import { TASK_LIST_DIRECTIVES } from './task-list';
import { FORM_DIRECTIVES } from './form';
import { TASK_COMMENTS_DIRECTIVES } from './task-comments';
import { MAT_FORM_FIELD_DEFAULT_OPTIONS } from '@angular/material/form-field';
/**
* @deprecated use provider api instead, for example:
@@ -50,10 +49,7 @@ import { MAT_FORM_FIELD_DEFAULT_OPTIONS } from '@angular/material/form-field';
...PEOPLE_DIRECTIVES,
...FORM_DIRECTIVES
],
providers: [
provideTranslations('adf-process-services', 'assets/adf-process-services'),
{ provide: MAT_FORM_FIELD_DEFAULT_OPTIONS, useValue: { floatLabel: 'never' } }
],
providers: [provideTranslations('adf-process-services', 'assets/adf-process-services')],
exports: [
...PROCESS_COMMENTS_DIRECTIVES,
...PROCESS_LIST_DIRECTIVES,
@@ -184,7 +184,7 @@ describe('TaskHeaderComponent', () => {
await fixture.whenStable();
const datePicker = fixture.debugElement.query(By.css(`[data-automation-id="datepicker-dueDate"]`));
expect(datePicker).toBeNull();
expect(datePicker.classes['cdk-visually-hidden']).toBeTrue();
});
it('should set editable to true if the task has not completed yet', async () => {