diff --git a/e2e/playwright/package.json b/e2e/playwright/package.json index 2d12840..6be5a89 100644 --- a/e2e/playwright/package.json +++ b/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", diff --git a/e2e/playwright/support/utils.ts b/e2e/playwright/support/utils.ts index b13ce15..0322901 100644 --- a/e2e/playwright/support/utils.ts +++ b/e2e/playwright/support/utils.ts @@ -2,7 +2,6 @@ // See LICENSE.txt for license information. import type {Page} from '@playwright/test'; - import {UserProfile} from '@mattermost/types/users'; import Client4 from '@mattermost/client/client4'; @@ -14,13 +13,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 +32,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 +58,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; +}; diff --git a/e2e/playwright/tests/test.list.ts b/e2e/playwright/tests/test.list.ts index 66a82a1..d88a0f8 100644 --- a/e2e/playwright/tests/test.list.ts +++ b/e2e/playwright/tests/test.list.ts @@ -1,8 +1,19 @@ // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. // See LICENSE.txt for license information. -import core from './todo_plugin.spec'; +import {test} from "@e2e-support/test_fixture"; +import commands from "./todo_plugin.spec"; -import '../support/init_test'; +import "../support/init_test"; -core.connected(); +// Test if plugin shows the correct suggestions for command autocomplete +test.describe("command autocomplete", commands.autocomplete); + +// Test `/todo add` commands +test.describe("commands/add", commands.add); + +// Test `/todo list` commands +test.describe("commands/list", commands.list); + +// Test `/todo help` commands +test.describe("commands/help", commands.help); diff --git a/e2e/playwright/tests/todo_plugin.spec.ts b/e2e/playwright/tests/todo_plugin.spec.ts index eb8c08e..5036dd2 100644 --- a/e2e/playwright/tests/todo_plugin.spec.ts +++ b/e2e/playwright/tests/todo_plugin.spec.ts @@ -6,35 +6,114 @@ // - [*] indicates an assertion (e.g. * Check the title) // *************************************************************** -import {expect, test} from '@e2e-support/test_fixture'; -import SlashCommandSuggestions from 'support/components/slash_commands'; -import {fillMessage, getTodoBotDMPageURL} from 'support/utils'; +import {expect, test} from "@e2e-support/test_fixture"; +import SlashCommandSuggestions from "support/components/slash_commands"; +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 ({page, pw}) => { + autocomplete: () => { + test('/todo', async ({ page }) => { + const slash = new SlashCommandSuggestions( + page.locator("#suggestionList") + ); + + // # Type command to show suggestions + 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)).toContainText( + "Available commands:" + ); + }); + }, + + help: () => { + test('/todo help', async ({ page }) => { + // # Run command to trigger help + await postMessage('/todo help', page); + + // # Get ephemeral post response from todo help command + const lastPost = await getLastPost(page); + + // * Assert "help" is in the post body + await expect(lastPost).toContainText("help"); + + // * Assert if length of content shown is greater than 10 lines + const postBody = await lastPost.textContent(); + const postBodyLines = postBody ? postBody.split('\n') : []; + expect(postBodyLines.length).toBeGreaterThanOrEqual(10); + }); + }, + + add: () => { + test("/todo add ", async ({ page }) => { + const todoMessage = "Don't forget to be awesome"; + + // # Run command to add todo + await postMessage(`/todo add ${todoMessage}`, page); + + // # Get ephemeral post response from todo add command + const post = await getLastPost(page); + + await expect(post).toBeVisible(); + + await expect(post).toContainText("Added Todo. Todo List:"); + await expect(post).toContainText(todoMessage); + + // * Assert added todo is visible + await expect(post).toContainText(todoMessage); + }); + }, + + list: () => { + test("/todo list", async ({ page }) => { + const todoMessage = "Don't forget to be awesome"; - 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'}); + // # Run command to add todo + await postMessage(`/todo add ${todoMessage}`, page); - const slash = new SlashCommandSuggestions(page.locator('#suggestionList')); + // # Type command to list todo + await postMessage('/todo list', page); - // # Run incomplete command to trigger help - await fillMessage('/todo', page); + // # Get ephemeral post response from todo list command + const post = await getLastPost(page); - // * Assert suggestions are visible - await expect(slash.container).toBeVisible(); + await expect(post).toBeVisible(); - // * Assert help is visible - await expect(slash.getItemTitleNth(0)).toHaveText('todo [command]'); + await expect(post).toContainText("Todo List:"); + await expect(post).toContainText(todoMessage); - await expect(slash.getItemDescNth(0)).toHaveText('Available commands: list, add, pop, send, settings, help'); - }); - }); - }, + // * Assert added todo is visible + await expect(post).toContainText(todoMessage); + }); + }, };