Merge pull request #1319 from 4Science/DSC-192

edit item metadata fix

src/app/item-page/edit-item-page/item-metadata/edit-in-place-field/edit-in-place-field.component.html

@@ -1,10 +1,10 @@
 <td>
     <div class="metadata-field">
         <div *ngIf="!(editable | async)">
-            <span>{{metadata?.key?.split('.').join('.&#8203;')}}</span>
+            <span >{{metadata?.key?.split('.').join('.&#8203;')}}</span>
         </div>
         <div *ngIf="(editable | async)" class="field-container">
-            <ds-validation-suggestions [suggestions]="(metadataFieldSuggestions | async)"
+            <ds-validation-suggestions [disable]="fieldUpdate.changeType != 1" [suggestions]="(metadataFieldSuggestions | async)"
                                          [(ngModel)]="metadata.key"
                                          [url]="this.url"
                                          [metadata]="this.metadata"

src/app/item-page/edit-item-page/item-metadata/edit-in-place-field/edit-in-place-field.component.spec.ts

@@ -463,4 +463,43 @@ describe('EditInPlaceFieldComponent', () => {
     });
 
   });
+
+  describe('canEditMetadataField', () => {
+    describe('when the fieldUpdate\'s changeType is currently ADD', () => {
+      beforeEach(() => {
+        objectUpdatesService.isEditable.and.returnValue(observableOf(true));
+        comp.fieldUpdate.changeType = FieldChangeType.ADD;
+        fixture.detectChanges();
+      });
+      it('can edit metadata field', () => {
+        const disabledMetadataField = fixture.debugElement.query(By.css('ds-validation-suggestions'))
+          .componentInstance.disable;
+       expect(disabledMetadataField).toBe(false);
+      });
+    });
+    describe('when the fieldUpdate\'s changeType is currently REMOVE', () => {
+      beforeEach(() => {
+        objectUpdatesService.isEditable.and.returnValue(observableOf(true));
+        comp.fieldUpdate.changeType = FieldChangeType.REMOVE;
+        fixture.detectChanges();
+      });
+      it('can edit metadata field', () => {
+        const disabledMetadataField = fixture.debugElement.query(By.css('ds-validation-suggestions'))
+          .componentInstance.disable;
+        expect(disabledMetadataField).toBe(true);
+      });
+    });
+    describe('when the fieldUpdate\'s changeType is currently UPDATE', () => {
+      beforeEach(() => {
+        objectUpdatesService.isEditable.and.returnValue(observableOf(true));
+        comp.fieldUpdate.changeType = FieldChangeType.UPDATE;
+        fixture.detectChanges();
+      });
+      it('can edit metadata field', () => {
+        const disabledMetadataField = fixture.debugElement.query(By.css('ds-validation-suggestions'))
+          .componentInstance.disable;
+        expect(disabledMetadataField).toBe(true);
+      });
+    });
+  });
 });

src/app/shared/input-suggestions/validation-suggestions/validation-suggestions.component.html

@@ -3,7 +3,7 @@
       (keydown.arrowdown)="shiftFocusDown($event)"
       (keydown.arrowup)="shiftFocusUp($event)" (keydown.esc)="close()"
       (dsClickOutside)="checkIfValidInput(form);close();">
-  <input #inputField type="text" formControlName="metadataNameField" attr.aria-labelledby="fieldName" [(ngModel)]="value" id="name" [name]="name"
+  <input [readonly]="disable" #inputField type="text" formControlName="metadataNameField" attr.aria-labelledby="fieldName" [(ngModel)]="value" id="name" [name]="name"
          class="form-control suggestion_input"
          [ngClass]="{'is-invalid': !valid}"
          [dsDebounce]="debounceTime" (onDebounce)="find($event)"

src/app/shared/input-suggestions/validation-suggestions/validation-suggestions.component.spec.ts

@@ -60,4 +60,30 @@ describe('ValidationSuggestionsComponent', () => {
       expect(comp.onClickSuggestion).toHaveBeenCalledWith(suggestions[clickedIndex].value);
     });
   });
+  describe('can edit input', () => {
+    describe('test input field readonly property when input disable is true', () => {
+      beforeEach(() => {
+        comp.disable = true;
+        fixture.detectChanges();
+      });
+      it('it should be true', () => {
+        fixture.detectChanges();
+        const input = fixture.debugElement.query(By.css('input'));
+        const element = input.nativeElement;
+        expect(element.readOnly).toBe(true);
+      });
+    });
+    describe('test input field readonly property when input disable is false', () => {
+      beforeEach(() => {
+        comp.disable = false;
+        fixture.detectChanges();
+      });
+      it('it should be true', () => {
+        fixture.detectChanges();
+        const input = fixture.debugElement.query(By.css('input'));
+        const element = input.nativeElement;
+        expect(element.readOnly).toBe(false);
+      });
+    });
+  });
 });

src/app/shared/input-suggestions/validation-suggestions/validation-suggestions.component.ts

@@ -42,7 +42,10 @@ export class ValidationSuggestionsComponent extends InputSuggestionsComponent im
    * The suggestions that should be shown
    */
   @Input() suggestions: InputSuggestion[] = [];
-
+  /**
+   * The possibility to edit metadata
+   */
+  @Input() disable;
   constructor(private metadataFieldValidator: MetadataFieldValidator,
               private objectUpdatesService: ObjectUpdatesService) {
     super();