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);
@@ -58,3 +58,9 @@ 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();
+  return lastPost;
+};

e2e/playwright/tests/test.list.ts

@@ -6,4 +6,8 @@ import core from './todo_plugin.spec';
 
 import '../support/init_test';
 
-test.describe(core.connected);
+// Test if plugin is setup correctly
+test.describe("setup", core.setup);
+
+// Test various plugin actions
+test.describe("actions", core.commands);

e2e/playwright/tests/todo_plugin.spec.ts

@@ -8,35 +8,71 @@
 
 import {expect, test} from '@e2e-support/test_fixture';
 import SlashCommandSuggestions from 'support/components/slash_commands';
-import {fillMessage, getTodoBotDMPageURL} from 'support/utils';
+import {fillMessage, getLastPost, getTodoBotDMPageURL, postMessage, } from 'support/utils';
+
+test.beforeEach(async ({ 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'});
+});
 
 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');
-            });
-        });
-    },
+  setup: () => {
+    test('checking available commands', async ({ page }) => {
+      const slash = new SlashCommandSuggestions(page.locator('#suggestionList'));
+
+      // # Run command to trigger todo
+      await fillMessage('/todo', 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');
+    });
+  },
+  commands: () => {
+    test('help', async ({ pages, page, pw }) => {
+      const c = new pages.ChannelsPage(page);
+
+      // # Run command to trigger help
+      postMessage('/todo help', page);
+
+      // # Grab the last post
+      const post = await getLastPost(page);
+      const postBody = post.locator('.post-message__text-container');
+
+      // * Assert /todo add [message] command is visible
+      await expect(postBody).toContainText('add [message]');
+
+      // * Assert /todo list command is visible
+      await expect(postBody).toContainText('list');
+
+      // * Assert /todo list [listName] command is visible
+      await expect(postBody).toContainText('list [listName]');
+
+      // * Assert /todo pop command is visible
+      await expect(postBody).toContainText('pop');
+
+      // * Assert /todo send [user] [message] command is visible
+      await expect(postBody).toContainText('send [user] [message]');
+
+      // * Assert /todo settings summary [on, off] command is visible
+      await expect(postBody).toContainText('settings summary [on, off]');
+
+      // * Assert /todo settings allow_incoming_task_requests [on, off] command is visible
+      await expect(postBody).toContainText(
+        'settings allow_incoming_task_requests [on, off]'
+      );
+
+      // * Assert /todo help command is visible
+      await expect(postBody).toContainText('help');
+    });
+  },
 };