ov-components: remove unit tests and update media devices E2E tests

.github/workflows/openvidu-components-angular-tests.yml

@@ -154,31 +154,6 @@ jobs:
         if: always()
         uses: ./.github/actions/cleanup
 
-  unit_tests:
-    name: Unit Tests
-    runs-on: ubuntu-latest
-    needs: test_setup
-    steps:
-      - name: Checkout Repository
-        uses: actions/checkout@v4
-        with:
-          ref: ${{ inputs.commit_sha || github.sha }}
-      - name: Setup Node.js
-        uses: actions/setup-node@v4
-        with:
-          node-version: '20'
-      - name: Install wait-on package
-        run: npm install -g wait-on
-      - name: Install Dependencies
-        run: |
-          cd openvidu-components-angular
-          npm install
-      - name: Run Unit Tests
-        run: npm run lib:test --prefix openvidu-components-angular
-      - name: Cleanup
-        if: always()
-        uses: ./.github/actions/cleanup
-
   e2e_directives:
     needs: test_setup
     name: API Directives Tests
@@ -278,10 +253,9 @@ jobs:
         if: always()
         uses: ./.github/actions/cleanup
 
-  webcomponent_e2e_media_devices:
+  e2e_media_devices:
     needs: test_setup
-    name: Webcomponent media devices
+    name: Mmedia devices E2E
-    if: false
     runs-on: ubuntu-latest
     steps:
       - name: Checkout Repository
@@ -302,26 +276,12 @@ jobs:
         uses: ./.github/actions/setup-local-deployment
       - name: Setup OpenVidu Call Backend
         uses: ./.github/actions/setup-openvidu-call-backend
-      - name: Install dependencies
+      - name: Build and Serve openvidu-components-angular Testapp
-        run: |
+        uses: ./.github/actions/build-and-serve-components-testapp
-          cd openvidu-components-angular
-          npm install
-      - name: Build openvidu-angular
-        run: npm run lib:build --prefix openvidu-components-angular
-      - name: Build openvidu-webcomponent
-        run: npm run webcomponent:testing-build --prefix openvidu-components-angular
-      - name: Serve Webcomponent Testapp
-        run: npm run webcomponent:serve-testapp --prefix openvidu-components-angular &
-      - name: Wait for openvidu-components-angular Testapp
-        run: |
-            until curl -s -f -o /dev/null http://localhost:8080; do
-              echo "Waiting for openvidu-components-angular Testapp to be ready..."
-              sleep 5
-            done
       - name: Run Webcomponent E2E
         env:
           LAUNCH_MODE: CI
-        run: npm run e2e:webcomponent-media-devices --prefix openvidu-components-angular
+        run: npm run e2e:lib-media-devices --prefix openvidu-components-angular
       - name: Cleanup
         if: always()
         uses: ./.github/actions/cleanup

openvidu-components-angular/e2e/media-devices.test.ts

@@ -1,19 +1,18 @@
 import { Builder, WebDriver } from 'selenium-webdriver';
-import { OPENVIDU_CALL_SERVER } from '../config';
+import { getBrowserOptionsWithoutDevices, TestAppConfig } from './selenium.conf';
-import { getBrowserOptionsWithoutDevices, WebComponentConfig } from '../selenium.conf';
+import { OpenViduComponentsPO } from './utils.po.test';
-import { OpenViduComponentsPO } from '../utils.po.test';
 
-const url = `${WebComponentConfig.appUrl}?OV_URL=${OPENVIDU_CALL_SERVER}`;
+const url = TestAppConfig.appUrl;
 
-describe('Testing replace track with emulated devices', () => {
+describe('Media Devices: Virtual Device Replacement and Permissions Handling', () => {
 	let browser: WebDriver;
 	let utils: OpenViduComponentsPO;
 	async function createChromeBrowser(): Promise<WebDriver> {
 		return await new Builder()
-			.forBrowser(WebComponentConfig.browserName)
+			.forBrowser(TestAppConfig.browserName)
-			.withCapabilities(WebComponentConfig.browserCapabilities)
+			.withCapabilities(TestAppConfig.browserCapabilities)
-			.setChromeOptions(WebComponentConfig.browserOptions)
+			.setChromeOptions(TestAppConfig.browserOptions)
-			.usingServer(WebComponentConfig.seleniumAddress)
+			.usingServer(TestAppConfig.seleniumAddress)
 			.build();
 	}
 
@@ -23,82 +22,65 @@ describe('Testing replace track with emulated devices', () => {
 	});
 
 	afterEach(async () => {
-		// console.log('data:image/png;base64,' + await browser.takeScreenshot());
+		try {
+			await utils.leaveRoom();
+		} catch (error) {}
 		await browser.quit();
 	});
 
-	it('should replace the video track in prejoin page', async () => {
+	it('should allow selecting and replacing the video track with a custom virtual device in the prejoin page', async () => {
 		const script = 'return document.getElementsByTagName("video")[0].srcObject.getVideoTracks()[0].label;';
 
 		await browser.get(`${url}&fakeDevices=true`);
 
 		let videoDevices = await utils.waitForElement('#video-devices-form');
-
 		await videoDevices.click();
-
 		let element = await utils.waitForElement('#option-custom_fake_video_1');
-
 		await element.click();
-
 		let videoLabel;
-
 		await browser.sleep(1000);
 		videoLabel = await browser.executeScript<string>(script);
 		expect(videoLabel).toEqual('custom_fake_video_1');
 
 		await videoDevices.click();
-
 		element = await utils.waitForElement('#option-fake_device_0');
 		await element.click();
-
 		await browser.sleep(1000);
 		videoLabel = await browser.executeScript<string>(script);
 		expect(videoLabel).toEqual('fake_device_0');
 	});
 
-	it('should replace the video track in videoconference page', async () => {
+	it('should allow selecting and replacing the video track with a custom virtual device in the videoconference page', async () => {
 		const script = 'return document.getElementsByTagName("video")[0].srcObject.getVideoTracks()[0].label;';
 
 		await browser.get(`${url}&prejoin=false&fakeDevices=true`);
 
 		await utils.checkSessionIsPresent();
-
-		// Checking if toolbar is present
 		await utils.checkToolbarIsPresent();
-
 		await utils.togglePanel('settings');
-
 		await utils.waitForElement('.settings-container');
 		expect(await utils.isPresent('.settings-container')).toBeTrue();
-
+		await browser.sleep(500);
 		await utils.clickOn('#video-opt');
 		expect(await utils.isPresent('ov-video-devices-select')).toBeTrue();
-
 		let videoDevices = await utils.waitForElement('#video-devices-form');
-
 		await videoDevices.click();
-
 		let element = await utils.waitForElement('#option-custom_fake_video_1');
-
 		await element.click();
-
 		let videoLabel;
 		await browser.sleep(1000);
 		videoLabel = await browser.executeScript<string>(script);
 		expect(videoLabel).toEqual('custom_fake_video_1');
-
 		await videoDevices.click();
-
 		element = await utils.waitForElement('#option-fake_device_0');
 		await element.click();
-
 		await browser.sleep(1000);
 		videoLabel = await browser.executeScript<string>(script);
 		expect(videoLabel).toEqual('fake_device_0');
 	});
 
 	// TODO: Uncommented when Livekit allows to replace the screen track
-	// it('should replace the screen track', async () => {
+	// it('should replace the screen track with a custom virtual device', async () => {
 	// 	const script = 'return document.getElementsByClassName("OV_video-element screen-type")[0].srcObject.getVideoTracks()[0].label;';
 
 	// 	await browser.get(`${url}&prejoin=false&fakeDevices=true`);
@@ -126,15 +108,15 @@ describe('Testing replace track with emulated devices', () => {
 	// });
 });
 
-describe('Testing WITHOUT MEDIA DEVICES permissions', () => {
+describe('Media Devices: UI Behavior Without Media Device Permissions', () => {
 	let browser: WebDriver;
 	let utils: OpenViduComponentsPO;
 	async function createChromeBrowser(): Promise<WebDriver> {
 		return await new Builder()
-			.forBrowser(WebComponentConfig.browserName)
+			.forBrowser(TestAppConfig.browserName)
-			.withCapabilities(WebComponentConfig.browserCapabilities)
+			.withCapabilities(TestAppConfig.browserCapabilities)
 			.setChromeOptions(getBrowserOptionsWithoutDevices())
-			.usingServer(WebComponentConfig.seleniumAddress)
+			.usingServer(TestAppConfig.seleniumAddress)
 			.build();
 	}
 
@@ -144,74 +126,56 @@ describe('Testing WITHOUT MEDIA DEVICES permissions', () => {
 	});
 
 	afterEach(async () => {
+		try {
+			await utils.leaveRoom();
+		} catch (error) {}
 		await browser.quit();
 	});
 
-	it('should be able to ACCESS to PREJOIN page', async () => {
+	it('should disable camera and microphone buttons in the prejoin page when permissions are denied', async () => {
 		await browser.get(`${url}`);
-
 		await utils.checkPrejoinIsPresent();
-
 		let button = await utils.waitForElement('#camera-button');
 		expect(await button.isEnabled()).toBeFalse();
-
 		button = await utils.waitForElement('#microphone-button');
 		expect(await button.isEnabled()).toBeFalse();
 	});
 
-	it('should be able to ACCESS to ROOM page', async () => {
+	it('should disable camera and microphone buttons in the room page when permissions are denied', 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()).toBeFalse();
-
 		button = await utils.waitForElement('#mic-btn');
 		expect(await button.isEnabled()).toBeFalse();
 	});
 
-	it('should be able to ACCESS to ROOM page without prejoin', async () => {
+	it('should disable camera and microphone buttons in the room page without prejoin when permissions are denied', async () => {
 		await browser.get(`${url}&prejoin=false`);
-
 		await utils.checkSessionIsPresent();
-
 		await utils.checkToolbarIsPresent();
-
 		let button = await utils.waitForElement('#camera-btn');
 		expect(await button.isEnabled()).toBeFalse();
-
 		button = await utils.waitForElement('#mic-btn');
 		expect(await button.isEnabled()).toBeFalse();
 	});
 
-	it('should the settings buttons be disabled', async () => {
+	it('should disable camera and microphone device selection buttons in settings when permissions are denied', async () => {
 		await browser.get(`${url}&prejoin=false`);
-
 		await utils.checkToolbarIsPresent();
-
-		// Open more options menu
 		await utils.togglePanel('settings');
 		await browser.sleep(500);
-
 		await utils.waitForElement('.settings-container');
 		expect(await utils.isPresent('.settings-container')).toBeTrue();
-
 		await utils.clickOn('#video-opt');
 		expect(await utils.isPresent('ov-video-devices-select')).toBeTrue();
-
 		let button = await utils.waitForElement('#camera-button');
 		expect(await button.isEnabled()).toBeFalse();
-
 		await utils.clickOn('#audio-opt');
 		expect(await utils.isPresent('ov-audio-devices-select')).toBeTrue();
-
 		button = await utils.waitForElement('#microphone-button');
 		expect(await button.isEnabled()).toBeFalse();
 	});

openvidu-components-angular/package.json

@@ -93,10 +93,10 @@
     "e2e:lib-directives": "tsc --project ./e2e && npx jasmine --fail-fast ./e2e/dist/api-directives.test.js",
     "e2e:lib-chat": "tsc --project ./e2e && npx jasmine --fail-fast  ./e2e/dist/chat.test.js",
     "e2e:lib-events": "tsc --project ./e2e && npx jasmine ./e2e/dist/events.test.js",
+    "e2e:lib-media-devices": "tsc --project ./e2e && npx jasmine --fail-fast  ./e2e/dist/media-devices.test.js",
 
     "e2e:webcomponent-all": "tsc --project ./e2e && npx jasmine --fail-fast  ./e2e/dist/webcomponent-e2e/**/*.test.js",
     "e2e:webcomponent-captions": "tsc --project ./e2e && npx jasmine --fail-fast  ./e2e/dist/webcomponent-e2e/captions.test.js",
-    "e2e:webcomponent-media-devices": "tsc --project ./e2e && npx jasmine --fail-fast  ./e2e/dist/webcomponent-e2e/media-devices.test.js",
     "e2e:webcomponent-panels": "tsc --project ./e2e && npx jasmine --fail-fast  ./e2e/dist/webcomponent-e2e/panels.test.js",
     "e2e:webcomponent-screensharing": "tsc --project ./e2e && npx jasmine --fail-fast  ./e2e/dist/webcomponent-e2e/screensharing.test.js",
     "e2e:webcomponent-stream": "tsc --project ./e2e && npx jasmine --fail-fast  ./e2e/dist/webcomponent-e2e/stream.test.js",