New chat tests, improved selectors

bigbluebutton-html5/imports/ui/components/actions-bar/actions-dropdown/component.jsx

@@ -272,6 +272,7 @@ class ActionsDropdown extends PureComponent {
             className={isDropdownOpen ? styles.hideDropdownButton : ''}
             hideLabel
             aria-label={intl.formatMessage(intlMessages.actionsLabel)}
+            data-test="actionsButton"
             label={intl.formatMessage(intlMessages.actionsLabel)}
             icon="plus"
             color="primary"

bigbluebutton-tests/playwright/chat/characterLimit.js

@@ -0,0 +1,28 @@
+const { expect } = require('@playwright/test');
+const Page = require('../core/page');
+const { openChat } = require('./util');
+const e = require('../core/elements');
+
+class CharacterLimit extends Page {
+  constructor(browser, page) {
+    super(browser, page);
+  }
+
+  async test() {
+    await openChat(this.page);
+    const messageLocator = this.page.locator(e.chatUserMessageText);
+
+    await this.type(e.chatBox, e.longMessage5000);
+    await this.waitAndClick(e.sendButton);
+    await this.page.waitForSelector(e.chatUserMessageText);
+    await expect(messageLocator).toHaveCount(1);
+
+    await this.type(e.chatBox, e.longMessage5001);
+    await this.page.waitForSelector(e.typingIndicator);
+    await this.waitAndClick(e.sendButton);
+    await this.page.waitForSelector(e.chatUserMessageText);
+    await expect(messageLocator).toHaveCount(1);
+  }
+}
+
+exports.CharacterLimit = CharacterLimit;

bigbluebutton-tests/playwright/chat/chat.spec.js

@@ -3,6 +3,8 @@ const { Send } = require('./send');
 const { Clear } = require('./clear');
 const { Copy } = require('./copy');
 const { Save } = require('./save');
+const { CharacterLimit } = require('./characterLimit');
+const { EmptyMessage } = require('./emptyMessage');
 
 test.describe.parallel('Chat test suite', () => {
   test('Send public message', async ({ browser, page }) => {
@@ -17,17 +19,30 @@ test.describe.parallel('Chat test suite', () => {
     await clear.test();
   });
 
-  test('Copy chat', async ({ browser, context, page }) => {
-    test.fixme(true, 'Only works in headed mode');
+  test('Copy chat', async ({ browser, context, page }, testInfo) => {
+    test.fixme(testInfo.config.projects[0].use.headless, 'Only works in headed mode');
     const copy = new Copy(browser, page);
     await copy.init(true, true);
     await copy.test(context);
   });
 
-  test('Save chat', async ({ browser, page }) => {
+  test.skip('Save chat', async ({ browser, page }) => {
     test.fixme();
     const save = new Save(browser, page);
     await save.init(true, true);
     await save.test();
   });
+
+  test('Verify character limit (5000 characters)', async ({ browser, page }) => {
+    const characterLimit = new CharacterLimit(browser, page);
+    await characterLimit.init(true, true);
+    await characterLimit.test();
+  });
+
+  test('Not able to send an empty message', async ({ browser, page }) => {
+    const emptyMessage = new EmptyMessage(browser, page);
+    await emptyMessage.init(true, true);
+    await emptyMessage.test();
+  });
 });
+

bigbluebutton-tests/playwright/chat/emptyMessage.js

@@ -0,0 +1,20 @@
+const { expect } = require('@playwright/test');
+const Page = require('../core/page');
+const { openChat } = require('./util');
+const e = require('../core/elements');
+
+class EmptyMessage extends Page {
+  constructor(browser, page) {
+    super(browser, page);
+  }
+
+  async test() {
+    await openChat(this.page);
+    const messageLocator = this.page.locator(e.chatUserMessageText);
+
+    await this.waitAndClick(e.sendButton);
+    await expect(messageLocator).toHaveCount(0);
+  }
+}
+
+exports.EmptyMessage = EmptyMessage;

bigbluebutton-tests/playwright/core/elements.js

@@ -1,5 +1,5 @@
 // Common
-exports.actions = 'button[aria-label="Actions"]';
+exports.actions = 'button[data-test="actionsButton"]';
 exports.pollMenuButton = 'div[data-test="pollMenuButton"]';
 exports.options = 'button[aria-label="Options"]';
 exports.optionsButton = 'button[data-test="optionsButton"]';
@@ -59,6 +59,7 @@ exports.chatCopy = 'li[data-test="chatCopy"]';
 exports.chatTitle = 'div[data-test="chatTitle"]';
 exports.activeChat = 'li[data-test="activeChat"]';
 exports.hidePrivateChat = 'button[aria-label^="Hide Private Chat with"]';
+exports.typingIndicator = 'span[data-test="typingIndicator"]';
 // Messages
 exports.message = 'Hello World!';
 exports.message1 = 'Hello User2';
@@ -66,6 +67,10 @@ exports.message2 = 'Hello User1';
 exports.publicMessage1 = 'This is a Public Message from User1';
 exports.publicMessage2 = 'This is a Public Message from User2';
 
+// Long messages
+exports.longMessage5000 = '01234567890123456789012345678901234567890123456789'.repeat(100);
+exports.longMessage5001 = '01234567890123456789012345678901234567890123456789'.repeat(100) + '0';
+
 exports.chatUserMessageText = 'p[data-test="chatUserMessageText"]';
 exports.chatClearMessageText = 'p[data-test="chatClearMessageText"]';
 

bigbluebutton-tests/playwright/core/page.js

@@ -61,7 +61,7 @@ class Page {
   }
 
   async logoutFromMeeting() {
-    await this.waitAndClick(e.options);
+    await this.waitAndClick(e.optionsButton);
     await this.waitAndClick(e.logout);
   }
 

bigbluebutton-tests/playwright/core/util.js

@@ -8,5 +8,11 @@ function checkElementLengthEqualTo([element, count]) {
   return document.querySelectorAll(element).length == count;
 }
 
+function checkIncludeClass([selector, className]) {
+  return document.querySelectorAll(selector)[0].className.includes(className);
+}
+
 exports.checkElement = checkElement;
 exports.checkElementLengthEqualTo = checkElementLengthEqualTo;
+exports.checkIncludeClass = checkIncludeClass;
+

bigbluebutton-tests/playwright/notifications/util.js

@@ -3,7 +3,7 @@ const { ELEMENT_WAIT_TIME } = require('../core/constants');
 const { checkElementLengthEqualTo } = require('../core/util');
 
 async function popupMenu(test) {
-  await test.waitAndClick(e.options);
+  await test.waitAndClick(e.optionsButton);
   await test.waitAndClick(e.settings);
 }
 

bigbluebutton-tests/playwright/stress/stress.js

@@ -2,7 +2,7 @@ const { expect } = require('@playwright/test');
 const Page = require('../core/page');
 const e = require('../core/elements');
 const c = require('../core/constants');
-const { checkIncludeClass } = require('./util');
+const { checkIncludeClass } = require('../core/util');
 
 class Stress {
   constructor(browser, context, page) {

bigbluebutton-tests/playwright/stress/util.js

@@ -1,5 +0,0 @@
-function checkIncludeClass([selector, className]) {
-  return document.querySelectorAll(selector)[0]?.className.includes(className);
-}
-
-exports.checkIncludeClass = checkIncludeClass;