From 53cf5acc865b18d1f97fa2c5e5951ce43af24109 Mon Sep 17 00:00:00 2001 From: Denys Vuika Date: Fri, 18 May 2018 10:51:13 +0100 Subject: [PATCH] [ADF-3028] i18n support for title service (#3342) * i18n support for title service * cleanup tests * update tests --- demo-shell/src/app/app.component.ts | 21 +++++---- .../base-upload/upload-base.spec.ts | 5 +- .../upload-button.component.spec.ts | 2 +- lib/core/mock/translation.service.mock.ts | 6 +-- lib/core/services/page-title.service.spec.ts | 47 ++++++++++++++----- lib/core/services/page-title.service.ts | 25 ++++++++-- 6 files changed, 75 insertions(+), 31 deletions(-) diff --git a/demo-shell/src/app/app.component.ts b/demo-shell/src/app/app.component.ts index d81659ea25..dae3d46971 100644 --- a/demo-shell/src/app/app.component.ts +++ b/demo-shell/src/app/app.component.ts @@ -15,9 +15,8 @@ * limitations under the License. */ -import { Component, ViewEncapsulation } from '@angular/core'; -import { ActivatedRoute } from '@angular/router'; -import { SettingsService, PageTitleService, StorageService, TranslationService } from '@alfresco/adf-core'; +import { Component, ViewEncapsulation, OnInit } from '@angular/core'; +import { SettingsService, PageTitleService, StorageService } from '@alfresco/adf-core'; @Component({ selector: 'app-root', @@ -25,15 +24,17 @@ import { SettingsService, PageTitleService, StorageService, TranslationService } styleUrls: ['./app.component.scss'], encapsulation: ViewEncapsulation.None }) -export class AppComponent { +export class AppComponent implements OnInit { - constructor(private settingsService: SettingsService, - private storage: StorageService, - translationService: TranslationService, - pageTitleService: PageTitleService, - route: ActivatedRoute) { + constructor(private settingsService: SettingsService, + private storage: StorageService, + private pageTitleService: PageTitleService) { + } + + ngOnInit() { this.setProvider(); - pageTitleService.setTitle(); + + this.pageTitleService.setTitle('title'); } private setProvider() { diff --git a/lib/content-services/upload/components/base-upload/upload-base.spec.ts b/lib/content-services/upload/components/base-upload/upload-base.spec.ts index e04c60c2e3..4382f201ed 100644 --- a/lib/content-services/upload/components/base-upload/upload-base.spec.ts +++ b/lib/content-services/upload/components/base-upload/upload-base.spec.ts @@ -26,7 +26,6 @@ import { NoopAnimationsModule } from '@angular/platform-browser/animations'; selector: 'adf-upload-button-test', template: 'test componente' }) - export class UploadTestComponent extends UploadBase { constructor(protected uploadService: UploadService, @@ -234,7 +233,7 @@ describe('UploadBase', () => { addToQueueSpy = spyOn(uploadService, 'addToQueue'); }); - it('should be a mahor version upload if majorVersion is true', () => { + it('should be a major version upload if majorVersion is true', () => { component.majorVersion = true; component.versioning = true; @@ -250,7 +249,7 @@ describe('UploadBase', () => { })); }); - it('should not be a mahor version upload if majorVersion is false', () => { + it('should not be a major version upload if majorVersion is false', () => { component.majorVersion = false; component.versioning = true; diff --git a/lib/content-services/upload/components/upload-button.component.spec.ts b/lib/content-services/upload/components/upload-button.component.spec.ts index 01642f7319..fa8b45b0ac 100644 --- a/lib/content-services/upload/components/upload-button.component.spec.ts +++ b/lib/content-services/upload/components/upload-button.component.spec.ts @@ -20,7 +20,7 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ContentService, UploadService, TranslationService, setupTestBed, CoreModule } from '@alfresco/adf-core'; import { Observable } from 'rxjs/Observable'; import { UploadButtonComponent } from './upload-button.component'; -import { TranslationMock, PermissionsEnum } from '@alfresco/adf-core'; +import { TranslationMock } from '@alfresco/adf-core'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; describe('UploadButtonComponent', () => { diff --git a/lib/core/mock/translation.service.mock.ts b/lib/core/mock/translation.service.mock.ts index 0420c22bf6..e983b41709 100644 --- a/lib/core/mock/translation.service.mock.ts +++ b/lib/core/mock/translation.service.mock.ts @@ -28,9 +28,9 @@ export class TranslationMock { defaultLang: string = 'en'; userLang: string; customLoader: any; - translate: any; - - onLangChange: EventEmitter = new EventEmitter(); + translate = { + onLangChange: new EventEmitter() + }; addTranslationFolder() { diff --git a/lib/core/services/page-title.service.spec.ts b/lib/core/services/page-title.service.spec.ts index 8fe5ad0f32..1397502834 100644 --- a/lib/core/services/page-title.service.spec.ts +++ b/lib/core/services/page-title.service.spec.ts @@ -20,6 +20,9 @@ import { Title } from '@angular/platform-browser'; import { AppConfigService } from '../app-config/app-config.service'; import { PageTitleService } from './page-title.service'; +import { CoreTestingModule } from '../testing/core.testing.module'; +import { TranslationService } from './translation.service'; +import { TranslationMock } from '../mock/translation.service.mock'; class TestConfig { private setup: any = { @@ -28,6 +31,7 @@ class TestConfig { titleService: Title = null; appTitleService: PageTitleService = null; + translationService: TranslationService; constructor(setup: any = {}) { Object.assign(this.setup, setup); @@ -53,48 +57,69 @@ class TestConfig { }; TestBed.configureTestingModule({ + imports: [ + CoreTestingModule + ], providers: [ titleServiceProvider, appConfigProvider, - PageTitleService + PageTitleService, + { + provide: TranslationService, + useClass: TranslationMock + } ] }); - inject([ Title, PageTitleService ], (titleService, appTitleService) => { + inject([ Title, PageTitleService, TranslationService ], (titleService, appTitleService, translationService) => { this.titleService = titleService; this.appTitleService = appTitleService; + this.translationService = translationService; })(); } } describe('AppTitle service', () => { - it('sets default application name', () => { + it('should set default application name', () => { const { appTitleService, titleService } = new TestConfig({ applicationName: undefined }); appTitleService.setTitle(); - expect(titleService.setTitle) - .toHaveBeenCalledWith('Alfresco ADF Application'); + expect(titleService.setTitle).toHaveBeenCalledWith('Alfresco ADF Application'); }); - it('sets only the application name', () => { + it('should set only the application name', () => { const { appTitleService, titleService } = new TestConfig({ applicationName: 'My application' }); appTitleService.setTitle(); - expect(titleService.setTitle) - .toHaveBeenCalledWith('My application'); + expect(titleService.setTitle).toHaveBeenCalledWith('My application'); }); - it('appends application name to the title', () => { + it('should append application name to the title', () => { const { appTitleService, titleService } = new TestConfig({ applicationName: 'My application' }); appTitleService.setTitle('My page'); - expect(titleService.setTitle) - .toHaveBeenCalledWith('My page - My application'); + expect(titleService.setTitle).toHaveBeenCalledWith('My page - My application'); + }); + + it('should update title on language change', () => { + const { appTitleService, titleService, translationService } = new TestConfig({ + applicationName: 'My application' + }); + + spyOn(translationService, 'instant').and.returnValues('hello', 'привет'); + + appTitleService.setTitle('key'); + expect(titleService.setTitle).toHaveBeenCalledWith('hello - My application'); + + ( titleService).setTitle.calls.reset(); + + translationService.translate.onLangChange.next( {}); + expect(titleService.setTitle).toHaveBeenCalledWith('привет - My application'); }); }); diff --git a/lib/core/services/page-title.service.ts b/lib/core/services/page-title.service.ts index 39cb2e5abd..822ebd0e65 100644 --- a/lib/core/services/page-title.service.ts +++ b/lib/core/services/page-title.service.ts @@ -18,22 +18,41 @@ import { Injectable } from '@angular/core'; import { Title } from '@angular/platform-browser'; import { AppConfigService } from '../app-config/app-config.service'; +import { TranslationService } from './translation.service'; @Injectable() export class PageTitleService { + private originalTitle: string = ''; + private translatedTitle: string = ''; + constructor( private titleService: Title, - private appConfig: AppConfigService) {} + private appConfig: AppConfigService, + private translationService: TranslationService) { + translationService.translate.onLangChange.subscribe(() => this.onLanguageChanged()); + } /** * Sets the page title. * @param value The new title */ setTitle(value: string = '') { - const name = this.appConfig.get('application.name') || 'Alfresco ADF Application'; - const title = value ? `${value} - ${name}` : `${name}`; + this.originalTitle = value; + this.translatedTitle = this.translationService.instant(value); + this.updateTitle(); + } + + private onLanguageChanged() { + this.translatedTitle = this.translationService.instant(this.originalTitle); + this.updateTitle(); + } + + private updateTitle() { + const name = this.appConfig.get('application.name') || 'Alfresco ADF Application'; + + const title = this.translatedTitle ? `${this.translatedTitle} - ${name}` : `${name}`; this.titleService.setTitle(title); } }