diff --git a/openvidu-components-angular/e2e/angular.test.ts b/openvidu-components-angular/e2e/angular.test.ts index 7eadc60fdd..58f79ad1be 100644 --- a/openvidu-components-angular/e2e/angular.test.ts +++ b/openvidu-components-angular/e2e/angular.test.ts @@ -1100,7 +1100,7 @@ describe('Testing EVENTS', () => { await browser.quit(); }); - it('should receive the onLeaveButtonClicked event', async () => { + it('should receive the onRoomDisconnected event', async () => { await browser.get(`${url}`); await utils.clickOn('#ovToolbar-checkbox'); @@ -1113,11 +1113,11 @@ describe('Testing EVENTS', () => { await utils.clickOn('#leave-btn'); // Checking if onLeaveButtonClicked has been received - await utils.waitForElement('#onLeaveButtonClicked'); - expect(await utils.isPresent('#onLeaveButtonClicked')).to.be.true; + await utils.waitForElement('#onRoomDisconnected'); + expect(await utils.isPresent('#onRoomDisconnected')).to.be.true; }); - it('should receive the onCameraButtonClicked event', async () => { + it('should receive the onVideoEnabledChanged event', async () => { await browser.get(`${url}`); await utils.clickOn('#ovToolbar-checkbox'); @@ -1126,15 +1126,13 @@ describe('Testing EVENTS', () => { await utils.checkToolbarIsPresent(); - // Clicking to leave button await utils.clickOn('#camera-btn'); - // Checking if onLeaveButtonClicked has been received - await utils.waitForElement('#onCameraButtonClicked'); - expect(await utils.isPresent('#onCameraButtonClicked')).to.be.true; + await utils.waitForElement('#onVideoEnabledChanged'); + expect(await utils.isPresent('#onVideoEnabledChanged')).to.be.true; }); - it('should receive the onMicrophoneButtonClicked event', async () => { + it('should receive the onAudioEnabledChanged event', async () => { await browser.get(`${url}`); await utils.clickOn('#ovToolbar-checkbox'); @@ -1143,15 +1141,13 @@ describe('Testing EVENTS', () => { await utils.checkToolbarIsPresent(); - // Clicking to leave button await utils.clickOn('#mic-btn'); - // Checking if onMicrophoneButtonClicked has been received - await utils.waitForElement('#onMicrophoneButtonClicked'); - expect(await utils.isPresent('#onMicrophoneButtonClicked')).to.be.true; + await utils.waitForElement('#onAudioEnabledChanged'); + expect(await utils.isPresent('#onAudioEnabledChanged')).to.be.true; }); - it('should receive the onScreenshareButtonClicked event', async () => { + it('should receive the onScreenShareEnabledChanged event', async () => { await browser.get(`${url}`); await utils.clickOn('#ovToolbar-checkbox'); @@ -1160,15 +1156,13 @@ describe('Testing EVENTS', () => { await utils.checkToolbarIsPresent(); - // Clicking to leave button await utils.clickOn('#screenshare-btn'); - // Checking if onScreenshareButtonClicked has been received - await utils.waitForElement('#onScreenshareButtonClicked'); - expect(await utils.isPresent('#onScreenshareButtonClicked')).to.be.true; + await utils.waitForElement('#onScreenShareEnabledChanged'); + expect(await utils.isPresent('#onScreenShareEnabledChanged')).to.be.true; }); - it('should receive the onFullscreenButtonClicked event', async () => { + it('should receive the onFullscreenEnabledChanged event', async () => { await browser.get(`${url}`); await utils.clickOn('#ovToolbar-checkbox'); @@ -1176,62 +1170,85 @@ describe('Testing EVENTS', () => { await utils.clickOn('#apply-btn'); await utils.checkToolbarIsPresent(); - // Open more options menu - await utils.clickOn('#more-options-btn'); - await browser.sleep(500); + await utils.toggleFullscreenFromToolbar(); - await utils.waitForElement('#more-options-menu'); + await utils.waitForElement('#onFullscreenEnabledChanged'); + expect(await utils.isPresent('#onFullscreenEnabledChanged')).to.be.true; + }); - await utils.clickOn('#fullscreen-btn'); + it('should receive the onRecordingStartRequested event', async () => { + await browser.get(`${url}`); - // Checking if onFullscreenButtonClicked has been received - await utils.waitForElement('#onFullscreenButtonClicked'); - expect(await utils.isPresent('#onFullscreenButtonClicked')).to.be.true; + await utils.clickOn('#ovToolbar-checkbox'); + + await utils.clickOn('#apply-btn'); + + await utils.checkToolbarIsPresent(); + + await utils.toggleRecordingFromToolbar(); + + await utils.waitForElement('#onRecordingStartRequested'); + expect(await utils.isPresent('#onRecordingStartRequested')).to.be.true; }); - it('should receive the onParticipantsPanelButtonClicked event', async () => { + it('should receive the onParticipantsPanelStatusChanged event', async () => { await browser.get(`${url}`); - await utils.clickOn('#ovToolbar-checkbox'); + await utils.clickOn('#ovPanel-checkbox'); await utils.clickOn('#apply-btn'); await utils.checkToolbarIsPresent(); - await utils.clickOn('#participants-panel-btn'); + await utils.togglePanel('participants'); - await utils.waitForElement('#onParticipantsPanelButtonClicked'); - expect(await utils.isPresent('#onParticipantsPanelButtonClicked')).to.be.true; + await utils.waitForElement('#onParticipantsPanelStatusChanged'); + expect(await utils.isPresent('#onParticipantsPanelStatusChanged')).to.be.true; }); - it('should receive the onChatPanelButtonClicked event', async () => { + it('should receive the onChatPanelStatusChanged event', async () => { await browser.get(`${url}`); - await utils.clickOn('#ovToolbar-checkbox'); + await utils.clickOn('#ovPanel-checkbox'); await utils.clickOn('#apply-btn'); await utils.checkToolbarIsPresent(); - await utils.clickOn('#chat-panel-btn'); + await utils.togglePanel('chat'); - await utils.waitForElement('#onChatPanelButtonClicked'); - expect(await utils.isPresent('#onChatPanelButtonClicked')).to.be.true; + await utils.waitForElement('#onChatPanelStatusChanged'); + expect(await utils.isPresent('#onChatPanelStatusChanged')).to.be.true; }); - it('should receive the onActivitiesPanelButtonClicked event', async () => { + it('should receive the onActivitiesPanelStatusChanged event', async () => { await browser.get(`${url}`); - await utils.clickOn('#ovToolbar-checkbox'); + await utils.clickOn('#ovPanel-checkbox'); await utils.clickOn('#apply-btn'); await utils.checkToolbarIsPresent(); - await utils.clickOn('#activities-panel-btn'); + await utils.togglePanel('activities'); + + await utils.waitForElement('#onActivitiesPanelStatusChanged'); + expect(await utils.isPresent('#onActivitiesPanelStatusChanged')).to.be.true; + }); + + it('should receive the onSettingsPanelStatusChanged event', async () => { + await browser.get(`${url}`); + + await utils.clickOn('#ovPanel-checkbox'); + + await utils.clickOn('#apply-btn'); + + await utils.checkToolbarIsPresent(); + + await utils.togglePanel('settings'); - await utils.waitForElement('#onActivitiesPanelButtonClicked'); - expect(await utils.isPresent('#onActivitiesPanelButtonClicked')).to.be.true; + await utils.waitForElement('#onSettingsPanelStatusChanged'); + expect(await utils.isPresent('#onSettingsPanelStatusChanged')).to.be.true; }); }); diff --git a/openvidu-components-angular/package.json b/openvidu-components-angular/package.json index e7ef2d6661..285ef02a49 100644 --- a/openvidu-components-angular/package.json +++ b/openvidu-components-angular/package.json @@ -98,7 +98,7 @@ "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-e2e/**/*.test.js", "webcomponent:e2e-ci": "cross-env LAUNCH_MODE=CI npm run webcomponent:e2e", - "webcomponent:serve-testapp": "npx http-server ./e2e/webcomponent-app/ && echo http://localhost:8080/?OV_URL=https://localhost:4443&OV_SECRET=MY_SECRET&prejoin=false", + "webcomponent:serve-testapp": "npx http-server ./e2e/webcomponent-app/", "simulate:multiparty": "livekit-cli load-test --url ws://localhost:7880 --api-key devkey --api-secret secret --room daily-call --publishers 8 --audio-publishers 8 --identity-prefix Participant --identity publisher" }, "version": "3.0.0-beta3-dev" diff --git a/openvidu-components-angular/src/app/testing-app/testing.component.html b/openvidu-components-angular/src/app/testing-app/testing.component.html index 38ae799c61..622b25e593 100644 --- a/openvidu-components-angular/src/app/testing-app/testing.component.html +++ b/openvidu-components-angular/src/app/testing-app/testing.component.html @@ -78,6 +78,8 @@

id="custom-toolbar" [screenshareButton]="screenshareBtn" [fullscreenButton]="fullscreenBtn" + [backgroundEffectsButton]="backgroundEffectsBtn" + [settingsButton]="settingsBtn" [leaveButton]="leaveBtn" [participantsPanelButton]="participantsPanelBtn" [activitiesPanelButton]="activitiesPanelBtn" @@ -85,14 +87,14 @@

[displayRoomName]="displaySessionId" [displayLogo]="displayLogo" [broadcastingButton]="broadcastingBtn" - (onLeaveButtonClicked)="appendElement('onLeaveButtonClicked')" - (onCameraButtonClicked)="appendElement('onCameraButtonClicked')" - (onMicrophoneButtonClicked)="appendElement('onMicrophoneButtonClicked')" + (onAudioEnabledChanged)="appendElement('onAudioEnabledChanged')" + (onVideoEnabledChanged)="appendElement('onVideoEnabledChanged')" + (onBroadcastingStopRequested)="appendElement('onBroadcastingStopRequested')" + (onFullscreenEnabledChanged)="appendElement('onFullscreenEnabledChanged')" + (onRecordingStartRequested)="appendElement('onRecordingStartRequested')" + (onRecordingStopRequested)="appendElement('onRecordingStopRequested')" + (onRoomDisconnected)="appendElement('onRoomDisconnected')" (onScreenShareEnabledChanged)="appendElement('onScreenShareEnabledChanged')" - (onFullscreenButtonClicked)="appendElement('onFullscreenButtonClicked')" - (onParticipantsPanelButtonClicked)="appendElement('onParticipantsPanelButtonClicked')" - (onChatPanelButtonClicked)="appendElement('onChatPanelButtonClicked')" - (onActivitiesPanelButtonClicked)="appendElement('onActivitiesPanelButtonClicked')" >
@@ -144,7 +146,14 @@

- +

NEW PANEL

@@ -206,6 +215,13 @@

NEW PANEL

*ovActivitiesPanel [recordingActivity]="recordingActivity" [broadcastingActivity]="broadcastingActivity" + (onBroadcastingStartRequested)="appendElement('onBroadcastingStartRequested')" + (onBroadcastingStopRequested)="appendElement('onBroadcastingStopRequested')" + (onRecordingDeleteRequested)="appendElement('onRecordingDeleteRequested')" + (onRecordingDownloadClicked)="appendElement('onRecordingDownloadClicked')" + (onRecordingPlayClicked)="appendElement('onRecordingPlayClicked')" + (onRecordingStartRequested)="appendElement('onRecordingStartRequested')" + (onRecordingStopRequested)="appendElement('onRecordingStopRequested')" id="custom-activities-panel" > diff --git a/openvidu-components-angular/src/app/testing-app/testing.component.scss b/openvidu-components-angular/src/app/testing-app/testing.component.scss index cae0321356..1af18c0924 100644 --- a/openvidu-components-angular/src/app/testing-app/testing.component.scss +++ b/openvidu-components-angular/src/app/testing-app/testing.component.scss @@ -1,6 +1,7 @@ section { display: flex; justify-content: center; + max-height: 300px; } ul { @@ -17,8 +18,9 @@ ul { .directive-container { border: 1px solid; border-top: 0px; - margin: 10px; - padding: 5px; + // margin: 10px; + // padding: 5px; + height: fit-content; } h4 {