ambiser
/
openvidu
mirror of https://github.com/OpenVidu/openvidu.git
8
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

ov-components: add E2E tests for screensharing features

master
Carlos Santos 2025-05-21 12:41:34 +02:00
parent bf7d83134a
commit 52d253a1db
2 changed files with 73 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

138
openvidu-components-angular/e2e/webcomponent-e2e/screensharing.test.ts → openvidu-components-angular/e2e/screensharing.test.ts
View File

@ -1,19 +1,19 @@
import { Builder, WebDriver } from 'selenium-webdriver'; import { Builder, WebDriver } from 'selenium-webdriver';
import { OPENVIDU_CALL_SERVER } from '../config'; import { TestAppConfig } from './selenium.conf';
import { 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 screenshare features', () => { describe('E2E: Screensharing features', () => {
let browser: WebDriver; let browser: WebDriver;
let utils: OpenViduComponentsPO; let utils: OpenViduComponentsPO;
async function createChromeBrowser(): Promise<WebDriver> { async function createChromeBrowser(): Promise<WebDriver> {
return await new Builder() 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(); .build();
} }
@ -23,95 +23,89 @@ describe('Testing screenshare features', () => {
}); });
afterEach(async () => { afterEach(async () => {
try {
await utils.leaveRoom();
} catch (error) {}
await browser.quit(); await browser.quit();
}); });
it('should toggle screensharing twice', async () => { it('should toggle screensharing on and off twice, updating video count', async () => {
await browser.get(`${url}&prejoin=false`); await browser.get(`${url}&prejoin=false`);
await utils.checkLayoutPresent(); await utils.checkLayoutPresent();
// Clicking to screensharing button // Enable screensharing
await utils.waitForElement('#screenshare-btn'); await utils.waitForElement('#screenshare-btn');
await utils.clickOn('#screenshare-btn'); await utils.clickOn('#screenshare-btn');
await browser.sleep(500); await browser.sleep(500);
await utils.waitForElement('.OV_big'); await utils.waitForElement('.OV_big');
expect(await utils.getNumberOfElements('video')).toEqual(2); expect(await utils.getNumberOfElements('video')).toEqual(2);
// expect(await utils.getNumberOfElements('.OV_stream.speaking')).toEqual(1); // Disable screensharing
await utils.disableScreenShare(); await utils.disableScreenShare();
expect(await utils.getNumberOfElements('video')).toEqual(1); expect(await utils.getNumberOfElements('video')).toEqual(1);
// toggle screenshare again // Enable again
await utils.clickOn('#screenshare-btn'); await utils.clickOn('#screenshare-btn');
await browser.sleep(500); await browser.sleep(500);
await utils.waitForElement('.OV_big'); await utils.waitForElement('.OV_big');
expect(await utils.getNumberOfElements('video')).toEqual(2); expect(await utils.getNumberOfElements('video')).toEqual(2);
// Disable again
await utils.disableScreenShare(); await utils.disableScreenShare();
expect(await utils.getNumberOfElements('video')).toEqual(1); expect(await utils.getNumberOfElements('video')).toEqual(1);
}); });
it('should show screen and muted camera', async () => { it('should show screenshare and muted camera (camera off, screenshare on)', async () => {
await browser.get(`${url}&prejoin=false`); await browser.get(`${url}&prejoin=false`);
await utils.checkLayoutPresent(); await utils.checkLayoutPresent();
// Mute camera
await utils.waitForElement('#camera-btn'); await utils.waitForElement('#camera-btn');
await utils.clickOn('#camera-btn'); await utils.clickOn('#camera-btn');
// Clicking to screensharing button // Enable screensharing
const screenshareButton = await utils.waitForElement('#screenshare-btn'); const screenshareButton = await utils.waitForElement('#screenshare-btn');
expect(await screenshareButton.isDisplayed()).toBeTrue(); expect(await screenshareButton.isDisplayed()).toBeTrue();
await screenshareButton.click(); await screenshareButton.click();
await browser.sleep(500); await browser.sleep(500);
await utils.waitForElement('.OV_big'); await utils.waitForElement('.OV_big');
expect(await utils.getNumberOfElements('video')).toEqual(2); expect(await utils.getNumberOfElements('video')).toEqual(2);
// Disable screensharing
await utils.disableScreenShare(); await utils.disableScreenShare();
expect(await utils.getNumberOfElements('video')).toEqual(1); expect(await utils.getNumberOfElements('video')).toEqual(1);
}); });
it('should screensharing with PINNED video', async () => { it('should display screensharing with a single pinned video', async () => {
await browser.get(`${url}&prejoin=false`); await browser.get(`${url}&prejoin=false`);
await utils.checkLayoutPresent(); await utils.checkLayoutPresent();
// Clicking to screensharing button // Enable screensharing
const screenshareButton = await utils.waitForElement('#screenshare-btn'); const screenshareButton = await utils.waitForElement('#screenshare-btn');
expect(await screenshareButton.isDisplayed()).toBeTrue(); expect(await screenshareButton.isDisplayed()).toBeTrue();
await screenshareButton.click(); await screenshareButton.click();
await utils.waitForElement('.OV_big'); await utils.waitForElement('.OV_big');
expect(await utils.getNumberOfElements('.OV_big')).toEqual(1); expect(await utils.getNumberOfElements('.OV_big')).toEqual(1);
}); });
it('should screensharing with PINNED video and replace the existing one', async () => { it('should replace pinned video when a second participant starts screensharing', async () => {
const roomName = 'screensharingE2E'; const roomName = 'screensharingE2E';
const fixedUrl = `${url}&roomName=${roomName}&prejoin=false`; const fixedUrl = `${url}&roomName=${roomName}&prejoin=false`;
await browser.get(fixedUrl); await browser.get(fixedUrl);
await utils.checkLayoutPresent(); await utils.checkLayoutPresent();
// Clicking to screensharing button // First participant screenshares
await utils.waitForElement('#screenshare-btn'); await utils.waitForElement('#screenshare-btn');
await utils.clickOn('#screenshare-btn'); await utils.clickOn('#screenshare-btn');
await utils.waitForElement('.OV_big'); await utils.waitForElement('.OV_big');
expect(await utils.getNumberOfElements('.OV_big')).toEqual(1); expect(await utils.getNumberOfElements('.OV_big')).toEqual(1);
// Starting new browser for adding the second participant // Second participant joins and screenshares
const newTabScript = `window.open("${fixedUrl}")`; const newTabScript = `window.open("${fixedUrl}")`;
await browser.executeScript(newTabScript); await browser.executeScript(newTabScript);
const tabs = await browser.getAllWindowHandles(); const tabs = await browser.getAllWindowHandles();
await browser.switchTo().window(tabs[1]); await browser.switchTo().window(tabs[1]);
await utils.checkLayoutPresent(); await utils.checkLayoutPresent();
// Clicking to screensharing button
await utils.waitForElement('#screenshare-btn'); await utils.waitForElement('#screenshare-btn');
await utils.clickOn('#screenshare-btn'); await utils.clickOn('#screenshare-btn');
await browser.sleep(500); await browser.sleep(500);
@ -119,7 +113,7 @@ describe('Testing screenshare features', () => {
await utils.waitForElement('.OV_big'); await utils.waitForElement('.OV_big');
expect(await utils.getNumberOfElements('.OV_big')).toEqual(1); expect(await utils.getNumberOfElements('.OV_big')).toEqual(1);
// Go to first tab // Switch back to first tab and check
await browser.switchTo().window(tabs[0]); await browser.switchTo().window(tabs[0]);
await browser.sleep(500); await browser.sleep(500);
expect(await utils.getNumberOfElements('video')).toEqual(4); expect(await utils.getNumberOfElements('video')).toEqual(4);
@ -127,39 +121,37 @@ describe('Testing screenshare features', () => {
expect(await utils.getNumberOfElements('.OV_big')).toEqual(1); expect(await utils.getNumberOfElements('.OV_big')).toEqual(1);
}); });
it('should disabled a screensharing and pinned the previous one', async () => { it('should unpin screensharing and restore previous pinned video when disabled', async () => {
const roomName = 'screensharingtwoE2E'; const roomName = 'screensharingtwoE2E';
const fixedUrl = `${url}&roomName=${roomName}&prejoin=false`; const fixedUrl = `${url}&roomName=${roomName}&prejoin=false`;
await browser.get(fixedUrl); await browser.get(fixedUrl);
await utils.checkLayoutPresent(); await utils.checkLayoutPresent();
// Clicking to screensharing button // First participant screenshares
await utils.waitForElement('#screenshare-btn'); await utils.waitForElement('#screenshare-btn');
await utils.clickOn('#screenshare-btn'); await utils.clickOn('#screenshare-btn');
await browser.sleep(500); await browser.sleep(500);
await utils.waitForElement('.OV_big'); await utils.waitForElement('.OV_big');
expect(await utils.getNumberOfElements('.OV_big')).toEqual(1); expect(await utils.getNumberOfElements('.OV_big')).toEqual(1);
// Starting new browser for adding the second participant // Second participant joins and screenshares
const tabs = await utils.openTab(fixedUrl); const tabs = await utils.openTab(fixedUrl);
await browser.switchTo().window(tabs[1]); await browser.switchTo().window(tabs[1]);
await utils.checkLayoutPresent(); await utils.checkLayoutPresent();
// Clicking to screensharing button
await utils.waitForElement('#screenshare-btn'); await utils.waitForElement('#screenshare-btn');
await utils.clickOn('#screenshare-btn'); await utils.clickOn('#screenshare-btn');
await browser.sleep(500); await browser.sleep(500);
expect(await utils.getNumberOfElements('video')).toEqual(4); expect(await utils.getNumberOfElements('video')).toEqual(4);
await utils.waitForElement('.OV_big'); await utils.waitForElement('.OV_big');
expect(await utils.getNumberOfElements('.OV_big')).toEqual(1); expect(await utils.getNumberOfElements('.OV_big')).toEqual(1);
// Disable screensharing
// Disable screensharing for second participant
await utils.disableScreenShare(); await utils.disableScreenShare();
expect(await utils.getNumberOfElements('video')).toEqual(3); expect(await utils.getNumberOfElements('video')).toEqual(3);
await utils.waitForElement('.OV_big'); await utils.waitForElement('.OV_big');
expect(await utils.getNumberOfElements('.OV_big')).toEqual(1); expect(await utils.getNumberOfElements('.OV_big')).toEqual(1);
// Go to first tab // Switch back to first tab and check
await browser.switchTo().window(tabs[0]); await browser.switchTo().window(tabs[0]);
await browser.sleep(500); await browser.sleep(500);
expect(await utils.getNumberOfElements('video')).toEqual(3); expect(await utils.getNumberOfElements('video')).toEqual(3);
@ -167,38 +159,52 @@ describe('Testing screenshare features', () => {
expect(await utils.getNumberOfElements('.OV_big')).toEqual(1); expect(await utils.getNumberOfElements('.OV_big')).toEqual(1);
}); });
// it('should screensharing with audio muted', async () => { it('should correctly share screen with microphone muted and maintain proper track state', async () => {
// let isAudioEnabled; // Helper for inspecting stream tracks
// const getAudioScript = (className: string) => { const getMediaTracks = (className: string) => {
// return `return document.getElementsByClassName('${className}')[0].srcObject.getAudioTracks()[0].enabled;`; return `
// }; const tracks = document.getElementsByClassName('${className}')[0].srcObject.getTracks();
// await browser.get(`${url}&prejoin=false`); return tracks.map(track => ({
kind: track.kind,
enabled: track.enabled,
id: track.id,
label: track.label
}));`;
};
// await utils.checkLayoutPresent(); // Setup: Navigate to room and skip prejoin
await browser.get(`${url}&prejoin=false`);
await utils.checkLayoutPresent();
// const micButton = await utils.waitForElement('#mic-btn'); // Step 1: First mute the microphone
// await micButton.click(); const micButton = await utils.waitForElement('#mic-btn');
await micButton.click();
// // Clicking to screensharing button // Step 2: Start screen sharing
// const screenshareButton = await utils.waitForElement('#screenshare-btn'); await utils.clickOn('#screenshare-btn');
// expect(await utils.isPresent('#screenshare-btn')).toBeTrue();
// await screenshareButton.click();
// await utils.waitForElement('.screen-type'); // Step 3: Verify both streams are present
// expect(await utils.getNumberOfElements('video')).toEqual(2); await utils.waitForElement('.screen-type');
expect(await utils.getNumberOfElements('video')).toEqual(2);
// isAudioEnabled = await browser.executeScript(getAudioScript('screen-type')); // Step 4: Verify screen share track properties
// expect(isAudioEnabled).toBeFalse(); const screenTracks: any[] = await browser.executeScript(getMediaTracks('screen-type'));
expect(screenTracks.length).toEqual(1);
expect(screenTracks[0].kind).toEqual('video');
expect(screenTracks[0].enabled).toBeTrue();
// await utils.waitForElement('#status-mic'); // Step 5: Verify microphone status indicators for both streams
// expect(await utils.getNumberOfElements('#status-mic')).toEqual(2); // await utils.waitForElement('#status-mic');
// const micStatusCount = await utils.getNumberOfElements('#status-mic');
// // Clicking to screensharing button // expect(micStatusCount).toEqual(2);
// await screenshareButton.click();
// expect(await utils.getNumberOfElements('video')).toEqual(1);
// });
// Step 6: Stop screen sharing and verify stream count
await utils.clickOn('#screenshare-btn');
await browser.sleep(500);
await utils.clickOn('#disable-screen-button');
await browser.sleep(500);
expect(await utils.getNumberOfElements('video')).toEqual(1);
});
// it('should show and hide CAMERA stream when muting video with screensharing', async () => { // it('should show and hide CAMERA stream when muting video with screensharing', async () => {
// await browser.get(`${url}&prejoin=false`); // await browser.get(`${url}&prejoin=false`);

2
openvidu-components-angular/package.json
View File

@ -95,10 +95,10 @@
"e2e:lib-events": "tsc --project ./e2e && npx jasmine ./e2e/dist/events.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:lib-media-devices": "tsc --project ./e2e && npx jasmine --fail-fast ./e2e/dist/media-devices.test.js",
"e2e:lib-panels": "tsc --project ./e2e && npx jasmine --fail-fast ./e2e/dist/panels.test.js", "e2e:lib-panels": "tsc --project ./e2e && npx jasmine --fail-fast ./e2e/dist/panels.test.js",
"e2e:lib-screensharing": "tsc --project ./e2e && npx jasmine --fail-fast ./e2e/dist/screensharing.test.js",
"e2e:webcomponent-all": "tsc --project ./e2e && npx jasmine --fail-fast ./e2e/dist/webcomponent-e2e/**/*.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-captions": "tsc --project ./e2e && npx jasmine --fail-fast ./e2e/dist/webcomponent-e2e/captions.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", "e2e:webcomponent-stream": "tsc --project ./e2e && npx jasmine --fail-fast ./e2e/dist/webcomponent-e2e/stream.test.js",
"e2e:webcomponent-toolbar": "tsc --project ./e2e && npx jasmine --fail-fast ./e2e/dist/webcomponent-e2e/toolbar.test.js", "e2e:webcomponent-toolbar": "tsc --project ./e2e && npx jasmine --fail-fast ./e2e/dist/webcomponent-e2e/toolbar.test.js",
"webcomponent:testing-build": "./node_modules/@angular/cli/bin/ng.js build openvidu-webcomponent --configuration testing && node ./openvidu-webcomponent-build.js", "webcomponent:testing-build": "./node_modules/@angular/cli/bin/ng.js build openvidu-webcomponent --configuration testing && node ./openvidu-webcomponent-build.js",