+ @if ( (field.name || field?.required) && !field.leftLabels) { {{ field.name | translate }} }
{
expect(testingUtils.getByCSS('.adf-invalid')).toBeTruthy();
});
- it('should be able to display label with asterisk', async () => {
- const asterisk = testingUtils.getByCSS('.adf-asterisk').nativeElement;
+ it('should be able to display label with asterisk and input field is required', async () => {
+ const formField = await testingUtils.getMatFormField();
+ const formControl = await formField.getControl();
- expect(asterisk).toBeTruthy();
- expect(asterisk?.textContent).toEqual('*');
+ expect(formControl.isRequired).toBeTruthy();
+
+ const inputField = testingUtils.getByCSS('.adf-input').nativeElement;
+ expect(inputField.hasAttribute('required')).toBeTruthy();
});
});
@@ -147,5 +150,22 @@ describe('DecimalComponent', () => {
const adfLeftLabel = testingUtils.getByCSS('.adf-left-label');
expect(adfLeftLabel).toBeNull();
});
+
+ it('should be able to display label with asterisk when leftlabel is true', async () => {
+ widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', leftLabels: true }), {
+ id: 'decimal-id',
+ name: 'decimal-name',
+ value: '',
+ type: FormFieldTypes.DECIMAL,
+ readOnly: false,
+ required: true
+ });
+
+ fixture.detectChanges();
+ const asterisk = testingUtils.getByCSS('.adf-asterisk').nativeElement;
+
+ expect(asterisk).toBeTruthy();
+ expect(asterisk?.textContent).toEqual('*');
+ });
});
});
diff --git a/lib/core/src/lib/form/components/widgets/multiline-text/multiline-text.widget.html b/lib/core/src/lib/form/components/widgets/multiline-text/multiline-text.widget.html
index 6b8991c6a9..ef5b3d11cc 100644
--- a/lib/core/src/lib/form/components/widgets/multiline-text/multiline-text.widget.html
+++ b/lib/core/src/lib/form/components/widgets/multiline-text/multiline-text.widget.html
@@ -1,23 +1,31 @@
-
-
-
- {{ field.name | translate }}*
-
-
-
-
- {{ field.name | translate }}*
+
+ @if( (field.name || this.field?.required) && !field.leftLabels) {
+
+ {{ field.name | translate }}
+ }
{
expect(testingUtils.getByCSS('.adf-invalid')).toBeTruthy();
});
- it('should be able to display label with asterisk', async () => {
- const asterisk = testingUtils.getByCSS('.adf-asterisk').nativeElement;
+ it('should be able to display label with asterisk and input field is required', async () => {
+ const formField = await testingUtils.getMatFormField();
+ const formControl = await formField.getControl();
- expect(asterisk).toBeTruthy();
- expect(asterisk.textContent).toEqual('*');
+ expect(formControl.isRequired).toBeTruthy();
+
+ const inputField = testingUtils.getByCSS('.adf-input').nativeElement;
+ expect(inputField.hasAttribute('required')).toBeTruthy();
});
});
@@ -220,5 +223,22 @@ describe('NumberWidgetComponent', () => {
const adfLeftLabel = testingUtils.getByCSS('.adf-left-label');
expect(adfLeftLabel).toBeNull();
});
+
+ it('should be able to display label with asterisk', async () => {
+ widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', leftLabels: true }), {
+ id: 'number-id',
+ name: 'number-name',
+ value: '',
+ type: FormFieldTypes.NUMBER,
+ readOnly: false,
+ required: true
+ });
+ fixture.detectChanges();
+
+ const asterisk = testingUtils.getByCSS('.adf-asterisk').nativeElement;
+
+ expect(asterisk).toBeTruthy();
+ expect(asterisk.textContent).toEqual('*');
+ });
});
});
diff --git a/lib/core/src/lib/form/components/widgets/text/text.widget.html b/lib/core/src/lib/form/components/widgets/text/text.widget.html
index 3f007d8eb8..8ea1c81deb 100644
--- a/lib/core/src/lib/form/components/widgets/text/text.widget.html
+++ b/lib/core/src/lib/form/components/widgets/text/text.widget.html
@@ -8,15 +8,16 @@
-
-
- {{ field.name | translate }}*
+
+ @if ( (field.name || this.field?.required) && !field.leftLabels) {
+ {{ field.name | translate }}
+ }
{
expect(testingUtils.getByCSS('.adf-invalid')).toBeTruthy();
});
- it('should be able to display label with asterisk', async () => {
- fixture.detectChanges();
- await fixture.whenStable();
+ it('should be able to display label with asterisk and input field is required', async () => {
+ const formField = await testingUtils.getMatFormField();
+ const formControl = await formField.getControl();
- const asterisk = testingUtils.getByCSS('.adf-asterisk').nativeElement;
+ expect(formControl.isRequired).toBeTruthy();
- expect(asterisk).toBeTruthy();
- expect(asterisk.textContent).toEqual('*');
+ const inputField = testingUtils.getByCSS('.adf-input').nativeElement;
+ expect(inputField.hasAttribute('required')).toBeTruthy();
});
});
@@ -437,5 +437,23 @@ describe('TextWidgetComponent', () => {
expect(adfLeftLabel).toBeNull();
});
});
+
+ it('should be able to display label with asterisk', async () => {
+ widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', leftLabels: true }), {
+ id: 'text-id',
+ name: 'text-name',
+ value: '',
+ type: FormFieldTypes.TEXT,
+ readOnly: false,
+ required: true
+ });
+ fixture.detectChanges();
+ await fixture.whenStable();
+
+ const asterisk = testingUtils.getByCSS('.adf-asterisk').nativeElement;
+
+ expect(asterisk).toBeTruthy();
+ expect(asterisk.textContent).toEqual('*');
+ });
});
});
diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.html b/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.html
index 7327e709b5..5102a5f58a 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.html
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/date/date-cloud.widget.html
@@ -14,19 +14,20 @@
>
-
- {{field.name | translate }} ({{field.dateDisplayFormat}})*
+
+ @if ( (field.name || field?.required) && !field.leftLabels) {
+
+ {{field.name | translate }} ({{field.dateDisplayFormat}})
+
+ }
{
let widget: DateCloudWidgetComponent;
@@ -28,6 +31,8 @@ describe('DateCloudWidgetComponent', () => {
let element: HTMLElement;
let adapter: DateAdapter;
let form: FormModel;
+ let loader: HarnessLoader;
+ let testingUtils: UnitTestingUtils;
beforeEach(() => {
TestBed.configureTestingModule({
@@ -39,8 +44,10 @@ describe('DateCloudWidgetComponent', () => {
fixture = TestBed.createComponent(DateCloudWidgetComponent);
adapter = fixture.debugElement.injector.get(DateAdapter);
+ loader = TestbedHarnessEnvironment.loader(fixture);
widget = fixture.componentInstance;
element = fixture.nativeElement;
+ testingUtils = new UnitTestingUtils(fixture.debugElement, loader);
});
it('should not call onFieldChanged on init', () => {
@@ -445,13 +452,15 @@ describe('DateCloudWidgetComponent', () => {
});
});
- it('should be able to display label with asterisk', () => {
+ it('should be able to display label with asterisk', async () => {
fixture.detectChanges();
+ const formField = await testingUtils.getMatFormField();
+ const formControl = await formField.getControl();
- const asterisk: HTMLElement = element.querySelector('.adf-asterisk');
+ expect(formControl.isRequired).toBeTruthy();
- expect(asterisk).toBeTruthy();
- expect(asterisk.textContent).toEqual('*');
+ const inputField = await testingUtils.getByCSS('.adf-input').nativeElement;
+ expect(inputField.hasAttribute('required')).toBeTruthy();
});
it('should be invalid after user interaction without typing', () => {
diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/display-external-property/display-external-property.widget.html b/lib/process-services-cloud/src/lib/form/components/widgets/display-external-property/display-external-property.widget.html
index 9496fc3fca..a708c00e0a 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/display-external-property/display-external-property.widget.html
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/display-external-property/display-external-property.widget.html
@@ -11,16 +11,19 @@
-
-
+
+ @if( (field.name || field?.required) && !field.leftLabels) {
+
+ {{ field.name | translate }}
+
+ }
diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/display-external-property/display-external-property.widget.spec.ts b/lib/process-services-cloud/src/lib/form/components/widgets/display-external-property/display-external-property.widget.spec.ts
index 94d1fefd69..e2c46e8a3c 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/display-external-property/display-external-property.widget.spec.ts
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/display-external-property/display-external-property.widget.spec.ts
@@ -25,6 +25,7 @@ import { DisplayExternalPropertyWidgetComponent } from './display-external-prope
import { FormCloudService } from '../../../services/form-cloud.service';
import { By } from '@angular/platform-browser';
import { ProcessServiceCloudTestingModule } from '../../../../testing/process-service-cloud.testing.module';
+import { UnitTestingUtils } from '../../../../../../../core/src/lib/testing/unit-testing-utils';
describe('DisplayExternalPropertyWidgetComponent', () => {
let loader: HarnessLoader;
@@ -32,6 +33,7 @@ describe('DisplayExternalPropertyWidgetComponent', () => {
let fixture: ComponentFixture;
let element: HTMLElement;
let formCloudService: FormCloudService;
+ let testingUtils: UnitTestingUtils;
beforeEach(() => {
TestBed.configureTestingModule({
@@ -42,8 +44,10 @@ describe('DisplayExternalPropertyWidgetComponent', () => {
fixture = TestBed.createComponent(DisplayExternalPropertyWidgetComponent);
widget = fixture.componentInstance;
element = fixture.nativeElement;
+
loader = TestbedHarnessEnvironment.loader(fixture);
formCloudService = TestBed.inject(FormCloudService);
+ testingUtils = new UnitTestingUtils(fixture.debugElement, loader);
});
it('should display initial value', async () => {
@@ -126,11 +130,14 @@ describe('DisplayExternalPropertyWidgetComponent', () => {
fixture.detectChanges();
});
- it('should be able to display label with asterisk', () => {
- const asterisk = element.querySelector('.adf-asterisk');
+ it('should be able to display label with asterisk', async () => {
+ const formField = await testingUtils.getMatFormField();
+ const formControl = await formField.getControl();
- expect(asterisk).toBeTruthy();
- expect(asterisk?.textContent).toEqual('*');
+ expect(formControl.isRequired).toBeTruthy();
+
+ const inputField = await testingUtils.getByCSS('.adf-input').nativeElement;
+ expect(inputField.hasAttribute('required')).toBeTruthy();
});
});
diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.html b/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.html
index dea0bd26db..7d6517fc9b 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.html
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/dropdown/dropdown-cloud.widget.html
@@ -10,10 +10,8 @@
-
-
- {{ field.name | translate }}
-
+
+ @if ( (field.name || this.field?.required) && !field.leftLabels) { {{ field.name | translate }} }
@@ -30,7 +29,7 @@
{{field.value}}
-
+
{
let formService: FormService;
@@ -47,6 +48,7 @@ describe('DropdownCloudWidgetComponent', () => {
let fixture: ComponentFixture;
let element: HTMLElement;
let loader: HarnessLoader;
+ let testingUtils: UnitTestingUtils;
beforeEach(() => {
TestBed.configureTestingModule({
@@ -60,6 +62,7 @@ describe('DropdownCloudWidgetComponent', () => {
formCloudService = TestBed.inject(FormCloudService);
formUtilsService = TestBed.inject(FormUtilsService);
loader = TestbedHarnessEnvironment.loader(fixture);
+ testingUtils = new UnitTestingUtils(fixture.debugElement, loader);
});
afterEach(() => fixture.destroy());
@@ -330,22 +333,15 @@ describe('DropdownCloudWidgetComponent', () => {
describe('when is required', () => {
beforeEach(() => {
- widget.field = new FormFieldModel(new FormModel({ taskId: '' }), {
+ widget.field = new FormFieldModel(new FormModel({ taskId: '', leftLabels: true }), {
type: FormFieldTypes.DROPDOWN,
required: true
});
});
- it('should be able to display label with asterisk when left-label is present', () => {
- widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id', readOnly: false, leftLabels: true }), {
- id: 'dropdown-id',
- name: 'option list',
- type: FormFieldTypes.DROPDOWN,
- options: filterOptionList
- });
+ it('should be able to display label with asterisk when left-label is present', async () => {
fixture.detectChanges();
-
- const asterisk: HTMLElement = element.querySelector('.adf-asterisk');
+ const asterisk = testingUtils.getByCSS('.adf-asterisk').nativeElement;
expect(asterisk).toBeTruthy();
expect(asterisk.textContent).toEqual('*');
diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/group/group-cloud.widget.html b/lib/process-services-cloud/src/lib/form/components/widgets/group/group-cloud.widget.html
index e4add7ffa5..83b2abe75f 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/group/group-cloud.widget.html
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/group/group-cloud.widget.html
@@ -17,7 +17,7 @@
[validate]="validate"
[roles]="roles"
[searchGroupsControl]="search"
- [required]="isRequired()"
+ [required]="field.required"
(changedGroups)="onChangedGroup($event)"
[preSelectGroups]="preSelectGroup"
(blur)="markAsTouched()"
diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/group/group-cloud.widget.spec.ts b/lib/process-services-cloud/src/lib/form/components/widgets/group/group-cloud.widget.spec.ts
index f680134f08..8f2bef8623 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/group/group-cloud.widget.spec.ts
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/group/group-cloud.widget.spec.ts
@@ -76,13 +76,13 @@ describe('GroupCloudWidgetComponent', () => {
describe('when is required', () => {
beforeEach(() => {
- widget.field = new FormFieldModel(new FormModel({ taskId: '' }), {
+ widget.field = new FormFieldModel(new FormModel({ taskId: '', leftLabels: true }), {
type: FormFieldTypes.GROUP,
required: true
});
});
- it('should be able to display label with asterisk', async () => {
+ it('should be able to display label with asterisk when leftLabel is tru', async () => {
fixture.detectChanges();
await fixture.whenStable();
diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/people/people-cloud.widget.html b/lib/process-services-cloud/src/lib/form/components/widgets/people/people-cloud.widget.html
index 2da7a98b12..399f01aca0 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/people/people-cloud.widget.html
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/people/people-cloud.widget.html
@@ -12,7 +12,7 @@
[readOnly]="field.readOnly"
[validate]="validate"
[searchUserCtrl]="search"
- [required]="isRequired()"
+ [required]="field.required"
(changedUsers)="onChangedUser($event)"
[roles]="roles"
[mode]="mode"
diff --git a/lib/process-services-cloud/src/lib/form/components/widgets/people/people-cloud.widget.spec.ts b/lib/process-services-cloud/src/lib/form/components/widgets/people/people-cloud.widget.spec.ts
index a215dd7288..bf5ba48ba9 100644
--- a/lib/process-services-cloud/src/lib/form/components/widgets/people/people-cloud.widget.spec.ts
+++ b/lib/process-services-cloud/src/lib/form/components/widgets/people/people-cloud.widget.spec.ts
@@ -104,7 +104,7 @@ describe('PeopleCloudWidgetComponent', () => {
describe('when is required', () => {
beforeEach(() => {
- widget.field = new FormFieldModel(new FormModel({ taskId: '' }), {
+ widget.field = new FormFieldModel(new FormModel({ taskId: '', leftLabels: true }), {
type: FormFieldTypes.PEOPLE,
required: true
});
diff --git a/lib/process-services-cloud/src/lib/group/components/group-cloud.component.html b/lib/process-services-cloud/src/lib/group/components/group-cloud.component.html
index eaa7343f58..003a41cd58 100644
--- a/lib/process-services-cloud/src/lib/group/components/group-cloud.component.html
+++ b/lib/process-services-cloud/src/lib/group/components/group-cloud.component.html
@@ -1,16 +1,13 @@