openvidu-components: Added e2e test pro features

pull/772/head
Carlos Santos 2022-11-24 18:12:40 +01:00
parent 370b3af37e
commit c6cf3b91cd
5 changed files with 388 additions and 4 deletions

View File

@ -110,3 +110,34 @@ jobs:
run: npm run webcomponent:serve-testapp --prefix openvidu-components-angular &
- name: Run Webcomponent E2E
run: npm run webcomponent:e2e-ci --prefix openvidu-components-angular
webcomponent_e2e_pro:
needs: test_setup
name: Webcomponent E2E PRO tests
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
- uses: actions/setup-node@v3
with:
node-version: '16'
- uses: actions/download-artifact@v3
with:
name: openvidu-browser
path: openvidu-components-angular
- name: Run Browserless Chrome
run: docker run -d -p 3000:3000 --network host browserless/chrome:1.53-chrome-stable
- name: Install openvidu-browser and dependencies
run: |
cd openvidu-components-angular
npm install openvidu-browser-*.tgz
- name: Build openvidu-angular
run: npm run lib:build --prefix openvidu-components-angular
- name: Build openvidu-webcomponent
run: npm run webcomponent:build --prefix openvidu-components-angular
- name: Serve Webcomponent Testapp
run: npm run webcomponent:serve-testapp --prefix openvidu-components-angular &
- name: Run Webcomponent E2E PRO
env:
OPENVIDU_SERVER_URL: ${{ secrets.OPENVIDU_CALL_NEXT_URL }}
OPENVIDU_SECRET: ${{ secrets.OPENVIDU_CALL_NEXT_SECRET }}
run: npm run webcomponent:e2e-pro-ci --prefix openvidu-components-angular

View File

@ -1 +1,3 @@
export const LAUNCH_MODE = process.env.LAUNCH_MODE || 'DEV';
export const OPENVIDU_SERVER_URL = process.env.OPENVIDU_SERVER_URL || 'http://localhost:4443';
export const OPENVIDU_SECRET = process.env.OPENVIDU_SECRET || 'MY_SECRET';

View File

@ -29,9 +29,17 @@ var SESSION_NAME;
var PARTICIPANT_NAME;
var OPENVIDU_SERVER_URL;
var OPENVIDU_SECRET;
$(document).ready(() => {
var url = new URL(window.location.href);
OPENVIDU_SERVER_URL = url.searchParams.get('OV_URL');
OPENVIDU_SECRET = url.searchParams.get('OV_SECRET')
SINGLE_TOKEN = url.searchParams.get('singleToken') === null ? false : url.searchParams.get('singleToken') === 'true';
// Directives
@ -214,8 +222,6 @@ async function joinSession(sessionName, participantName) {
* 3) Configure OpenVidu Web Component in your client side with the token
*/
var OPENVIDU_SERVER_URL = 'http://localhost:4443';
var OPENVIDU_SERVER_SECRET = 'MY_SECRET';
function getToken(sessionName) {
return createSession(sessionName).then((sessionId) => createToken(sessionId));
@ -229,7 +235,7 @@ function createSession(sessionName) {
url: OPENVIDU_SERVER_URL + '/openvidu/api/sessions',
data: JSON.stringify({ customSessionId: sessionName }),
headers: {
Authorization: 'Basic ' + btoa('OPENVIDUAPP:' + OPENVIDU_SERVER_SECRET),
Authorization: 'Basic ' + btoa('OPENVIDUAPP:' + OPENVIDU_SECRET),
'Content-Type': 'application/json'
},
success: (response) => resolve(response.id),
@ -264,7 +270,7 @@ function createToken(sessionId) {
url: `${OPENVIDU_SERVER_URL}/openvidu/api/sessions/${sessionId}/connection`,
data: JSON.stringify({ session: sessionId, role: 'MODERATOR' }),
headers: {
Authorization: 'Basic ' + btoa('OPENVIDUAPP:' + OPENVIDU_SERVER_SECRET),
Authorization: 'Basic ' + btoa('OPENVIDUAPP:' + OPENVIDU_SECRET),
'Content-Type': 'application/json'
},
success: (response) => {

View File

@ -0,0 +1,343 @@
import { expect } from 'chai';
import { Builder, WebDriver } from 'selenium-webdriver';
import { OPENVIDU_SECRET, OPENVIDU_SERVER_URL } from './config';
import { WebComponentConfig } from './selenium.conf';
import { OpenViduComponentsPO } from './utils.po.test';
const url = `${WebComponentConfig.appUrl}?OV_URL=${OPENVIDU_SERVER_URL}&OV_SECRET=${OPENVIDU_SECRET}`;
/**
*
* Testing PRO features with OpenVidu PRO
* TODO: Change the openvidu URL when openvidu-pro-dev exists
*/
describe('Testing API Directives', () => {
let browser: WebDriver;
let utils: OpenViduComponentsPO;
async function createChromeBrowser(): Promise<WebDriver> {
return await new Builder()
.forBrowser(WebComponentConfig.browserName)
.withCapabilities(WebComponentConfig.browserCapabilities)
.setChromeOptions(WebComponentConfig.browserOptions)
.usingServer(WebComponentConfig.seleniumAddress)
.build();
}
beforeEach(async () => {
browser = await createChromeBrowser();
utils = new OpenViduComponentsPO(browser);
});
afterEach(async () => {
// console.log('data:image/png;base64,' + await browser.takeScreenshot());
await browser.quit();
});
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 override the CAPTIONS LANG OPTIONS', async () => {
await browser.get(`${url}&prejoin=false&captionsLangOptions=true`);
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('Espexpand_more');
await element.click();
expect(await utils.getNumberOfElements('.mat-menu-item')).equals(2);
});
});
describe('Testing panels', () => {
let browser: WebDriver;
let utils: OpenViduComponentsPO;
async function createChromeBrowser(): Promise<WebDriver> {
return await new Builder()
.forBrowser(WebComponentConfig.browserName)
.withCapabilities(WebComponentConfig.browserCapabilities)
.setChromeOptions(WebComponentConfig.browserOptions)
.usingServer(WebComponentConfig.seleniumAddress)
.build();
}
beforeEach(async () => {
browser = await createChromeBrowser();
utils = new OpenViduComponentsPO(browser);
});
afterEach(async () => {
await browser.quit();
});
it('should toggle BACKGROUND panel on prejoin page when VIDEO is MUTED', async () => {
let element;
await browser.get(`${url}`);
element = await utils.waitForElement('#pre-join-container');
expect(await utils.isPresent('#pre-join-container')).to.be.true;
const backgroundButton = await utils.waitForElement('#background-effects-btn');
expect(await utils.isPresent('#background-effects-btn')).to.be.true;
expect(await backgroundButton.isEnabled()).to.be.true;
await backgroundButton.click();
await browser.sleep(500);
await utils.waitForElement('#background-effects-container');
expect(await utils.isPresent('#background-effects-container')).to.be.true;
element = await utils.waitForElement('#camera-button');
expect(await utils.isPresent('#camera-button')).to.be.true;
expect(await element.isEnabled()).to.be.true;
await element.click();
await browser.sleep(500);
element = await utils.waitForElement('#video-poster');
expect(await utils.isPresent('#video-poster')).to.be.true;
expect(await backgroundButton.isDisplayed()).to.be.true;
expect(await backgroundButton.isEnabled()).to.be.false;
expect(await utils.isPresent('#background-effects-container')).to.be.false;
});
});
describe('Testing captions features', () => {
let browser: WebDriver;
let utils: OpenViduComponentsPO;
async function createChromeBrowser(): Promise<WebDriver> {
return await new Builder()
.forBrowser(WebComponentConfig.browserName)
.withCapabilities(WebComponentConfig.browserCapabilities)
.setChromeOptions(WebComponentConfig.browserOptions)
.usingServer(WebComponentConfig.seleniumAddress)
.build();
}
beforeEach(async () => {
browser = await createChromeBrowser();
utils = new OpenViduComponentsPO(browser);
});
afterEach(async () => {
await browser.quit();
});
it('should OPEN the CAPTIONS container', async () => {
await browser.get(`${url}&prejoin=false`);
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');
});
it('should OPEN the SETTINGS panel from captions button', async () => {
await browser.get(`${url}&prejoin=false`);
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 caption button is not present
expect(await utils.isPresent('#caption-settings-btn')).to.be.false;
});
it('should TOGGLE the CAPTIONS container from settings panel', async () => {
await browser.get(`${url}&prejoin=false`);
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;
await utils.clickOn('#captions-toggle-slide');
expect(await utils.isPresent('.captions-container')).to.be.false;
await browser.sleep(200);
await utils.clickOn('#captions-toggle-slide');
expect(await utils.isPresent('.captions-container')).to.be.true;
});
it('should change the CAPTIONS language', async () => {
await browser.get(`${url}&prejoin=false`);
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;
await utils.clickOn('.lang-button');
await browser.sleep(500);
await utils.clickOn('#es-ES');
await utils.clickOn('.panel-close-button');
const button = await utils.waitForElement('#caption-settings-btn');
expect(await button.getText()).equals('settingsEspañol');
});
});

View File

@ -73,6 +73,8 @@
"webcomponent:build": "./node_modules/@angular/cli/bin/ng.js build openvidu-webcomponent --configuration production && node ./openvidu-webcomponent-build.js",
"webcomponent:e2e": "tsc --project ./e2e && npx mocha --recursive --timeout 30000 ./e2e/dist/webcomponent.test.js",
"webcomponent:e2e-ci": "cross-env LAUNCH_MODE=CI npm run webcomponent:e2e",
"webcomponent:e2e-pro": "tsc --project ./e2e && npx mocha --recursive --timeout 30000 ./e2e/dist/webcomponent.pro.test.js",
"webcomponent:e2e-pro-ci": "cross-env LAUNCH_MODE=CI npm run webcomponent:e2e-pro",
"webcomponent:serve-testapp": "npx http-server ./e2e/webcomponent-app/"
},
"version": "2.24.0"