mirror of https://github.com/OpenVidu/openvidu.git
openvidu-components: Added e2e test pro features
parent
370b3af37e
commit
c6cf3b91cd
|
@ -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
|
||||
|
|
|
@ -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';
|
||||
|
|
|
@ -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) => {
|
||||
|
|
|
@ -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');
|
||||
});
|
||||
});
|
|
@ -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"
|
||||
|
|
Loading…
Reference in New Issue