diff --git a/lib/process-services-cloud/karma.conf.js b/lib/process-services-cloud/karma.conf.js index e9129f68b2..5a782b9c12 100644 --- a/lib/process-services-cloud/karma.conf.js +++ b/lib/process-services-cloud/karma.conf.js @@ -34,14 +34,16 @@ module.exports = function (config) { { pattern: 'node_modules/moment/min/moment.min.js', included: true, watched: false }, { pattern: 'lib/core/i18n/**/en.json', included: false, served: true, watched: false }, - { pattern: 'lib/content-services-cloud/i18n/**/en.json', included: false, served: true, watched: false }, - { pattern: 'lib/process-services-cloud/i18n/**/en.json', included: false, served: true, watched: false }, + { pattern: 'lib/process-services-cloud/src/lib/i18n/*.json', included: false, served: true, watched: false }, + { pattern: 'lib/process-services-cloud/src/lib/mock/*.json', included: false, served: true, watched: false }, { pattern: 'lib/process-services-cloud/**/*.ts', included: false, served: true, watched: false }, { pattern: 'lib/config/app.config.json', included: false, served: true, watched: false } ], frameworks: ['jasmine-ajax', 'jasmine', '@angular-devkit/build-angular'], proxies: { '/assets/': '/base/lib/process-services-cloud/assets/', + '/resources/i18n/en.json': '/base/lib/process-services-cloud/src/lib/mock/en.json', + '/resources/i18n/fr.json': '/base/lib/process-services-cloud/src/lib/mock/fr.json', '/base/assets/': '/base/lib/process-services/assets/', '/assets/adf-core/i18n/en.json': '/base/lib/core/i18n/en.json', '/assets/adf-core/i18n/en-GB.json': '/base/lib/core/i18n/en.json', diff --git a/lib/process-services-cloud/src/lib/form/components/form-cloud.component.spec.ts b/lib/process-services-cloud/src/lib/form/components/form-cloud.component.spec.ts index 6ca16bb076..11c6530813 100644 --- a/lib/process-services-cloud/src/lib/form/components/form-cloud.component.spec.ts +++ b/lib/process-services-cloud/src/lib/form/components/form-cloud.component.spec.ts @@ -17,10 +17,11 @@ import { Component, CUSTOM_ELEMENTS_SCHEMA, DebugElement, SimpleChange } from '@angular/core'; import { By } from '@angular/platform-browser'; -import { ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing'; +import { async, ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing'; import { Observable, of, throwError } from 'rxjs'; import { AppConfigService, + CoreModule, FormFieldModel, FormFieldTypes, FormModel, @@ -28,8 +29,7 @@ import { FormOutcomeModel, FormRenderingService, setupTestBed, - TranslationMock, - TranslationService, + TRANSLATION_PROVIDER, WidgetVisibilityService } from '@alfresco/adf-core'; import { ProcessServiceCloudTestingModule } from '../../testing/process-service-cloud.testing.module'; @@ -39,33 +39,45 @@ import { cloudFormMock, conditionalUploadWidgetsMock, emptyFormRepresentationJSON, - fakeCloudForm + fakeCloudForm, + multilingualForm } from '../mocks/cloud-form.mock'; import { FormCloudRepresentation } from '../models/form-cloud-representation.model'; import { FormCloudModule } from '../form-cloud.module'; +import { TranslateService } from '@ngx-translate/core'; +import { NoopAnimationsModule } from '@angular/platform-browser/animations'; describe('FormCloudComponent', () => { - let formCloudService: FormCloudService; let fixture: ComponentFixture; let formComponent: FormCloudComponent; let visibilityService: WidgetVisibilityService; let formRenderingService: FormRenderingService; + let translateService: TranslateService; setupTestBed({ imports: [ - ProcessServiceCloudTestingModule, + NoopAnimationsModule, + CoreModule.forRoot(), FormCloudModule ], providers: [ - { provide: TranslationService, useClass: TranslationMock } + { + provide: TRANSLATION_PROVIDER, + multi: true, + useValue: { + name: 'app', + source: 'resources' + } + } ] }); - beforeEach(() => { + beforeEach(async(() => { formRenderingService = TestBed.get(FormRenderingService); formCloudService = TestBed.get(FormCloudService); visibilityService = TestBed.get(WidgetVisibilityService); + translateService = TestBed.get(TranslateService); spyOn(visibilityService, 'refreshVisibility').and.callThrough(); const appConfigService = TestBed.get(AppConfigService); spyOn(appConfigService, 'get').and.returnValue([]); @@ -73,7 +85,7 @@ describe('FormCloudComponent', () => { fixture = TestBed.createComponent(FormCloudComponent); formComponent = fixture.componentInstance; fixture.detectChanges(); - }); + })); it('should check form', () => { expect(formComponent.hasForm()).toBeFalsy(); @@ -848,7 +860,6 @@ describe('FormCloudComponent', () => { }); describe('form validations', () => { - it('should be able to set visibility conditions for Attach File widget', async () => { spyOn(formCloudService, 'getForm').and.returnValue(of(conditionalUploadWidgetsMock)); const formId = '123'; @@ -870,7 +881,42 @@ describe('FormCloudComponent', () => { const label = fixture.debugElement.query(By.css(`${container} label`)); expect(label.nativeElement.innerText).toEqual('Attach file'); }); + }); + describe('Multilingual Form', () => { + it('should translate form labels on language change', async () => { + spyOn(formCloudService, 'getForm').and.returnValue(of(multilingualForm)); + const formId = '123'; + const appName = 'test-app'; + formComponent.formId = formId; + formComponent.appVersion = 1; + + formComponent.ngOnChanges({ 'appName': new SimpleChange(null, appName, true) }); + expect(formCloudService.getForm).toHaveBeenCalledWith(appName, formId, 1); + + fixture.detectChanges(); + expect(getLabelValue('textField')).toEqual('Text field'); + expect(getLabelValue('fildUploadField')).toEqual('File Upload'); + expect(getLabelValue('dateField')).toEqual('Date field (D-M-YYYY)'); + expect(getLabelValue('amountField')).toEqual('Amount field'); + + expect(translateService.getLangs()).toEqual(['en', '']); + fixture.ngZone.run(() => translateService.use('fr')); + + await fixture.whenStable(); + fixture.detectChanges(); + + expect(translateService.getLangs()).toEqual(['en', '', 'fr']); + expect(getLabelValue('textField')).toEqual('Champ de texte'); + expect(getLabelValue('fildUploadField')).toEqual('Téléchargement de fichiers'); + expect(getLabelValue('dateField')).toEqual('Champ de date (D-M-YYYY)'); + expect(getLabelValue('amountField')).toEqual('Champ Montant'); + }); + + function getLabelValue(containerId: string): string { + const label = fixture.debugElement.nativeElement.querySelector(`[id="field-${containerId}-container"] label`); + return label.innerText; + } }); }); diff --git a/lib/process-services-cloud/src/lib/form/mocks/cloud-form.mock.ts b/lib/process-services-cloud/src/lib/form/mocks/cloud-form.mock.ts index be0c25fa6e..b072b5145d 100644 --- a/lib/process-services-cloud/src/lib/form/mocks/cloud-form.mock.ts +++ b/lib/process-services-cloud/src/lib/form/mocks/cloud-form.mock.ts @@ -832,3 +832,122 @@ export const conditionalUploadWidgetsMock = { } } }; + +export const multilingualForm = { + 'formRepresentation': { + 'id': 'form-2aaaf20e-43d3-46bf-89be-859d5f512dd2', + 'name': 'multilingualform', + 'description': '', + 'version': 0, + 'formDefinition': { + 'tabs': [], + 'fields': [ + { + 'id': '451e2235-3310-4c2d-9b4a-08b53ae1640c', + 'name': 'Label', + 'type': 'container', + 'tab': null, + 'numberOfColumns': 2, + 'fields': { + '1': [ + { + 'id': 'textField', + 'name': 'TEXT_FIELD.TITLE', + 'type': 'text', + 'required': false, + 'colspan': 1, + 'placeholder': null, + 'minLength': 0, + 'maxLength': 0, + 'regexPattern': null, + 'visibilityCondition': null, + 'params': { + 'existingColspan': 1, + 'maxColspan': 2 + } + } + ], + '2': [] + } + }, + { + 'id': '1c87df6c-514e-45a7-96bc-508562683bb3', + 'name': 'Label', + 'type': 'container', + 'tab': null, + 'numberOfColumns': 2, + 'fields': { + '1': [ + { + 'id': 'fildUploadField', + 'name': 'FILE_UPLOAD_FIELD.TITLE', + 'type': 'multi-line-text', + 'colspan': 1, + 'placeholder': null, + 'minLength': 0, + 'maxLength': 0, + 'regexPattern': null, + 'required': false, + 'visibilityCondition': null, + 'params': { + 'existingColspan': 1, + 'maxColspan': 2 + } + } + ], + '2': [ + { + 'id': 'amountField', + 'name': 'AMOUNT_FIELD.TITLE', + 'type': 'amount', + 'required': false, + 'colspan': 1, + 'placeholder': '123', + 'minValue': null, + 'maxValue': null, + 'visibilityCondition': null, + 'params': { + 'existingColspan': 1, + 'maxColspan': 2 + }, + 'enableFractions': false, + 'currency': '$' + } + ] + } + }, + { + 'id': '33138eea-130f-4bba-b5a5-29ea60f31786', + 'name': 'Label', + 'type': 'container', + 'tab': null, + 'numberOfColumns': 2, + 'fields': { + '1': [ + { + 'id': 'dateField', + 'name': 'DATE_FIELD.TITLE', + 'type': 'date', + 'required': false, + 'colspan': 1, + 'placeholder': null, + 'minValue': null, + 'maxValue': null, + 'visibilityCondition': null, + 'params': { + 'existingColspan': 1, + 'maxColspan': 2 + }, + 'dateDisplayFormat': 'D-M-YYYY' + } + ], + '2': [] + } + } + ], + 'outcomes': [], + 'metadata': {}, + 'variables': [] + } + } +}; diff --git a/lib/process-services-cloud/src/lib/mock/en.json b/lib/process-services-cloud/src/lib/mock/en.json new file mode 100644 index 0000000000..bea3e72cf4 --- /dev/null +++ b/lib/process-services-cloud/src/lib/mock/en.json @@ -0,0 +1,14 @@ +{ + "FILE_UPLOAD_FIELD": { + "TITLE": "File Upload" + }, + "TEXT_FIELD": { + "TITLE": "Text field" + }, + "AMOUNT_FIELD": { + "TITLE": "Amount field" + }, + "DATE_FIELD": { + "TITLE": "Date field" + } +} diff --git a/lib/process-services-cloud/src/lib/mock/fr.json b/lib/process-services-cloud/src/lib/mock/fr.json new file mode 100644 index 0000000000..2c87d09abc --- /dev/null +++ b/lib/process-services-cloud/src/lib/mock/fr.json @@ -0,0 +1,14 @@ +{ + "FILE_UPLOAD_FIELD": { + "TITLE": "Téléchargement de fichiers" + }, + "TEXT_FIELD": { + "TITLE": "Champ de texte" + }, + "AMOUNT_FIELD": { + "TITLE": "Champ Montant" + }, + "DATE_FIELD": { + "TITLE": "Champ de date" + } +}