test(e2e, playwright): added e2e test for /todo help command

e2e/playwright/package.json

@@ -2,6 +2,7 @@
     "name": "plugin-e2e-tests",
     "scripts": {
         "test": "PW_SLOMO=200 npm run test --prefix ../../../mattermost/e2e-tests/playwright -- --project=chrome --config='../../../mattermost-plugin-todo/e2e/playwright/playwright.config.ts'",
+        "test-ui": "PW_SLOMO=200 npm run test --prefix ../../../mattermost/e2e-tests/playwright -- --project=chrome --config='../../../mattermost-plugin-todo/e2e/playwright/playwright.config.ts' --ui",
         "test-ci": "PW_HEADLESS=true npm test",
         "test-slomo": "npm run test-slomo --prefix ../../../mattermost/e2e-tests/playwright -- --project=chrome --config='../../../mattermost-plugin-todo/e2e/playwright/playwright.config.ts",
         "debug": "npm test -- --debug",

e2e/playwright/support/utils.ts

@@ -3,8 +3,8 @@
 
 import type {Page} from '@playwright/test';
 
-import {UserProfile} from '@mattermost/types/users';
 import Client4 from '@mattermost/client/client4';
+import {UserProfile} from '@mattermost/types/users';
 
 export const waitForNewMessages = async (page: Page) => {
     await page.waitForTimeout(1000);
@@ -14,13 +14,14 @@ export const waitForNewMessages = async (page: Page) => {
     // await page.locator('#postListContent').getByTestId('NotificationSeparator').getByText('New Messages').waitFor();
 };
 
-export const getTodoBotDMPageURL = async (client: Client4, teamName: string, userId: string) => {
-    let team = teamName;
-    if (team === '') {
-        const teams = await client.getTeamsForUser(userId);
-        team = teams[0].name;
-    }
-    return `${team}/messages/@todo`;
+export const getTeamName = async (client: Client4, userId: string) => {
+    const teams = await client.getTeamsForUser(userId);
+    const team = teams[0].name;
+    return team;
+};
+
+export const getBotDMPageURL = async (teamName: string, botUsername: string) => {
+    return `${teamName}/messages/${botUsername}`;
 };
 
 export const fillTextField = async (name: string, value: string, page: Page) => {
@@ -32,7 +33,7 @@ export const submitDialog = async (page: Page) => {
 };
 
 export const fillMessage = async (message: string, page: Page) => {
-    await fillTextField('post_textbox', message, page )
+    await fillTextField('post_textbox', message, page)
 };
 
 export const postMessage = async (message: string, page: Page) => {
@@ -58,3 +59,10 @@ export const getSlackAttachmentLocatorId = (postId: string) => {
 export const getPostMessageLocatorId = (postId: string) => {
     return `#post_${postId} .post-message`;
 };
+
+export const getLastPost = async (page: Page) => {
+    const lastPost = page.getByTestId("postView").last();
+    await lastPost.waitFor();
+    const postBody = lastPost.locator('.post-message__text-container');
+    return postBody;
+};

e2e/playwright/tests/test.list.ts

@@ -2,8 +2,12 @@
 // See LICENSE.txt for license information.
 
 import {test} from '@playwright/test';
-import core from './todo_plugin.spec';
+import commands from './todo_plugin.spec';
 
 import '../support/init_test';
 
-test.describe(core.connected);
+// Test if plugin shows the correct suggestions
+test.describe("testing todo command", commands.todo);
+
+// Test if plugin actions work correctly
+test.describe("testing help command", commands.help);

e2e/playwright/tests/todo_plugin.spec.ts

@@ -8,35 +8,70 @@
 
 import {expect, test} from '@e2e-support/test_fixture';
 import SlashCommandSuggestions from 'support/components/slash_commands';
-import {fillMessage, getTodoBotDMPageURL} from 'support/utils';
+import {fillMessage, getBotDMPageURL, getLastPost, getTeamName, postMessage, } from 'support/utils';
+
+const botUserName = 'todo';
+let teamName = '';
+
+test.beforeAll(async ({pw}) => {
+  const {adminClient, adminUser} = await pw.getAdminClient();
+  if (adminUser === null) {
+    throw new Error('can not get adminUser');
+  }
+  if (teamName === '') {
+    teamName = await getTeamName(adminClient, adminUser.id)
+  }
+});
+
+test.beforeEach(async ({page}) => {
+  const dmURL = await getBotDMPageURL(teamName, botUserName);
+  await page.goto(dmURL, {waitUntil: 'load'});
+});
 
 export default {
-    connected: () => {
-        test.describe('available commands', () => {
-            test('with just the main command', async ({pages, page, pw}) => {
-
-            const {adminClient, adminUser} = await pw.getAdminClient();
-            if (adminUser === null) {
-                throw new Error('can not get adminUser');
-            }
-            const dmURL = await getTodoBotDMPageURL(adminClient, '', adminUser.id);
-            await page.goto(dmURL, {waitUntil: 'load'});
-
-            const c = new pages.ChannelsPage(page);
-            const slash = new SlashCommandSuggestions(page.locator('#suggestionList'));
-
-            // # Run incomplete command to trigger help
-            await fillMessage('/todo', page);
-
-            // * Assert suggestions are visible
-            await expect(slash.container).toBeVisible();
-
-            // * Assert help is visible
-            await expect(slash.getItemTitleNth(0)).toHaveText('todo [command]');
-
-            await expect(slash.getItemDescNth(0)).toHaveText('Available commands: list, add, pop, send, settings, help');
-            });
-        });
-    },
+  todo: () => {
+    const command = "/todo";
+
+    test(`${command}`, async ({page}) => {
+      const slash = new SlashCommandSuggestions(page.locator('#suggestionList'));
+
+      // # Type command to show suggestions
+      await fillMessage(command, page);
+
+      // * Assert suggestions are visible
+      await expect(slash.container).toBeVisible();
+
+      // * Assert todo [command] is visible
+      await expect(slash.getItemTitleNth(0)).toHaveText('todo [command]');
+
+      await expect(slash.getItemDescNth(0)).toHaveText('Available commands: list, add, pop, send, settings, help');
+    });
+  },
+
+  help: () => {
+    const command = "/todo help";
+
+    test(`${command}`, async ({pages, page, pw}) => {
+      const c = new pages.ChannelsPage(page);
+
+      // # Run command to trigger help
+      postMessage(command, page);
+
+      // # Grab the last post
+      const lastPost = await getLastPost(page);
+
+      // * Assert all commands are shown in the help text output
+      await expect(lastPost).toContainText('add [message]');
+      await expect(lastPost).toContainText('list');
+      await expect(lastPost).toContainText('list [listName]');
+      await expect(lastPost).toContainText('pop');
+      await expect(lastPost).toContainText('send [user] [message]');
+      await expect(lastPost).toContainText('settings summary [on, off]');
+      await expect(lastPost).toContainText(
+        'settings allow_incoming_task_requests [on, off]'
+      );
+      await expect(lastPost).toContainText('help');
+    });
+  }
 };