[MIGRATION] - storybook chips related e2e fails fix, unit alignments

This commit is contained in:
Wojciech Duda 2024-08-12 17:24:22 +02:00 committed by VitoAlbano
parent 8344c98741
commit 88949621fb
6 changed files with 15 additions and 42 deletions

View File

@ -23,7 +23,6 @@ import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { HarnessLoader } from '@angular/cdk/testing';
import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
import { MatChipHarness } from '@angular/material/chips/testing';
import { MatFormFieldHarness } from '@angular/material/form-field/testing';
describe('GroupCloudWidgetComponent', () => {
let fixture: ComponentFixture<GroupCloudWidgetComponent>;
@ -145,12 +144,6 @@ describe('GroupCloudWidgetComponent', () => {
value: mockSpaghetti
});
fixture.detectChanges();
await fixture.whenStable();
const formField = await loader.getHarness(MatFormFieldHarness);
expect(await formField.isDisabled()).toBeTrue();
const groupChip = await loader.getHarness(MatChipHarness);
expect(await groupChip.isDisabled()).toBeTrue();
});
@ -166,12 +159,6 @@ describe('GroupCloudWidgetComponent', () => {
value: mockSpaghetti
});
fixture.detectChanges();
await fixture.whenStable();
const formField = await loader.getHarness(MatFormFieldHarness);
expect(await formField.isDisabled()).toBeTrue();
const groupChips = await loader.getAllHarnesses(MatChipHarness);
expect(await groupChips[0].isDisabled()).toBeTrue();
expect(await groupChips[1].isDisabled()).toBeTrue();

View File

@ -24,8 +24,7 @@ import { IdentityUserService } from '../../../../people/services/identity-user.s
import { mockShepherdsPie, mockYorkshirePudding } from '../../../../people/mock/people-cloud.mock';
import { HarnessLoader } from '@angular/cdk/testing';
import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
import { MatFormFieldHarness } from '@angular/material/form-field/testing';
import { MatChipHarness } from '@angular/material/chips/testing';
import { MatChipRowHarness } from '@angular/material/chips/testing';
describe('PeopleCloudWidgetComponent', () => {
let fixture: ComponentFixture<PeopleCloudWidgetComponent>;
@ -174,12 +173,8 @@ describe('PeopleCloudWidgetComponent', () => {
value: mockSpaghetti
});
fixture.detectChanges();
const peopleChip = await loader.getHarness(MatChipRowHarness);
const formField = await loader.getHarness(MatFormFieldHarness);
expect(await formField.isDisabled()).toBeTrue();
const peopleChip = await loader.getHarness(MatChipHarness);
expect(await peopleChip.isDisabled()).toBeTrue();
});
@ -194,11 +189,7 @@ describe('PeopleCloudWidgetComponent', () => {
value: mockSpaghetti
});
fixture.detectChanges();
const formField = await loader.getHarness(MatFormFieldHarness);
expect(await formField.isDisabled()).toBeTrue();
const peopleChip = await loader.getAllHarnesses(MatChipHarness);
const peopleChip = await loader.getAllHarnesses(MatChipRowHarness);
expect(await peopleChip[0].isDisabled()).toBeTrue();
expect(await peopleChip[1].isDisabled()).toBeTrue();
});

View File

@ -1,12 +1,13 @@
<form>
<mat-form-field class="adf-cloud-group" [class.adf-invalid]="hasError() && isDirty()">
<ng-content select="[label]"></ng-content>
<mat-chip-grid #groupChipList [disabled]="isReadonly() || isValidationLoading()" data-automation-id="adf-cloud-group-chip-list">
<mat-chip-grid #groupChipList data-automation-id="adf-cloud-group-chip-list">
<mat-chip-row
*ngFor="let group of selectedGroups"
[removable]="!(group.readonly)"
[attr.data-automation-id]="'adf-cloud-group-chip-' + group.name"
(removed)="onRemove(group)"
[disabled]="isReadonly() || isValidationLoading()"
title="{{ (group.readonly ? 'ADF_CLOUD_GROUPS.MANDATORY' : '') | translate }}">
{{group.name}}
<mat-icon

View File

@ -26,7 +26,7 @@ import { IdentityGroupService } from '../services/identity-group.service';
import { mockFoodGroups, mockMeatChicken, mockVegetableAubergine } from '../mock/group-cloud.mock';
import { HarnessLoader } from '@angular/cdk/testing';
import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
import { MatChipGridHarness, MatChipHarness } from '@angular/material/chips/testing';
import { MatChipHarness } from '@angular/material/chips/testing';
import { MatIconHarness } from '@angular/material/icon/testing';
import { MatInputHarness } from '@angular/material/input/testing';
@ -357,9 +357,7 @@ describe('GroupCloudComponent', () => {
const chips = await loader.getAllHarnesses(MatChipHarness);
expect(chips.length).toBe(1);
const chipList = await loader.getHarness(MatChipGridHarness);
expect(await chipList.isDisabled()).toBe(true);
expect(await chips[0].isDisabled()).toBe(true);
});
it('should chip list be disabled and show all the chips - multiple mode', async () => {
@ -372,9 +370,8 @@ describe('GroupCloudComponent', () => {
const chips = await loader.getAllHarnesses(MatChipHarness);
expect(chips.length).toBe(2);
const chipList = await loader.getHarness(MatChipGridHarness);
expect(await chipList.isDisabled()).toBe(true);
expect(await chips[0].isDisabled()).toBe(true);
expect(await chips[1].isDisabled()).toBe(true);
});
});
});

View File

@ -8,12 +8,13 @@
>
<ng-content *ngIf="!title" select="[label]"></ng-content>
<mat-label *ngIf="title">{{ title | translate }}</mat-label>
<mat-chip-grid #userMultipleChipList [disabled]="isReadonly() || isValidationLoading()" data-automation-id="adf-cloud-people-chip-list">
<mat-chip-grid #userMultipleChipList data-automation-id="adf-cloud-people-chip-list">
<mat-chip-row
*ngFor="let user of selectedUsers"
[removable]="!(user.readonly)"
[attr.data-automation-id]="'adf-people-cloud-chip-' + user.username"
(removed)="onRemove(user)"
[disabled]="isReadonly() || isValidationLoading()"
title="{{ (user.readonly ? 'ADF_CLOUD_GROUPS.MANDATORY' : '') | translate }}">
{{user | fullName}}
<mat-icon
@ -35,7 +36,6 @@
data-automation-id="adf-people-cloud-search-input" #userInput>
</mat-chip-grid>
<mat-autocomplete autoActiveFirstOption class="adf-people-cloud-list"
#auto="matAutocomplete"
(optionSelected)="onSelect($event.option.value)"

View File

@ -28,7 +28,7 @@ import { IDENTITY_USER_SERVICE_TOKEN } from '../services/identity-user-service.t
import { mockFoodUsers, mockKielbasaSausage, mockShepherdsPie, mockYorkshirePudding, mockPreselectedFoodUsers } from '../mock/people-cloud.mock';
import { HarnessLoader } from '@angular/cdk/testing';
import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
import { MatChipGridHarness, MatChipHarness } from '@angular/material/chips/testing';
import { MatChipHarness } from '@angular/material/chips/testing';
import { MatInputHarness } from '@angular/material/input/testing';
import { MatFormFieldHarness } from '@angular/material/form-field/testing';
@ -406,9 +406,7 @@ describe('PeopleCloudComponent', () => {
const chips = await loader.getAllHarnesses(MatChipHarness);
expect(chips.length).toBe(1);
const chipList = await loader.getHarness(MatChipGridHarness);
expect(await chipList.isDisabled()).toBe(true);
expect(await chips[0].isDisabled()).toBe(true);
});
it('should chip list be disabled and show mat chips for all the preselected users - multiple mode', async () => {
@ -421,9 +419,8 @@ describe('PeopleCloudComponent', () => {
const chips = await loader.getAllHarnesses(MatChipHarness);
expect(chips.length).toBe(2);
const chipList = await loader.getHarness(MatChipGridHarness);
expect(await chipList.isDisabled()).toBe(true);
expect(await chips[0].isDisabled()).toBe(true);
expect(await chips[1].isDisabled()).toBe(true);
});
});
});