ov-components: add camera and microphone button visibility controls in the E2E tests

Author: CSantosM

openvidu-components-angular/e2e/webcomponent-app/app.js

@@ -9,6 +9,8 @@ var PREJOIN;
 var VIDEO_ENABLED;
 var AUDIO_ENABLED;
 
+var CAMERA_BUTTON;
+var MICROPHONE_BUTTON;
 var SCREENSHARE_BUTTON;
 var FULLSCREEN_BUTTON;
 var ACTIVITIES_PANEL_BUTTON;
@@ -58,6 +60,8 @@ document.addEventListener('DOMContentLoaded', () => {
 	PREJOIN = url.searchParams.get('prejoin') === null ? true : url.searchParams.get('prejoin') === 'true';
 	VIDEO_ENABLED = url.searchParams.get('videoEnabled') === null ? true : url.searchParams.get('videoEnabled') === 'true';
 	AUDIO_ENABLED = url.searchParams.get('audioEnabled') === null ? true : url.searchParams.get('audioEnabled') === 'true';
+	CAMERA_BUTTON = url.searchParams.get('cameraBtn') === null ? true : url.searchParams.get('cameraBtn') === 'true';
+	MICROPHONE_BUTTON = url.searchParams.get('microphoneBtn') === null ? true : url.searchParams.get('microphoneBtn') === 'true';
 	SCREENSHARE_BUTTON = url.searchParams.get('screenshareBtn') === null ? true : url.searchParams.get('screenshareBtn') === 'true';
 	RECORDING_BUTTON =
 		url.searchParams.get('toolbarRecordingButton') === null ? true : url.searchParams.get('toolbarRecordingButton') === 'true';

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

@@ -292,6 +292,31 @@ describe('Testing API Directives', () => {
 		expect(await utils.isPresent('#mic_off')).toBeTrue();
 	});
 
+	it('should run the app without camera button' , async () => {
+		await browser.get(`${url}&prejoin=false&cameraBtn=false`);
+
+		await utils.checkSessionIsPresent();
+
+		// Checking if toolbar is present
+		await utils.checkToolbarIsPresent();
+
+		// Checking if camera button is not present
+		expect(await utils.isPresent('#camera-btn')).toBeFalse();
+	});
+
+	it('should run the app without microphone button' , async () => {
+		await browser.get(`${url}&prejoin=false&microphoneBtn=false`);
+
+		await utils.checkSessionIsPresent();
+
+		// Checking if toolbar is present
+		await utils.checkToolbarIsPresent();
+
+		// Checking if microphone button is not present
+		expect(await utils.isPresent('#microphone-btn')).toBeFalse();
+	});
+
+
 	it('should HIDE the SCREENSHARE button', async () => {
 		await browser.get(`${url}&prejoin=false&screenshareBtn=false`);
 

openvidu-components-angular/src/app/openvidu-webcomponent/openvidu-webcomponent.component.html

@@ -9,6 +9,8 @@
 	[prejoin]="_prejoin"
 	[videoEnabled]="_videoEnabled"
 	[audioEnabled]="_audioEnabled"
+	[toolbarCameraButton]="_toolbarCameraButton"
+	[toolbarMicrophoneButton]="_toolbarMicrophoneButton"
 	[toolbarScreenshareButton]="_toolbarScreenshareButton"
 	[toolbarRecordingButton]="_toolbarRecordingButton"
 	[toolbarBroadcastingButton]="_toolbarBroadcastingButton"

openvidu-components-angular/src/app/openvidu-webcomponent/openvidu-webcomponent.component.ts

@@ -84,6 +84,15 @@ export class OpenviduWebComponentComponent {
 	 * @internal
 	 */
 	_audioEnabled: boolean = true;
+
+	/**
+	 * @internal
+	 */
+	_toolbarCameraButton: boolean = true;
+	/**
+	 * @internal
+	 */
+	_toolbarMicrophoneButton: boolean = true;
 	/**
 	 * @internal
 	 */
@@ -309,6 +318,31 @@ export class OpenviduWebComponentComponent {
 		this._audioEnabled = this.castToBoolean(value);
 	}
 
+	/**
+	 * The **toolbarCameraButton** attribute allows show/hide the camera toolbar button.
+	 *
+	 * Default: `true`
+	 *
+	 * @example
+	 * <openvidu-webcomponent toolbar-camera-button="false"></openvidu-webcomponent>
+	 */
+	@Input() set toolbarCameraButton(value: string | boolean) {
+		this._toolbarCameraButton = this.castToBoolean(value);
+	}
+
+	/**
+	 * The **toolbarMicrophoneButton** attribute allows show/hide the microphone toolbar button.
+	 *
+	 * Default: `true`
+	 *
+	 * @example
+	 * <openvidu-webcomponent toolbar-microphone-button="false"></openvidu-webcomponent>
+	 */
+
+	@Input() set toolbarMicrophoneButton(value: string | boolean) {
+		this._toolbarMicrophoneButton = this.castToBoolean(value);
+	}
+
 	/**
 	 * The **toolbarScreenshareButton** attribute allows show/hide the screenshare toolbar button.
 	 *