fix readonly attach file scenarios (#5365)

This commit is contained in:
Eugenio Romano
2020-01-14 00:14:11 +01:00
committed by GitHub
parent fd53531be7
commit 3cf12fca49
4 changed files with 76 additions and 15 deletions

View File

@@ -26,6 +26,7 @@
"REMOVE_FILE": "Remove",
"UPLOAD": "UPLOAD",
"REQUIRED": "*Required",
"NO_FILE_ATTACHED" : "No file attached",
"VALIDATOR": {
"INVALID_NUMBER": "Use a different number format",
"INVALID_DATE": "Use a different date format",

View File

@@ -1,6 +1,6 @@
<div class="adf-attach-widget {{field.className}}"
[class.adf-invalid]="!field.isValid"
[class.adf-readonly]="field.readOnly">
[class.adf-invalid]="!field.isValid"
[class.adf-readonly]="field.readOnly">
<label class="adf-label" [attr.for]="field.id">{{field.name}}
<span *ngIf="isRequired()">*</span>
</label>
@@ -10,26 +10,27 @@
{{ 'FORM.FIELD.UPLOAD' | translate }}
<mat-icon>file_upload</mat-icon>
<input #uploadFiles
[multiple]="multipleOption"
type="file"
[id]="field.id"
(change)="onAttachFileChanged($event)"/>
[multiple]="multipleOption"
type="file"
[id]="field.id"
(change)="onAttachFileChanged($event)"/>
</a>
</div>
<div class="adf-attach-widget__menu-upload" *ngIf="isUploadButtonVisible() && isMultipleSourceUpload()">
<button mat-raised-button color="primary" [matMenuTriggerFor]="menu" [id]="field.id">
{{ 'FORM.FIELD.UPLOAD' | translate }}
<mat-icon>attach_file</mat-icon>
{{ 'FORM.FIELD.UPLOAD' | translate }}
<mat-icon>attach_file</mat-icon>
</button>
<mat-menu #menu="matMenu" class="adf-attach-widget__menu-content">
<div *ngIf="isContentSourceSelected()">
<button mat-menu-item
id="attach-{{field.params?.fileSource?.name}}"
(click)="uploadFileFromCS()">
{{field.params?.fileSource?.name}}
<mat-icon>
<img alt="alfresco" class="adf-attach-widget__image-logo" src="../assets/images/alfresco-flower.svg">
</mat-icon>
(click)="uploadFileFromCS()">
{{field.params?.fileSource?.name}}
<mat-icon>
<img alt="alfresco" class="adf-attach-widget__image-logo"
src="../assets/images/alfresco-flower.svg">
</mat-icon>
</button>
</div>
</mat-menu>
@@ -53,12 +54,12 @@
</button>
<mat-menu #fileActionMenu="matMenu" xPosition="before">
<button id="{{'file-'+file?.id+'-show-file'}}"
mat-menu-item (click)="onAttachFileClicked(file)">
mat-menu-item (click)="onAttachFileClicked(file)">
<mat-icon>image</mat-icon>
<span>{{ 'FORM.FIELD.SHOW_FILE' | translate }}</span>
</button>
<button id="{{'file-'+file?.id+'-download-file'}}"
mat-menu-item (click)="downloadContent(file)">
mat-menu-item (click)="downloadContent(file)">
<mat-icon>file_download</mat-icon>
<span>{{ 'FORM.FIELD.DOWNLOAD_FILE' | translate }}</span>
</button>
@@ -71,6 +72,10 @@
</mat-menu>
</mat-list-item>
</mat-list>
<div *ngIf="!hasFile && field.readOnly" id="{{'adf-attach-empty-list-'+field.id}}">
{{ 'FORM.FIELD.NO_FILE_ATTACHED' | translate }}
</div>
</div>
<error-widget [error]="field.validationSummary"></error-widget>

View File

@@ -234,6 +234,56 @@ describe('AttachFileCloudWidgetComponent', () => {
});
}));
describe('when is readonly', () => {
it('should show empty list message when there are no file', async(() => {
widget.field = new FormFieldModel(new FormModel(), {
type: FormFieldTypes.UPLOAD,
readOnly: true,
value: []
});
widget.field.id = 'empty-test';
widget.field.params = <FormFieldMetadata> onlyLocalParams;
fixture.detectChanges();
fixture.whenStable().then(() => {
expect(element.querySelector('#adf-attach-empty-list-empty-test')).not.toBeNull();
});
}));
it('should not show empty list message when there are files', async(() => {
widget.field = new FormFieldModel(new FormModel(), {
type: FormFieldTypes.UPLOAD,
readOnly: true,
value: [fakePngAnswer]
});
widget.field.id = 'fill-test';
widget.field.params = <FormFieldMetadata> onlyLocalParams;
fixture.detectChanges();
fixture.whenStable().then(() => {
expect(element.querySelector('#adf-attach-empty-list-fill-test')).toBeNull();
});
}));
it('should not show remove button when there are files attached', async(() => {
widget.field = new FormFieldModel(new FormModel(), {
type: FormFieldTypes.UPLOAD,
readOnly: true,
value: [fakePngAnswer]
});
widget.field.id = 'fill-test';
widget.field.params = <FormFieldMetadata> onlyLocalParams;
fixture.detectChanges();
const menuButton: HTMLButtonElement = <HTMLButtonElement> (
fixture.debugElement.query(By.css('#file-1155-option-menu'))
.nativeElement
);
menuButton.click();
fixture.detectChanges();
expect(fixture.debugElement.query(By.css('#file-1155-remove'))).toBeNull();
}));
});
describe('when a file is uploaded', () => {
beforeEach(async(() => {
widget.field = new FormFieldModel(new FormModel(), {

View File

@@ -34,6 +34,11 @@
(change)="onFileChanged($event)"/>
</button>
</div>
<div *ngIf="!hasFile && field.readOnly">
{{ 'FORM.FIELD.NO_FILE_ATTACHED' | translate }}
</div>
</div>
<error-widget [error]="field.validationSummary"></error-widget>
<error-widget *ngIf="isInvalidFieldRequired()" required="{{ 'FORM.FIELD.REQUIRED' | translate }}"></error-widget>