[ADF-3190] Fix rerendering issue with content-meta-data (#3494)

* Fix rerendering issue with content-meta-data

* Fix indentation
This commit is contained in:
Popovics András
2018-06-18 11:54:19 +01:00
committed by Eugenio Romano
parent ae73839e56
commit 737becd51f
2 changed files with 25 additions and 58 deletions

View File

@@ -23,20 +23,12 @@ import { By } from '@angular/platform-browser';
import { MinimalNodeEntryEntity } from 'alfresco-js-api'; import { MinimalNodeEntryEntity } from 'alfresco-js-api';
import { ContentMetadataComponent } from './content-metadata.component'; import { ContentMetadataComponent } from './content-metadata.component';
import { ContentMetadataService } from '../../services/content-metadata.service'; import { ContentMetadataService } from '../../services/content-metadata.service';
import { import { CardViewBaseItemModel, CardViewComponent, CardViewUpdateService, NodesApiService, LogService, setupTestBed } from '@alfresco/adf-core';
CardViewBaseItemModel,
CardViewComponent,
CardViewUpdateService,
NodesApiService,
LogService,
setupTestBed
} from '@alfresco/adf-core';
import { ErrorObservable } from 'rxjs/observable/ErrorObservable'; import { ErrorObservable } from 'rxjs/observable/ErrorObservable';
import { Observable } from 'rxjs/Observable'; import { Observable } from 'rxjs/Observable';
import { ContentTestingModule } from '../../../testing/content.testing.module'; import { ContentTestingModule } from '../../../testing/content.testing.module';
describe('ContentMetadataComponent', () => { describe('ContentMetadataComponent', () => {
let component: ContentMetadataComponent; let component: ContentMetadataComponent;
let fixture: ComponentFixture<ContentMetadataComponent>; let fixture: ComponentFixture<ContentMetadataComponent>;
let node: MinimalNodeEntryEntity; let node: MinimalNodeEntryEntity;
@@ -45,9 +37,7 @@ describe('ContentMetadataComponent', () => {
setupTestBed({ setupTestBed({
imports: [ContentTestingModule], imports: [ContentTestingModule],
providers: [ providers: [{ provide: LogService, useValue: { error: jasmine.createSpy('error') } }]
{ provide: LogService, useValue: { error: jasmine.createSpy('error') } }
]
}); });
beforeEach(() => { beforeEach(() => {
@@ -81,7 +71,6 @@ describe('ContentMetadataComponent', () => {
}); });
describe('Default input param values', () => { describe('Default input param values', () => {
it('should have editable input param as false by default', () => { it('should have editable input param as false by default', () => {
expect(component.editable).toBe(false); expect(component.editable).toBe(false);
}); });
@@ -96,7 +85,6 @@ describe('ContentMetadataComponent', () => {
}); });
describe('Folder', () => { describe('Folder', () => {
it('should show the folder node', () => { it('should show the folder node', () => {
component.expanded = false; component.expanded = false;
fixture.detectChanges(); fixture.detectChanges();
@@ -112,7 +100,6 @@ describe('ContentMetadataComponent', () => {
}); });
describe('Saving', () => { describe('Saving', () => {
it('should save the node on itemUpdate', () => { it('should save the node on itemUpdate', () => {
const property = <CardViewBaseItemModel> { key: 'property-key', value: 'original-value' }, const property = <CardViewBaseItemModel> { key: 'property-key', value: 'original-value' },
updateService: CardViewUpdateService = fixture.debugElement.injector.get(CardViewUpdateService), updateService: CardViewUpdateService = fixture.debugElement.injector.get(CardViewUpdateService),
@@ -139,7 +126,7 @@ describe('ContentMetadataComponent', () => {
updateService.update(property, 'updated-value'); updateService.update(property, 'updated-value');
fixture.whenStable().then(() => { fixture.whenStable().then(() => {
expect(component.node).toBe(expectedNode); expect(component.node).toEqual(expectedNode);
}); });
})); }));
@@ -160,9 +147,7 @@ describe('ContentMetadataComponent', () => {
}); });
describe('Properties loading', () => { describe('Properties loading', () => {
let expectedNode, contentMetadataService: ContentMetadataService;
let expectedNode,
contentMetadataService: ContentMetadataService;
beforeEach(() => { beforeEach(() => {
expectedNode = Object.assign({}, node, { name: 'some-modified-value' }); expectedNode = Object.assign({}, node, { name: 'some-modified-value' });
@@ -248,22 +233,5 @@ describe('ContentMetadataComponent', () => {
expect(basicPropertiesComponent.displayEmpty).toBe(false); expect(basicPropertiesComponent.displayEmpty).toBe(false);
}); });
})); }));
it('should be performed again if property updating occured, since the originally passed node has changed, so the previously calculated properties', () => {
const property = <CardViewBaseItemModel> { key: 'property-key', value: 'original-value' },
updateService = fixture.debugElement.injector.get(CardViewUpdateService),
nodesApiService = TestBed.get(NodesApiService);
spyOn(nodesApiService, 'updateNode').and.callFake(() => Observable.of(node));
spyOn(contentMetadataService, 'getBasicProperties');
component.ngOnChanges({ node: new SimpleChange(null, node, true) });
updateService.update(property, 'updated-value');
component.ngOnChanges({ expanded: new SimpleChange(false, true, false) });
component.ngOnChanges({ expanded: new SimpleChange(true, false, false) });
component.ngOnChanges({ expanded: new SimpleChange(false, true, false) });
expect(contentMetadataService.getBasicProperties).toHaveBeenCalledTimes(2);
});
}); });
}); });

View File

@@ -15,7 +15,7 @@
* limitations under the License. * limitations under the License.
*/ */
import { Component, Input, OnChanges, OnInit, SimpleChanges, SimpleChange, ViewEncapsulation } from '@angular/core'; import { Component, Input, OnChanges, OnInit, SimpleChanges, ViewEncapsulation } from '@angular/core';
import { MinimalNodeEntryEntity } from 'alfresco-js-api'; import { MinimalNodeEntryEntity } from 'alfresco-js-api';
import { Observable } from 'rxjs/Observable'; import { Observable } from 'rxjs/Observable';
import { CardViewItem, NodesApiService, LogService, CardViewUpdateService, AlfrescoApiService } from '@alfresco/adf-core'; import { CardViewItem, NodesApiService, LogService, CardViewUpdateService, AlfrescoApiService } from '@alfresco/adf-core';
@@ -30,7 +30,6 @@ import { CardViewGroup } from '../../interfaces/content-metadata.interfaces';
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None
}) })
export class ContentMetadataComponent implements OnChanges, OnInit { export class ContentMetadataComponent implements OnChanges, OnInit {
/** (required) The node entity to fetch metadata about */ /** (required) The node entity to fetch metadata about */
@Input() @Input()
node: MinimalNodeEntryEntity; node: MinimalNodeEntryEntity;
@@ -57,35 +56,35 @@ export class ContentMetadataComponent implements OnChanges, OnInit {
@Input() @Input()
preset: string; preset: string;
nodeHasBeenUpdated: boolean = false; componentInited: boolean = false;
basicProperties$: Observable<CardViewItem[]>; basicProperties$: Observable<CardViewItem[]>;
groupedProperties$: Observable<CardViewGroup[]>; groupedProperties$: Observable<CardViewGroup[]>;
constructor(private contentMetadataService: ContentMetadataService, constructor(
private cardViewUpdateService: CardViewUpdateService, private contentMetadataService: ContentMetadataService,
private nodesApiService: NodesApiService, private cardViewUpdateService: CardViewUpdateService,
private logService: LogService, private nodesApiService: NodesApiService,
private alfrescoApiService: AlfrescoApiService) {} private logService: LogService,
private alfrescoApiService: AlfrescoApiService
) {}
ngOnInit() { ngOnInit() {
this.cardViewUpdateService.itemUpdated$ this.cardViewUpdateService.itemUpdated$.switchMap(this.saveNode.bind(this)).subscribe(
.switchMap(this.saveNode.bind(this)) updatedNode => {
.subscribe( Object.assign(this.node, updatedNode);
(node) => { this.alfrescoApiService.nodeUpdated.next(this.node);
this.nodeHasBeenUpdated = true; },
this.node = node; error => this.logService.error(error)
this.alfrescoApiService.nodeUpdated.next(node); );
},
error => this.logService.error(error) this.componentInited = true;
);
} }
ngOnChanges(changes: SimpleChanges) { ngOnChanges(changes: SimpleChanges) {
const nodeChange: SimpleChange = changes['node']; const changedNode: MinimalNodeEntryEntity = changes['node'] && changes['node'].currentValue;
if (nodeChange || this.nodeHasBeenUpdated) {
const node = nodeChange && nodeChange.currentValue || this.node;
this.nodeHasBeenUpdated = false;
if (!this.componentInited || (changedNode && changedNode !== this.node)) {
const node = changedNode || this.node;
this.basicProperties$ = this.contentMetadataService.getBasicProperties(node); this.basicProperties$ = this.contentMetadataService.getBasicProperties(node);
this.groupedProperties$ = this.contentMetadataService.getGroupedProperties(node, this.preset); this.groupedProperties$ = this.contentMetadataService.getGroupedProperties(node, this.preset);
} }