From 115deff377b4e8d10bf51ca0fd22964d10d02fd3 Mon Sep 17 00:00:00 2001 From: cipchk Date: Wed, 4 Jul 2018 20:15:04 +0800 Subject: [PATCH] fix(abc:page-header): fix must refresh when i18n changed, close #545 --- .../abc/page-header/page-header.component.ts | 11 ++- packages/abc/page-header/page-header.spec.ts | 76 +++++++++++-------- 2 files changed, 56 insertions(+), 31 deletions(-) diff --git a/packages/abc/page-header/page-header.component.ts b/packages/abc/page-header/page-header.component.ts index 026ca3587..c72d35967 100644 --- a/packages/abc/page-header/page-header.component.ts +++ b/packages/abc/page-header/page-header.component.ts @@ -11,6 +11,7 @@ import { ElementRef, AfterViewInit, Renderer2, + OnDestroy, } from '@angular/core'; import { Router } from '@angular/router'; import { toBoolean, isEmpty } from '@delon/util'; @@ -24,6 +25,7 @@ import { import { ReuseTabService } from '../reuse-tab/reuse-tab.service'; import { AdPageHeaderConfig } from './page-header.config'; +import { Subscription } from 'rxjs'; @Component({ selector: 'page-header', @@ -57,8 +59,9 @@ import { AdPageHeaderConfig } from './page-header.config'; }, preserveWhitespaces: false, }) -export class PageHeaderComponent implements OnInit, OnChanges, AfterViewInit { +export class PageHeaderComponent implements OnInit, OnChanges, AfterViewInit, OnDestroy { private inited = false; + private i18n$: Subscription; @ViewChild('conTpl') private conTpl: ElementRef; private _menus: Menu[]; @@ -149,6 +152,8 @@ export class PageHeaderComponent implements OnInit, OnChanges, AfterViewInit { private reuseSrv: ReuseTabService, ) { Object.assign(this, cog); + if (this.i18nSrv) + this.i18n$ = this.i18nSrv.change.subscribe(() => this.refresh()); } refresh() { @@ -225,4 +230,8 @@ export class PageHeaderComponent implements OnInit, OnChanges, AfterViewInit { ngOnChanges(): void { if (this.inited) this.refresh(); } + + ngOnDestroy(): void { + if (this.i18n$) this.i18n$.unsubscribe(); + } } diff --git a/packages/abc/page-header/page-header.spec.ts b/packages/abc/page-header/page-header.spec.ts index d6bfa5468..28f3559e5 100644 --- a/packages/abc/page-header/page-header.spec.ts +++ b/packages/abc/page-header/page-header.spec.ts @@ -9,7 +9,7 @@ import { import { ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { RouterModule, Router } from '@angular/router'; -import { APP_BASE_HREF } from '@angular/common'; +import { APP_BASE_HREF, I18nSelectPipe } from '@angular/common'; import { MenuService, AlainThemeModule, @@ -64,6 +64,8 @@ describe('abc: page-header', () => { expect(el.textContent.trim()).toBe(value); } + afterEach(() => context.comp.ngOnDestroy()); + describe('[property]', () => { beforeEach(() => createComp()); @@ -156,32 +158,6 @@ describe('abc: page-header', () => { expect(dl.queryAll(By.css('nz-breadcrumb-item')).length).toBe(2); }); - it('should be i18n', () => { - menuSrv.add([ - { - text: 'root', - i18n: 'root-i18n', - children: [ - { - text: '1-1', - link: '/1-1', - children: [ - { text: '1-1-1', link: '/1-1/1-1-1' }, - { text: '1-1-2', link: '/1-1/1-1-2' }, - ], - }, - ], - }, - ]); - spyOnProperty(route, 'url').and.returnValue('/1-1/1-1-2'); - spyOn(i18n, 'fanyi'); - expect(i18n.fanyi).not.toHaveBeenCalled(); - context.autoBreadcrumb = true; - fixture.detectChanges(); - expect(dl.queryAll(By.css('nz-breadcrumb-item')).length).toBe(3); - expect(i18n.fanyi).toHaveBeenCalled(); - }); - describe('#home', () => { it('shoule be hide home', () => { spyOnProperty(route, 'url').and.returnValue('/1-1/1-1-2'); @@ -201,6 +177,40 @@ describe('abc: page-header', () => { expect(i18n.fanyi).toHaveBeenCalled(); }); }); + + describe('[i18n]', () => { + it('should be auto fanyi i18n text', () => { + menuSrv.add([ + { + text: 'root', + i18n: 'root-i18n', + children: [ + { + text: '1-1', + link: '/1-1', + children: [ + { text: '1-1-1', link: '/1-1/1-1-1' }, + { text: '1-1-2', link: '/1-1/1-1-2' }, + ], + }, + ], + }, + ]); + spyOnProperty(route, 'url').and.returnValue('/1-1/1-1-2'); + spyOn(i18n, 'fanyi'); + expect(i18n.fanyi).not.toHaveBeenCalled(); + context.autoBreadcrumb = true; + fixture.detectChanges(); + expect(dl.queryAll(By.css('nz-breadcrumb-item')).length).toBe(3); + expect(i18n.fanyi).toHaveBeenCalled(); + }); + it('should be refresh when i18n changed', () => { + spyOn(context.comp, 'refresh'); + expect(context.comp.refresh).not.toHaveBeenCalled(); + i18n.use('en'); + expect(context.comp.refresh).toHaveBeenCalled(); + }); + }); }); describe('[generateion title]', () => { @@ -237,11 +247,13 @@ describe('abc: page-header', () => { describe('[auto sync title]', () => { class MockTitle { - setTitle = jasmine.createSpy() + setTitle = jasmine.createSpy(); } class MockReuse { set title(val: string) {} - get title(): string { return ''; } + get title(): string { + return ''; + } } let titleSrv: TitleService; let reuseSrv: ReuseTabService; @@ -262,7 +274,11 @@ describe('abc: page-header', () => { }); it('should be auto sync title of document and result-tab', () => { - const spyReuseTitle = spyOnProperty(reuseSrv, 'title', 'set').and.callThrough(); + const spyReuseTitle = spyOnProperty( + reuseSrv, + 'title', + 'set', + ).and.callThrough(); context.title = 'test'; fixture.detectChanges(); expect(titleSrv.setTitle).toHaveBeenCalled();