From 9a151fb4c2ea3cf178da5676a2859f499a336acc Mon Sep 17 00:00:00 2001
From: Mohamed Amine Ben Salah <damineone@gmail.com>
Date: Tue, 6 Apr 2021 21:09:43 -0300
Subject: [PATCH] Add raise hand test spec to user.test.js suite
---
.../ui/components/actions-bar/component.jsx | 1 +
.../components/status-notifier/component.jsx | 6 +++-
.../tests/puppeteer/user.obj.js | 34 +++++++++++++++++++
.../tests/puppeteer/user/multiusers.js | 27 +++++++++++++++
.../tests/puppeteer/whiteboard/elements.js | 5 +++
5 files changed, 72 insertions(+), 1 deletion(-)
diff --git a/bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx b/bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx
index 9c3598d757..2a753e41e6 100755
--- a/bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx
@@ -89,6 +89,7 @@ class ActionsBar extends PureComponent {
})}
accessKey={shortcuts.raisehand}
color={currentUser.emoji === 'raiseHand' ? 'primary' : 'default'}
+ data-test={currentUser.emoji === 'raiseHand' ? 'lowerHandLabel' : 'raiseHandLabel'}
ghost={currentUser.emoji !== 'raiseHand'}
className={cx(currentUser.emoji === 'raiseHand' || styles.btn)}
hideLabel
diff --git a/bigbluebutton-html5/imports/ui/components/status-notifier/component.jsx b/bigbluebutton-html5/imports/ui/components/status-notifier/component.jsx
index b2e0616252..163eb897b3 100644
--- a/bigbluebutton-html5/imports/ui/components/status-notifier/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/status-notifier/component.jsx
@@ -127,6 +127,7 @@ class StatusNotifier extends Component {
onClick={() => clearUserStatus(u.userId)}
onKeyDown={e => (e.keyCode === ENTER ? clearUserStatus(u.userId) : null)}
key={`statusToastAvatar-${u.userId}`}
+ data-test="avatarsWrapperAvatar"
>
{u.name.slice(0, 2)}
</div>
@@ -156,7 +157,10 @@ class StatusNotifier extends Component {
<Icon iconName="hand" />
</div>
</div>
- <div className={styles.avatarsWrapper}>
+ <div
+ className={styles.avatarsWrapper}
+ data-test="avatarsWrapper"
+ >
{this.raisedHandAvatars()}
</div>
<div className={styles.toastMessage}>
diff --git a/bigbluebutton-html5/tests/puppeteer/user.obj.js b/bigbluebutton-html5/tests/puppeteer/user.obj.js
index ab7b92644d..c4d9aff5c4 100644
--- a/bigbluebutton-html5/tests/puppeteer/user.obj.js
+++ b/bigbluebutton-html5/tests/puppeteer/user.obj.js
@@ -217,5 +217,39 @@ const userTest = () => {
});
}
}, TEST_DURATION_TIME);
+
+ // Raise and Lower Hand and make sure that the User2 Avatar color
+ // and its avatar in raised hand toast are the same
+ test('Raise Hand Toast', async () => {
+ const test = new MultiUsers();
+ let response;
+ let screenshot;
+ try {
+ const testName = 'raiseAndLowerHandToast';
+ await test.page1.logger('begin of ', testName);
+ await test.init(undefined, testName);
+ await test.page1.startRecording(testName);
+ await test.page2.startRecording(testName);
+ const response1 = await test.raiseHandTest();
+ const responseColors = await test.getAvatarColorAndCompareWithUserListItem();
+ const response2 = await test.lowerHandTest();
+ response = response1 && responseColors && response2;
+ await test.page1.stopRecording();
+ await test.page2.stopRecording();
+ screenshot = await test.page1.page.screenshot();
+ await test.page1.logger('end of ', testName);
+ } catch (err) {
+ await test.page1.logger(err);
+ } finally {
+ await test.close(test.page1, test.page2);
+ }
+ expect(response).toBe(true);
+ if (process.env.REGRESSION_TESTING === 'true') {
+ expect(screenshot).toMatchImageSnapshot({
+ failureThreshold: 19.93,
+ failureThresholdType: 'percent',
+ });
+ }
+ });
};
module.exports = exports = userTest;
diff --git a/bigbluebutton-html5/tests/puppeteer/user/multiusers.js b/bigbluebutton-html5/tests/puppeteer/user/multiusers.js
index 692f662db4..d533d3718d 100644
--- a/bigbluebutton-html5/tests/puppeteer/user/multiusers.js
+++ b/bigbluebutton-html5/tests/puppeteer/user/multiusers.js
@@ -166,6 +166,33 @@ class MultiUsers {
return resp;
}
+ // Raise Hand
+ async raiseHandTest() {
+ await this.page1.closeAudioModal();
+ await this.page2.closeAudioModal();
+ await this.page2.waitForSelector(we.raiseHandLabel, ELEMENT_WAIT_TIME);
+ await this.page2.click(we.raiseHandLabel, true);
+ await sleep(2000);
+ const resp = await this.page2.page.evaluate(utilCustomParams.countTestElements, we.lowerHandLabel);
+ return resp;
+ }
+
+ // Lower Hand
+ async lowerHandTest() {
+ await this.page2.waitForSelector(we.lowerHandLabel, ELEMENT_WAIT_TIME);
+ await this.page2.click(we.lowerHandLabel, true);
+ await sleep(2000);
+ const resp = await this.page2.page.evaluate(utilCustomParams.countTestElements, we.raiseHandLabel);
+ return resp;
+ }
+
+ // Get Avatars Colors from Userlist and Notification toast
+ async getAvatarColorAndCompareWithUserListItem() {
+ const avatarInToastElementColor = await this.page1.page.$eval(we.avatarsWrapperAvatar, elem => getComputedStyle(elem).backgroundColor);
+ const avatarInUserListColor = await this.page1.page.$eval('[data-test="userListItem"] > div [data-test="userAvatar"]', elem => getComputedStyle(elem).backgroundColor);
+ return avatarInToastElementColor === avatarInUserListColor;
+ }
+
// Close all Pages
async close(page1, page2) {
await page1.close();
diff --git a/bigbluebutton-html5/tests/puppeteer/whiteboard/elements.js b/bigbluebutton-html5/tests/puppeteer/whiteboard/elements.js
index b44bba0f15..c9fe26b68a 100644
--- a/bigbluebutton-html5/tests/puppeteer/whiteboard/elements.js
+++ b/bigbluebutton-html5/tests/puppeteer/whiteboard/elements.js
@@ -5,3 +5,8 @@ exports.rectangle = 'button[aria-label="Rectangle"]';
exports.drawnRectangle = 'rect[data-test="drawnRectangle"]';
exports.userListItem = 'div[data-test="userListItem"]';
exports.changeWhiteboardAccess = 'li[data-test="changeWhiteboardAccess"]';
+exports.raiseHandLabel = 'button[data-test="raiseHandLabel"]';
+exports.lowerHandLabel = 'button[data-test="lowerHandLabel"]';
+exports.avatarsWrapperAvatar = 'div[data-test="avatarsWrapperAvatar"]';
+exports.firstUserAvatar = '[data-test="userListItemCurrent"] > div [data-test="userAvatar"]';
+exports.secondUserAvatar = '[data-test="userListItem"] > div [data-test="userAvatar"]';
--
GitLab