From c0d8f24533f72743130614a9c5edb2272c0924fb Mon Sep 17 00:00:00 2001 From: Carlos Santos <4a.santos@gmail.com> Date: Thu, 24 Nov 2022 14:13:18 +0100 Subject: [PATCH] openvidu-components: Added lang and captionsLang directive tests --- .../e2e/webcomponent-app/app.js | 6 ++ .../e2e/webcomponent.test.ts | 55 +++++++++++++++++++ .../api/videoconference.directive.ts | 4 +- .../openvidu-webcomponent.component.html | 2 + .../openvidu-webcomponent.component.ts | 33 +++++++++++ 5 files changed, 98 insertions(+), 2 deletions(-) diff --git a/openvidu-components-angular/e2e/webcomponent-app/app.js b/openvidu-components-angular/e2e/webcomponent-app/app.js index fb138b47..6c1e5a27 100644 --- a/openvidu-components-angular/e2e/webcomponent-app/app.js +++ b/openvidu-components-angular/e2e/webcomponent-app/app.js @@ -1,5 +1,7 @@ var MINIMAL; +var LANG; +var CAPTIONS_LANG; var PREJOIN; var VIDEO_MUTED; var AUDIO_MUTED; @@ -35,6 +37,8 @@ $(document).ready(() => { // Directives MINIMAL = url.searchParams.get("minimal") === null ? false : url.searchParams.get("minimal") === 'true'; + LANG = url.searchParams.get("lang") || 'en'; + CAPTIONS_LANG = url.searchParams.get("captionsLang") || 'en-US'; PARTICIPANT_NAME = url.searchParams.get("participantName") || 'TEST_USER'; PREJOIN = url.searchParams.get("prejoin") === null ? true : url.searchParams.get("prejoin") === 'true'; VIDEO_MUTED = url.searchParams.get("videoMuted") === null ? false : url.searchParams.get("videoMuted") === 'true'; @@ -154,6 +158,8 @@ async function joinSession(sessionName, participantName) { } webComponent.minimal = MINIMAL; + webComponent.lang = LANG; + webComponent.captionsLang = CAPTIONS_LANG; webComponent.prejoin = PREJOIN; webComponent.videoMuted = VIDEO_MUTED; webComponent.audioMuted = AUDIO_MUTED; diff --git a/openvidu-components-angular/e2e/webcomponent.test.ts b/openvidu-components-angular/e2e/webcomponent.test.ts index f4936576..9def9355 100644 --- a/openvidu-components-angular/e2e/webcomponent.test.ts +++ b/openvidu-components-angular/e2e/webcomponent.test.ts @@ -97,6 +97,61 @@ describe('Testing API Directives', () => { expect(await utils.isPresent('#settings-container')).to.be.false; }); + it('should change the UI LANG ', async () => { + await browser.get(`${url}?lang=es`); + + await utils.checkPrejoinIsPresent(); + + let element = await utils.waitForElement('.lang-button'); + expect(await element.getText()).equal('Españolexpand_more'); + + element = await utils.waitForElement('#join-button'); + expect(await element.getText()).equal('Unirme ahora'); + }); + + /** + * TODO: + * This test is only available with OpenVidu PRO + */ + // it('should change the captions LANG ', async () => { + // await browser.get(`${url}?prejoin=false&captionsLang=es-ES`); + + // await utils.checkSessionIsPresent(); + + // // Checking if toolbar is present + // await utils.checkToolbarIsPresent(); + + // // Open more options menu + // await utils.clickOn('#more-options-btn'); + + // await browser.sleep(500); + + // // Checking if button panel is present + // await utils.waitForElement('.mat-menu-content'); + // expect(await utils.isPresent('.mat-menu-content')).to.be.true; + + // // Checking if captions button is present + // await utils.waitForElement('#captions-btn'); + // expect(await utils.isPresent('#captions-btn')).to.be.true; + // await utils.clickOn('#captions-btn'); + + // await utils.waitForElement('.captions-container'); + // await utils.waitForElement('#caption-settings-btn'); + // await utils.clickOn('#caption-settings-btn'); + + // await browser.sleep(500); + + // await utils.waitForElement('.settings-container'); + // expect(await utils.isPresent('.settings-container')).to.be.true; + + // await utils.waitForElement('ov-captions-settings'); + + // expect(await utils.isPresent('.captions-container')).to.be.true; + + // const element = await utils.waitForElement('.lang-button'); + // expect(await element.getText()).equal('Españolexpand_more') + // }); + it('should show the PREJOIN page', async () => { await browser.get(`${url}?prejoin=true`); diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/directives/api/videoconference.directive.ts b/openvidu-components-angular/projects/openvidu-angular/src/lib/directives/api/videoconference.directive.ts index 55036d09..3aeea03a 100644 --- a/openvidu-components-angular/projects/openvidu-angular/src/lib/directives/api/videoconference.directive.ts +++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/directives/api/videoconference.directive.ts @@ -75,7 +75,7 @@ export class MinimalDirective implements OnDestroy { * * Portuguese: `pt` * * @example - * + * */ @Directive({ selector: 'ov-videoconference[lang]' @@ -138,7 +138,7 @@ export class LangDirective implements OnDestroy { * * Portuguese: `pt-PT` * * @example - * + * */ @Directive({ selector: 'ov-videoconference[captionsLang]' diff --git a/openvidu-components-angular/src/app/openvidu-webcomponent/openvidu-webcomponent.component.html b/openvidu-components-angular/src/app/openvidu-webcomponent/openvidu-webcomponent.component.html index c2a83fce..98a2bf42 100644 --- a/openvidu-components-angular/src/app/openvidu-webcomponent/openvidu-webcomponent.component.html +++ b/openvidu-components-angular/src/app/openvidu-webcomponent/openvidu-webcomponent.component.html @@ -3,6 +3,8 @@ [participantName]="_participantName" [tokens]="_tokens" [minimal]="_minimal" + [lang]="_lang" + [captionsLang]="_captionsLang" [prejoin]="_prejoin" [videoMuted]="_videoMuted" [audioMuted]="_audioMuted" diff --git a/openvidu-components-angular/src/app/openvidu-webcomponent/openvidu-webcomponent.component.ts b/openvidu-components-angular/src/app/openvidu-webcomponent/openvidu-webcomponent.component.ts index 55f62d4d..04336c66 100644 --- a/openvidu-components-angular/src/app/openvidu-webcomponent/openvidu-webcomponent.component.ts +++ b/openvidu-components-angular/src/app/openvidu-webcomponent/openvidu-webcomponent.component.ts @@ -19,6 +19,15 @@ export class OpenviduWebComponentComponent implements OnInit { * @internal */ _minimal: boolean = false; + /** + * @internal + */ + _lang: string = ''; + /** + * @internal + */ + _captionsLang: string = ''; + /** * @internal */ @@ -124,6 +133,30 @@ export class OpenviduWebComponentComponent implements OnInit { @Input() set minimal(value: string | boolean) { this._minimal = this.castToBoolean(value); } + /** + * The **lang** attribute sets the default UI language. + * + * Default: `en` + * + * @example + * + */ + @Input() set lang(value: string) { + this._lang = value; + } + /** + * The **captionsLang** attribute sets the deafult language that OpenVidu will try to recognise. + * + * It must be a valid [BCP-47](https://tools.ietf.org/html/bcp47) language tag like "en-US" or "es-ES". + * + * Default: `en-US` + * + * @example + * + */ + @Input() set captionsLang(value: string) { + this._captionsLang = value; + } /** * The **participantName** attribute sets the participant name. It can be useful for aplications which doesn't need the prejoin page. *