inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2026-09-09 18:03:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ACS-5645]code modification

Browse Source
This commit is contained in:
Yasa-Nataliya
2023-09-05 17:52:39 +05:30
committed by Anukriti Singh
parent 3b6236b8a0
commit 5c7d2e5222
7 changed files with 147 additions and 128 deletions
Download Patch File Download Diff File Expand all files Collapse all files
e2e/core/pages/metadata-view.page.ts
+2 -2
View File
@@ -34,7 +34,7 @@ export class MetadataViewPage {
author = $(`[data-automation-id='card-textitem-value-properties.cm:author']`);
titleProperty = $(`span[data-automation-id='card-textitem-value-properties.cm:title'] span`);
editIcon = $(`button[data-automation-id='meta-data-card-toggle-edit']`);
editIconGeneral = $(`button[data-automation-id='meta-data-generalInfo-edit']`);
editIconGeneral = $(`button[data-automation-id='meta-data-general-info-edit']`);
informationButton = $(`button[data-automation-id='meta-data-card-toggle-expand']`);
informationSpan = $(`span[data-automation-id='meta-data-card-toggle-expand-label']`);
informationIcon = $(`span[data-automation-id='meta-data-card-toggle-expand-label'] ~ mat-icon`);
@@ -118,7 +118,7 @@ export class MetadataViewPage {
}
async editIconGeneralClick(): Promise<void> {
await BrowserActions.clickExecuteScript('button[data-automation-id="meta-data-generalInfo-edit"]');
await BrowserActions.click(this.editIconGeneral);
}
async informationButtonIsDisplayed(): Promise<void> {
lib/content-services/src/lib/category/categories-management/categories-management.component.spec.ts
+2 -2
View File
@@ -167,7 +167,7 @@ describe('CategoriesManagementComponent', () => {
component.categoryNameControlVisible = true;
fixture.detectChanges();
});
it('should be hidden initially', () => {
it('should not hide category name control when categoryNameControlVisible is false', () => {
component.categoryNameControlVisible = false;
fixture.detectChanges();
const categoryControl: HTMLDivElement = fixture.debugElement.query(By.css('.adf-category-name-field')).nativeElement;
@@ -250,7 +250,7 @@ describe('CategoriesManagementComponent', () => {
it('should have no required validator set for category control', () => {
expect(component.categoryNameControl.hasValidator(Validators.required)).toBeFalse();
});
it('should display validation error when searching for empty category', fakeAsync(() => {
typeCategory(' ');
lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.html
+16 -16
View File
@@ -21,19 +21,19 @@
(click)="toggleGeneralEdit($event)"
[attr.title]="'CORE.METADATA.ACTIONS.EDIT' | translate"
[attr.aria-label]="'CORE.METADATA.ACCESSIBILITY.EDIT' | translate"
data-automation-id="meta-data-generalInfo-edit"
data-automation-id="meta-data-general-info-edit"
class="adf-edit-icon-buttons">
<mat-icon>mode_edit</mat-icon>
</button>
<div *ngIf="editable"
class="adf-metadata-action-buttons">
<button mat-icon-button
(click)="cancelGeneralInfoChanges($event)"
(click)="cancelEditChanges('generalInfo', $event)"
data-automation-id="reset-metadata">
<mat-icon>clear</mat-icon>
</button>
<button mat-icon-button
(click)="saveGeneralInfoChanges($event)"
(click)="saveEditChanges('generalInfo', $event)"
color="primary"
data-automation-id="save-generalInfo-metadata"
[disabled]="!hasMetadataChanged">
@@ -54,8 +54,8 @@
</mat-expansion-panel>
<ng-container *ngIf="displayTags">
<mat-expansion-panel
(opened)="handleTagPanelOpen()"
(closed)="handleTagPanelClose()"
(opened)="handleTagsPanelState(true)"
(closed)="handleTagsPanelState(false)"
hideToggle
[expanded]="tagsPanelState">
<mat-expansion-panel-header>
@@ -80,12 +80,12 @@
</div>
<div *ngIf="editableTags" class="adf-metadata-action-buttons">
<button mat-icon-button
(click)="CancelTagsChanges($event)"
data-automation-id="reset-metadata">
(click)="cancelEditChanges('tags', $event)"
data-automation-id="reset-tags-metadata">
<mat-icon>clear</mat-icon>
</button>
<button mat-icon-button
(click)="saveTagsChanges($event)"
(click)="saveEditChanges('tags', $event)"
color="primary"
data-automation-id="save-tags-metadata"
[disabled]="!hasMetadataChanged">
@@ -115,8 +115,8 @@
</ng-container>
<ng-container *ngIf="displayCategories">
<mat-expansion-panel
(opened)="handleCategoryPanelOpen()"
(closed)="handleCategoryPanelClose()"
(opened)="handleCategoriesPanelState(true)"
(closed)="handleCategoriesPanelState(false)"
hideToggle
[expanded]="categoriesPanelState">
<mat-expansion-panel-header>
@@ -140,12 +140,12 @@
</div>
<div *ngIf="editableCategories" class="adf-metadata-action-buttons">
<button mat-icon-button
(click)="cancelCategoriesChanges($event)"
(click)="cancelEditChanges('categories', $event)"
data-automation-id="reset-metadata">
<mat-icon>clear</mat-icon>
</button>
<button mat-icon-button
(click)="saveCategoriesChanges($event)"
(click)="saveEditChanges('categories', $event)"
color="primary"
data-automation-id="save-categories-metadata"
[disabled]="!hasMetadataChanged">
@@ -178,8 +178,8 @@
<mat-expansion-panel
[attr.data-automation-id]="'adf-metadata-group-' + group.title"
[expanded]="canExpandTheCard(group) || !displayDefaultProperties && first || group.expanded"
(opened)="group.expanded= true"
(closed)="group.expanded= false"
(opened)="group.expanded = true"
(closed)="group.expanded = false"
hideToggle>
<mat-expansion-panel-header>
<div class="adf-metadata-properties-panel-content">
@@ -200,12 +200,12 @@
</button>
<div class="adf-metadata-action-buttons" *ngIf="group.editable">
<button mat-icon-button
(click)="cancelGroupChanges(group, $event)"
(click)="cancelEditChanges('group', $event, group)"
data-automation-id="reset-metadata">
<mat-icon>clear</mat-icon>
</button>
<button mat-icon-button
(click)="saveGroupChanges(group, $event)"
(click)="saveEditChanges('group', $event, group)"
color="primary"
data-automation-id="save-metadata"
[disabled]="!hasMetadataChanged">
lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.scss
+6 -8
View File
@@ -123,14 +123,12 @@
.acs-details-container {
.mat-tab-body-content {
.adf-content-metadata-card {
.adf-metadata-properties {
.mat-expansion-panel {
width: 755px;
border: 1px solid var(--adf-metadata-property-panel-border-color);
margin: 24px;
border-radius: 12px !important;
}
.adf-metadata-properties {
.mat-expansion-panel {
width: 755px;
border: 1px solid var(--adf-metadata-property-panel-border-color);
margin: 24px;
border-radius: 12px !important;
}
}
}
lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.spec.ts
+67 -44
View File
@@ -76,6 +76,7 @@ describe('ContentMetadataComponent', () => {
const findTagElements = (): DebugElement[] => fixture.debugElement.queryAll(By.css('.adf-metadata-properties .adf-metadata-properties-tag'));
const findCancelButton = (): HTMLButtonElement => fixture.debugElement.query(By.css('[data-automation-id=reset-metadata]')).nativeElement;
const findCancelTagsButton = (): HTMLButtonElement => fixture.debugElement.query(By.css('[data-automation-id=reset-tags-metadata]')).nativeElement;
const clickOnCancel = () => {
findCancelButton().click();
@@ -282,7 +283,7 @@ describe('ContentMetadataComponent', () => {
fixture.detectChanges();
findTagsCreator().tagsChange.emit([tagName1, tagName2]);
const mockEvent = new Event('click');
component.saveTagsChanges(mockEvent);
component.saveChanges(mockEvent);
const tag1 = new TagBody();
tag1.tag = tagName1;
@@ -292,7 +293,7 @@ describe('ContentMetadataComponent', () => {
expect(tagService.assignTagsToNode).toHaveBeenCalledWith(node.id, [tag1, tag2]);
}));
it('should call getTagsByNodeId on TagService on save click', async() => {
it('should call getTagsByNodeId on TagService on save click', () => {
component.editableTags = true;
component.displayTags = true;
const property = { key: 'properties.property-key', value: 'original-value' } as CardViewBaseItemModel;
@@ -310,7 +311,7 @@ describe('ContentMetadataComponent', () => {
findTagsCreator().tagsChange.emit([tagPaging.list.entries[0].entry.tag, 'New tag 3']);
getTagsByNodeIdSpy.calls.reset();
const mockEvent = new Event('click');
component.saveTagsChanges(mockEvent);
component.saveChanges(mockEvent);
expect(tagService.getTagsByNodeId).toHaveBeenCalledWith(node.id);
});
@@ -412,81 +413,106 @@ describe('ContentMetadataComponent', () => {
}));
});
describe('saveChanges', () => {
it('should save general info changes and toggle editable', () => {
describe('saveEditChanges', () => {
it('should save general info changes and toggle editable flag', () => {
const event = new Event('click');
spyOn(component, 'saveChanges');
const buttonType = 'generalInfo';
component.editable = true;
component.saveGeneralInfoChanges(event);
spyOn(component, 'saveChanges');
component.saveEditChanges(buttonType, event);
expect(component.saveChanges).toHaveBeenCalledWith(event);
expect(component.editable).toBe(false);
});
it('should save tags changes and toggle editableTags', () => {
it('should save tags changes and toggle editableTags flag', () => {
const event = new Event('click');
spyOn(component, 'saveChanges');
const buttonType = 'tags';
component.editableTags = true;
component.saveTagsChanges(event);
spyOn(component, 'saveChanges');
component.saveEditChanges(buttonType, event);
expect(component.saveChanges).toHaveBeenCalledWith(event);
expect(component.editableTags).toBe(false);
});
it('should save categories changes and toggle editableCategories', () => {
it('should save categories changes and toggle editableCategories flag', () => {
const event = new Event('click');
spyOn(component, 'saveChanges');
const buttonType = 'categories';
component.editableCategories = true;
component.saveCategoriesChanges(event);
spyOn(component, 'saveChanges');
component.saveEditChanges(buttonType, event);
expect(component.saveChanges).toHaveBeenCalledWith(event);
expect(component.editableTags).toBe(false);
});
it('should save group changes and toggle group.editable', () => {
expect(component.editableCategories).toBe(false);
});
it('should save group changes and toggle editable flag', () => {
const group = { editable: true };
const event = new Event('click');
const buttonType = 'group';
spyOn(component, 'saveChanges');
component.saveGroupChanges(group, event);
component.saveEditChanges(buttonType, event, group);
expect(component.saveChanges).toHaveBeenCalledWith(event);
expect(group.editable).toBe(false);
});
})
});
});
describe('cancelChanges', () => {
it('should cancel group changes and set group editable to false', () => {
const group = { editable: true };
const event = new Event('click');
const buttonType = 'group';
spyOn(component, 'cancelChanges');
component.cancelGroupChanges(group, event);
component.cancelEditChanges(buttonType, event, group);
expect(component.cancelChanges).toHaveBeenCalledWith(event);
expect(group.editable).toBe(false);
});
it('should cancel general info changes and toggle editable', () => {
it('should cancel general info changes and toggle editable flag', () => {
const event = new Event('click');
const buttonType = 'generalInfo';
component.editable = true;
spyOn(component, 'cancelChanges');
component.editable= true;
component.cancelGeneralInfoChanges(event);
component.cancelEditChanges(buttonType, event);
expect(component.cancelChanges).toHaveBeenCalledWith(event);
expect(component.editable).toBe(false);
});
it('should cancel tags changes and toggle editableTags', () => {
it('should cancel tags changes and toggle editableTags flag', () => {
const event = new Event('click');
spyOn(component, 'cancelChanges');
const buttonType = 'tags';
component.editableTags = true;
component.CancelTagsChanges(event);
spyOn(component, 'cancelChanges');
component.cancelEditChanges(buttonType, event);
expect(component.cancelChanges).toHaveBeenCalledWith(event);
expect(component.editableTags).toBe(false);
});
it('should cancel categories changes and toggle editableCategories', () => {
it('should cancel categories changes and toggle editableCategories flag', () => {
const event = new Event('click');
spyOn(component, 'cancelChanges');
const buttonType = 'categories';
component.editableCategories = true;
component.cancelCategoriesChanges(event);
spyOn(component, 'cancelChanges');
component.cancelEditChanges(buttonType, event);
expect(component.cancelChanges).toHaveBeenCalledWith(event);
expect(component.editableCategories).toBe(false);
});
})
});
describe('editing', () => {
it('should toggle categories edit and set categoriesPanelState accordingly', () => {
@@ -709,7 +735,7 @@ describe('ContentMetadataComponent', () => {
it('should display card views group when there is at least one property that is not empty', async () => {
component.expanded = true;
spyOn(contentMetadataService, 'getGroupedProperties');
spyOn(contentMetadataService, 'getGroupedProperties').and.stub();
component.ngOnChanges({ node: new SimpleChange(node, expectedNode, false) });
@@ -1098,7 +1124,6 @@ describe('ContentMetadataComponent', () => {
it('should render tags after loading tags in ngOnInit', () => {
spyOn(tagService, 'getTagsByNodeId').and.returnValue(of(tagPaging));
component.ngOnInit();
fixture.whenStable();
fixture.detectChanges();
const tagElements = findTagElements();
expect(tagElements).toHaveSize(2);
@@ -1175,9 +1200,7 @@ describe('ContentMetadataComponent', () => {
tick(500);
fixture.detectChanges();
spyOn(tagService, 'getTagsByNodeId').and.returnValue(of(tagPaging));
const mockEvent = new Event('click');
component.CancelTagsChanges(mockEvent);
findCancelTagsButton().click();
component.editableTags = false;
fixture.detectChanges();
const tagElements = findTagElements();
@@ -1229,7 +1252,7 @@ describe('ContentMetadataComponent', () => {
it('should enable cancel button after emitting tagsChange event', () => {
tagsCreator.tagsChange.emit(['New tag 1', 'New tag 2', 'New tag 3']);
fixture.detectChanges();
expect(findCancelButton().disabled).toBeFalse();
expect(findCancelTagsButton().disabled).toBeFalse();
});
it('should enable save button after emitting tagsChange event', () => {
@@ -1250,7 +1273,7 @@ describe('ContentMetadataComponent', () => {
expect(tagsCreator.disabledTagsRemoving).toBeTrue();
});
it('should have assigned false to disabledTagsRemoving if forkJoin fails', fakeAsync(() => {
it('should have assigned false to disabledTagsRemoving if forkJoin fails', () => {
const property = { key: 'properties.property-key', value: 'original-value' } as CardViewBaseItemModel;
const expectedNode = { ...node, name: 'some-modified-value' };
spyOn(nodesApiService, 'updateNode').and.returnValue(of(expectedNode));
@@ -1269,7 +1292,7 @@ describe('ContentMetadataComponent', () => {
clickOnTagsSave();
expect(tagsCreator.disabledTagsRemoving).toBeFalse();
}));
});
it('should have assigned false to tagNameControlVisible after clicking on update button', () => {
tagsCreator.tagNameControlVisibleChange.emit(true);
lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts
+47 -49
View File
@@ -268,24 +268,28 @@ export class ContentMetadataComponent implements OnChanges, OnInit, OnDestroy {
}
}
saveGeneralInfoChanges(event:Event) {
saveEditChanges(buttonType: string, event: Event, group?: any) {
this.saveChanges(event);
this.editable = !this.editable;
}
saveTagsChanges(event: Event) {
this.saveChanges(event);
this.editableTags = !this.editableTags;
}
saveCategoriesChanges(event: Event) {
this.saveChanges(event);
this.editableCategories = !this.editableCategories;
}
saveGroupChanges(group: any, event:Event) {
this.saveChanges(event);
group.editable = !group.editable;
switch (buttonType) {
case 'generalInfo':
this.editable = !this.editable;
break;
case 'tags':
this.editableTags = !this.editableTags;
break;
case 'categories':
this.editableCategories = !this.editableCategories;
break;
case 'group':
if (group) {
group.editable = !group.editable;
}
break;
default:
break;
}
}
/**
@@ -323,24 +327,28 @@ export class ContentMetadataComponent implements OnChanges, OnInit, OnDestroy {
this.loadProperties(this.node);
}
cancelGroupChanges(group: any, event: Event) {
cancelEditChanges(buttonType: string, event: Event, group?: any) {
this.cancelChanges(event);
group.editable = !group.editable;
}
CancelTagsChanges(event: Event) {
this.cancelChanges(event);
this.editableTags = !this.editableTags;
}
cancelCategoriesChanges(event: Event) {
this.cancelChanges(event);
this.editableCategories = !this.editableCategories;
}
cancelGeneralInfoChanges(event: Event) {
this.cancelChanges(event);
this.editable = !this.editable;
switch (buttonType) {
case 'generalInfo':
this.editable = !this.editable;
break;
case 'tags':
this.editableTags = !this.editableTags;
break;
case 'categories':
this.editableCategories = !this.editableCategories;
break;
case 'group':
if (group) {
group.editable = !group.editable;
}
break;
default:
break;
}
}
toggleGeneralEdit(event: Event): void {
@@ -381,28 +389,18 @@ export class ContentMetadataComponent implements OnChanges, OnInit, OnDestroy {
}
}
handleTagPanelOpen() {
this.tagsPanelState = true;
this.cdr.detectChanges();
}
handleTagPanelClose() {
this.tagsPanelState = false;
this.cdr.detectChanges();
}
generalTogglePanelState() {
this.generalInfoPanelState = !this.generalInfoPanelState;
this.cdr.detectChanges();
}
handleCategoryPanelOpen() {
this.categoriesPanelState = true;
handleTagsPanelState(tagPanelState: boolean) {
this.tagsPanelState = tagPanelState;
this.cdr.detectChanges();
}
handleCategoryPanelClose() {
this.categoriesPanelState = false;
handleCategoriesPanelState(categoriesPanelState: boolean) {
this.categoriesPanelState= categoriesPanelState;
this.cdr.detectChanges();
}
lib/content-services/src/lib/tag/tags-creator/tags-creator.component.spec.ts
+7 -7
View File
@@ -304,6 +304,13 @@ describe('TagsCreatorComponent', () => {
expect(error).toBe('TAG.TAGS_CREATOR.ERRORS.REQUIRED');
}));
it('should not show error for required if tags are changed', fakeAsync(() => {
typeTag('');
component.tags = ['new tag 1', 'new tag 2'];
fixture.detectChanges();
expect(getFirstError()).toBeUndefined();
}));
it('should show error when duplicated already added tag', fakeAsync(() => {
const tag = 'Some tag';
@@ -325,13 +332,6 @@ describe('TagsCreatorComponent', () => {
expect(getFirstError()).toBe('TAG.TAGS_CREATOR.ERRORS.ALREADY_ADDED_TAG');
}));
it('should not show error for required if tags are changed', fakeAsync(() => {
typeTag('');
component.tags = ['new tag 1', 'new tag 2'];
fixture.detectChanges();
expect(getFirstError()).toBeUndefined();
}));
it('should show error when duplicated already existing tag', fakeAsync(() => {
const tag = 'Some tag';