diff --git a/lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.html b/lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.html index cfd18235e0..4f13ee04f2 100644 --- a/lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.html +++ b/lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.html @@ -1,19 +1,24 @@ - - {{ property.label | translate }} - + + {{ property.label | translate }} + @if(checkbox.touched && error){ + + } diff --git a/lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.spec.ts b/lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.spec.ts index f32c31c7d5..4d1e673615 100644 --- a/lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.spec.ts +++ b/lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.spec.ts @@ -27,6 +27,7 @@ import { FormControl, NgModel } from '@angular/forms'; import { MatError } from '@angular/material/form-field'; import { Injector } from '@angular/core'; import { MatCheckbox } from '@angular/material/checkbox'; +import { MatErrorHarness } from '@angular/material/form-field/testing'; describe('CardViewBoolItemComponent', () => { let fixture: ComponentFixture; @@ -236,5 +237,56 @@ describe('CardViewBoolItemComponent', () => { fixture.detectChanges(); expect(testingUtils.getByDirective(MatError).nativeElement.textContent).toBe('Error 1Error 2'); }); + + it('should join multiple errors with br tag in innerHTML', () => { + cardViewPropertyValidator.validated.emit(['Error 1', 'Error 2']); + control.setErrors({ + error1: 'Error 1', + error2: 'Error 2' + }); + control.markAsTouched(); + + fixture.detectChanges(); + expect(testingUtils.getByDirective(MatError).nativeElement.innerHTML).toContain('Error 1Error 2'); + }); + + it('should not contain br tag when there is only one error', () => { + cardViewPropertyValidator.validated.emit(['Single Error']); + control.setErrors({ + error1: 'Single Error' + }); + control.markAsTouched(); + + fixture.detectChanges(); + expect(testingUtils.getByDirective(MatError).nativeElement.innerHTML).not.toContain(''); + expect(testingUtils.getByDirective(MatError).nativeElement.textContent).toBe('Single Error'); + }); + + it('should join three errors with br tags', () => { + cardViewPropertyValidator.validated.emit(['Error A', 'Error B', 'Error C']); + control.setErrors({ + errorA: 'Error A', + errorB: 'Error B', + errorC: 'Error C' + }); + control.markAsTouched(); + + fixture.detectChanges(); + expect(testingUtils.getByDirective(MatError).nativeElement.innerHTML).toContain('Error AError BError C'); + }); + + it('should set empty error string when validated with empty array', () => { + cardViewPropertyValidator.validated.emit([]); + + expect(component.error).toBe(''); + }); + + it('should not display error message when control is touched and has no errors', async () => { + control.markAsTouched(); + + fixture.detectChanges(); + const errors = await loader.getAllHarnesses(MatErrorHarness); + expect(errors.length).toBe(0); + }); }); }); diff --git a/lib/core/src/lib/card-view/public-api.ts b/lib/core/src/lib/card-view/public-api.ts index ca044dbd34..0a98db602e 100644 --- a/lib/core/src/lib/card-view/public-api.ts +++ b/lib/core/src/lib/card-view/public-api.ts @@ -27,7 +27,6 @@ export { SelectFilterInputComponent } from './components/card-view.components'; -export * from './interfaces/card-view.interfaces'; export * from './interfaces/card-view.interfaces'; export * from './validators/card-view.validators'; export * from './models/card-view.models';