openvidu-components: Added e2e test without media devices

openvidu-components-angular/e2e/selenium.conf.ts

@@ -10,23 +10,42 @@ interface BrowserConfig {
 	browserName: string;
 }
 
-let chromeArguments = ['--window-size=1024,768', '--use-fake-ui-for-media-stream', '--use-fake-device-for-media-stream'];
+const chromeArguments = ['--window-size=1024,768', '--use-fake-ui-for-media-stream', '--use-fake-device-for-media-stream'];
-let chromeArgumentsCI = [
+const chromeArgumentsCI = [
 	'--headless',
 	'--no-sandbox',
-	'--disable-extensions',
 	'--disable-gpu',
+	'--disable-popup-blocking',
+	'--no-first-run',
+	'--no-default-browser-check',
 	'--disable-dev-shm-usage',
+	'--disable-background-networking',
+	'--disable-default-apps',
 	'--use-fake-ui-for-media-stream',
 	'--use-fake-device-for-media-stream'
 ];
+const chromeArgumentsWithoutMediaDevices = ['--window-size=1024,768', '--deny-permission-prompts'];
+
+
+const chromeArgumentsWithoutMediaDevicesCI = [
+	'--headless',
+	'--no-sandbox',
+	'--disable-gpu',
+	'--disable-popup-blocking',
+	'--no-first-run',
+	'--no-default-browser-check',
+	'--disable-dev-shm-usage',
+	'--disable-background-networking',
+	'--disable-default-apps',
+	'--deny-permission-prompts'
+];
 
 export const WebComponentConfig: BrowserConfig = {
 	appUrl: 'http://localhost:8080/',
 	seleniumAddress: LAUNCH_MODE === 'CI' ? 'http://localhost:3000/webdriver' : '',
 	browserName: 'chrome',
 	browserCapabilities: Capabilities.chrome().set('acceptInsecureCerts', true),
-	browserOptions: new chrome.Options().addArguments(...(LAUNCH_MODE === 'CI' ? chromeArgumentsCI : chromeArguments))
+	browserOptions: new chrome.Options().excludeSwitches().addArguments(...(LAUNCH_MODE === 'CI' ? chromeArgumentsCI : chromeArguments))
 };
 
 export const AngularConfig: BrowserConfig = {
@@ -36,3 +55,12 @@ export const AngularConfig: BrowserConfig = {
 	browserCapabilities: Capabilities.chrome().set('acceptInsecureCerts', true),
 	browserOptions: new chrome.Options().addArguments(...(LAUNCH_MODE === 'CI' ? chromeArgumentsCI : chromeArguments))
 };
+
+export function getBrowserOptionsWithoutDevices() {
+	if(LAUNCH_MODE === 'CI') {
+		return new chrome.Options().addArguments(...chromeArgumentsWithoutMediaDevicesCI);
+	} else {
+		return new chrome.Options().addArguments(...chromeArgumentsWithoutMediaDevices);
+	}
+}
+

openvidu-components-angular/e2e/webcomponent.test.ts

@@ -1,6 +1,6 @@
 import { expect } from 'chai';
 import { Builder, By, WebDriver } from 'selenium-webdriver';
-import { WebComponentConfig } from './selenium.conf';
+import { getBrowserOptionsWithoutDevices, WebComponentConfig } from './selenium.conf';
 import { OpenViduComponentsPO } from './utils.po.test';
 
 const url = WebComponentConfig.appUrl;
@@ -1452,3 +1452,104 @@ describe('Testing captions features', () => {
 
 	});
 });
+
+describe('Testing WITHOUT MEDIA DEVICES permissions', () => {
+	let browser: WebDriver;
+	let utils: OpenViduComponentsPO;
+	async function createChromeBrowser(): Promise<WebDriver> {
+		return await new Builder()
+			.forBrowser(WebComponentConfig.browserName)
+			.withCapabilities(WebComponentConfig.browserCapabilities)
+			.setChromeOptions(getBrowserOptionsWithoutDevices())
+			.usingServer(WebComponentConfig.seleniumAddress)
+			.build();
+	}
+
+	beforeEach(async () => {
+		browser = await createChromeBrowser();
+		utils = new OpenViduComponentsPO(browser);
+	});
+
+	afterEach(async () => {
+		await browser.quit();
+	});
+
+	it('should be able to ACCESS to PREJOIN page', async () => {
+		await browser.get(`${url}`);
+
+		await utils.checkPrejoinIsPresent();
+
+		let button = await utils.waitForElement('#camera-button');
+		expect(await button.isEnabled()).to.be.false;
+
+		button = await utils.waitForElement('#microphone-button');
+		expect(await button.isEnabled()).to.be.false;
+	});
+
+	it('should be able to ACCESS to ROOM page', async () => {
+		await browser.get(`${url}`);
+
+		await utils.checkPrejoinIsPresent();
+
+		await utils.clickOn('#join-button');
+
+		await utils.checkSessionIsPresent();
+
+		await utils.checkToolbarIsPresent();
+
+		let button = await utils.waitForElement('#camera-btn');
+		expect(await button.isEnabled()).to.be.false;
+
+		button = await utils.waitForElement('#mic-btn');
+		expect(await button.isEnabled()).to.be.false;
+	});
+
+	it('should be able to ACCESS to ROOM page without prejoin', async () => {
+		await browser.get(`${url}?prejoin=false`);
+
+		await utils.checkSessionIsPresent();
+
+		await utils.checkToolbarIsPresent();
+
+		let button = await utils.waitForElement('#camera-btn');
+		expect(await button.isEnabled()).to.be.false;
+
+		button = await utils.waitForElement('#mic-btn');
+		expect(await button.isEnabled()).to.be.false;
+	});
+
+	it('should the settings buttons be disabled', async () => {
+		await browser.get(`${url}?prejoin=false`);
+
+		await utils.checkToolbarIsPresent();
+
+		// Open more options menu
+		await utils.clickOn('#more-options-btn');
+
+		await browser.sleep(500);
+
+		// Checking if fullscreen button is not present
+		await utils.waitForElement('.mat-menu-content');
+		expect(await utils.isPresent('.mat-menu-content')).to.be.true;
+
+		await utils.clickOn('#toolbar-settings-btn');
+
+		await browser.sleep(500);
+
+		await utils.waitForElement('.settings-container');
+		expect(await utils.isPresent('.settings-container')).to.be.true;
+
+		await utils.clickOn('#video-opt');
+		expect(await utils.isPresent('ov-video-devices-select')).to.be.true;
+
+		let button = await utils.waitForElement('#camera-button');
+		expect(await button.isEnabled()).to.be.false;
+
+		await utils.clickOn('#audio-opt');
+		expect(await utils.isPresent('ov-audio-devices-select')).to.be.true;
+
+		button = await utils.waitForElement('#microphone-button');
+		expect(await button.isEnabled()).to.be.false;
+
+	});
+});

openvidu-components-angular/projects/openvidu-angular/src/lib/components/settings/audio-devices/audio-devices.component.html

@@ -1,5 +1,5 @@
 <div class="device-container-element">
-	<button mat-icon-button id="microhpone-button" [disabled]="!hasAudioDevices" [class.warn-btn]="isAudioMuted" (click)="toggleMic()">
+	<button mat-icon-button id="microphone-button" [disabled]="!hasAudioDevices" [class.warn-btn]="isAudioMuted" (click)="toggleMic()">
 		<mat-icon
 			*ngIf="!isAudioMuted"
 			[matTooltipDisabled]="!hasAudioDevices"