AAE-21392 Fix dropdown form widget style (#9605)

This commit is contained in:
Diogo Bastos
2024-04-24 16:37:10 +01:00
committed by VitoAlbano
parent e8105835a7
commit 28d85ea3b5
2 changed files with 5 additions and 14 deletions

View File

@@ -1,15 +1,10 @@
<div class="adf-dropdown-widget {{field.className}}" <div class="adf-dropdown-widget {{field.className}}"
[class.adf-invalid]="(!field.isValid && isTouched()) || isRestApiFailed" [class.adf-readonly]="field.readOnly" [class.adf-left-label-input-container]="field.leftLabels"> [class.adf-invalid]="(!field.isValid && isTouched()) || isRestApiFailed" [class.adf-readonly]="field.readOnly" [class.adf-left-label-input-container]="field.leftLabels">
<div class="adf-dropdown-widget-top-labels">
<label class="adf-label" [attr.for]="field.id" [class.adf-left-label]="field.leftLabels">{{field.name | translate }}<span class="adf-asterisk"
*ngIf="isRequired()">*</span>
</label>
</div>
<div> <div>
<mat-form-field> <mat-form-field>
<mat-label *ngIf="getDefaultOption(list$ | async) as defaultOption"> <label class="adf-label" [attr.for]="field.id" [class.adf-left-label]="field.leftLabels">{{field.name | translate }}<span class="adf-asterisk"
{{ defaultOption.name }} *ngIf="isRequired()">*</span>
</mat-label> </label>
<mat-select class="adf-select" <mat-select class="adf-select"
[id]="field.id" [id]="field.id"
[(ngModel)]="field.value" [(ngModel)]="field.value"
@@ -22,6 +17,7 @@
(blur)="markAsTouched()" (blur)="markAsTouched()"
matTooltipPosition="above" matTooltipPosition="above"
matTooltipShowDelay="1000" matTooltipShowDelay="1000"
[placeholder]="getDefaultOption(list$ | async)?.name"
[multiple]="field.hasMultipleValues"> [multiple]="field.hasMultipleValues">
<adf-select-filter-input *ngIf="showInputFilter" (change)="filter$.next($event)"></adf-select-filter-input> <adf-select-filter-input *ngIf="showInputFilter" (change)="filter$.next($event)"></adf-select-filter-input>

View File

@@ -36,7 +36,6 @@ import { TaskVariableCloud } from '../../../models/task-variable-cloud.model';
import { HarnessLoader } from '@angular/cdk/testing'; import { HarnessLoader } from '@angular/cdk/testing';
import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed'; import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
import { MatSelectHarness } from '@angular/material/select/testing'; import { MatSelectHarness } from '@angular/material/select/testing';
import { MatFormFieldHarness } from '@angular/material/form-field/testing';
import { MatTooltipHarness } from '@angular/material/tooltip/testing'; import { MatTooltipHarness } from '@angular/material/tooltip/testing';
describe('DropdownCloudWidgetComponent', () => { describe('DropdownCloudWidgetComponent', () => {
@@ -239,12 +238,8 @@ describe('DropdownCloudWidgetComponent', () => {
await dropdown.open(); await dropdown.open();
await dropdown.clickOptions({ selector: '[id="empty"]' }); await dropdown.clickOptions({ selector: '[id="empty"]' });
const formField = await loader.getHarness(MatFormFieldHarness); expect(await dropdown.getValueText()).toEqual('This is a mock none option');
const dropdownLabel = await formField.getLabel();
expect(dropdownLabel).toEqual('This is a mock none option');
expect(widget.fieldValue).toEqual(undefined); expect(widget.fieldValue).toEqual(undefined);
expect(await dropdown.getValueText()).toEqual('');
}); });
}); });