diff --git a/pages/workspace/plugins-page.js b/pages/workspace/plugins-page.js new file mode 100644 index 00000000..3881545f --- /dev/null +++ b/pages/workspace/plugins-page.js @@ -0,0 +1,86 @@ +const { MainPage } = require('../workspace/main-page'); +const { expect } = require('@playwright/test'); + +const LOREM_IPSUM_PLUGIN_URL = 'https://lorem-ipsum-penpot-plugin.pages.dev/assets/manifest.json'; + +exports.PluginsPage = class PluginsPage extends MainPage { + /** + * @param {import('@playwright/test').Page} page + */ + constructor(page) { + super(page); + + // Main Toolbar + this.pluginsButton = page.getByRole('button', { name: /plugins/i }); + // Main Menu - first level + this.pluginsMainMenuItem = page.getByRole('menuitem').getByText('Plugins'); + // Main Menu - second level + this.pluginsManagerButton = page.getByRole('menuitem').getByText('Plugins Manager');; + this.loremIpsumPluginButton = page.getByRole('menuitem').getByText('Lorem ipsum');; + + // Plugin Manager panel + this.pluginPanel = page.locator('div[class$="workspace_plugins__plugin-management"]'); + this.closePluginPanelButton = page.locator('button[class$="plugins__close-btn"]'); + this.urlPluginPanelInput = page.getByRole('textbox').and(page.getByPlaceholder('Write a plugin URL')); + this.installPluginPanelButton = page.getByRole('button', { name: 'Install' }).first() + this.deletePluginPanelButton = page.locator('button[class$="plugins__trash-button"]').first(); + this.allowPluginPanelButton = page.getByRole('button', { name: 'Allow' }) + this.openPluginPanelButton = page.locator('button', {name: 'Open'}); + this.installedPluginPanelListElements = page.locator('div[class$="workspace_plugins__plugins-list-element"]') + + // Lorem Ipsum panel + this.loremPluginPanel = page.getByTitle('LOREM IPSUM PLUGIN').locator('div').first() + this.loremIpsumPluginGenerateButton = page.frameLocator('[src*="https://lorem-ipsum-penpot-plugin.pages.dev"]').getByRole('button', { name: /Generate/i});; + } + + // POM Methods + async clickPluginsButton() { + await this.pluginsButton.click(); + } + + async clickPluginsMainMenuItem() { + await this.pluginsMainMenuItem.click(); + } + + async clickPluginsManagerButton() { + await this.pluginsManagerButton.click(); + } + + async clickLoremIpsumButton() { + await this.loremIpsumPluginButton.click(); + } + + async setPluginUrl(url) { + await this.urlPluginPanelInput.clear(); + await this.urlPluginPanelInput.fill(url); + } + + async clickOnInstallPluginButton() { + await this.installPluginPanelButton.click(); + } + + async clickOnDeletePluginButton() { + await this.deletePluginPanelButton.click(); + } + + async clickOnAllowPluginButton() { + await this.allowPluginPanelButton.click(); + } + + async clickClosePluginPanelButton() { + await this.closePluginPanelButton.click(); + await expect(this.pluginPanel).not.toBeVisible(); + } + + async checkInstalledPluginsCountIs(count) { + expect(await this.installedPluginPanelListElements.count()).toBe(count); + } + + async setPluginLoremIpsumUrl() { + await this.setPluginUrl(LOREM_IPSUM_PLUGIN_URL); + } + + async checkLoremIpsumPluginIsVisible() { + await (expect(this.loremIpsumPluginGenerateButton).toBeVisible()); + } +}; diff --git a/tests/plugins/plugins.spec.js b/tests/plugins/plugins.spec.js new file mode 100644 index 00000000..497b2d88 --- /dev/null +++ b/tests/plugins/plugins.spec.js @@ -0,0 +1,73 @@ +const { mainTest } = require('../../fixtures'); +const { expect, test } = require('@playwright/test'); +const { random } = require('../../helpers/string-generator'); +const { TeamPage } = require('../../pages/dashboard/team-page'); +const { DashboardPage } = require('../../pages/dashboard/dashboard-page'); +const { PluginsPage } = require('../../pages/workspace/plugins-page'); +const { qase } = require('playwright-qase-reporter/dist/playwright'); +const { updateTestResults } = require('../../helpers/saveTestResults'); + + +const teamName = random().concat('autotest'); + +test.beforeEach(async ({ page }) => { + const teamPage = new TeamPage(page); + const dashboardPage = new DashboardPage(page); + const pluginsPage = new PluginsPage(page); + await teamPage.createTeam(teamName); + await teamPage.isTeamSelected(teamName); + await dashboardPage.createFileViaPlaceholder(); + await pluginsPage.isMainPageLoaded(); +}); + +test.afterEach(async ({ page }, testInfo) => { + const teamPage = new TeamPage(page); + const pluginsPage = new PluginsPage(page); + await pluginsPage.backToDashboardFromFileEditor(); + await teamPage.deleteTeam(teamName); + await updateTestResults(testInfo.status, testInfo.retry) +}); + +mainTest.slow(); + +mainTest(qase([1837,1838,1839,1842,1844], 'Install, open and delete a plugin'), async ({ page }) => { + const pluginsPage = new PluginsPage(page); + + // 1837, Install a plugin by URL (via plugin icon in toolbar) + await pluginsPage.clickPluginsButton(); + await expect(pluginsPage.pluginPanel).toBeVisible(); + + await pluginsPage.setPluginLoremIpsumUrl(); + await pluginsPage.clickOnInstallPluginButton(); + await pluginsPage.clickOnAllowPluginButton(); + await pluginsPage.checkInstalledPluginsCountIs(1); + await expect(pluginsPage.pluginPanel).toHaveScreenshot( + 'plugin-manager-plugin-installed.png' + ); + + // 1838, Close the "Plugins Manager" modal + await pluginsPage.clickOnESC(); + + // 1844, Open a plugin (via Main menu 3 dots > Plugins > plugin name) + await pluginsPage.clickMainMenuButton(); + await pluginsPage.clickPluginsMainMenuItem(); + await pluginsPage.clickLoremIpsumButton(); + await pluginsPage.checkLoremIpsumPluginIsVisible(); + await expect(pluginsPage.loremPluginPanel).toHaveScreenshot( + 'lorem-ipsum-plugin-panel.png' + ); + + // 1839, Delete a plugin from the "Plugins Manager" modal (via delete icon button) + await pluginsPage.clickMainMenuButton(); + await pluginsPage.clickPluginsMainMenuItem(); + await pluginsPage.clickPluginsManagerButton(); + await pluginsPage.clickOnDeletePluginButton(); + await pluginsPage.checkInstalledPluginsCountIs(0); + await expect(pluginsPage.pluginPanel).toHaveScreenshot( + 'plugin-manager-no-plugins-installed.png' + ); + + // 1842, Close the plugin modal (via "X" icon) + await pluginsPage.clickClosePluginPanelButton(); + +}); \ No newline at end of file diff --git a/tests/plugins/plugins.spec.js-snapshots/linux/chrome/lorem-ipsum-plugin-panel.png b/tests/plugins/plugins.spec.js-snapshots/linux/chrome/lorem-ipsum-plugin-panel.png new file mode 100644 index 00000000..404141e8 Binary files /dev/null and b/tests/plugins/plugins.spec.js-snapshots/linux/chrome/lorem-ipsum-plugin-panel.png differ diff --git a/tests/plugins/plugins.spec.js-snapshots/linux/chrome/plugin-manager-no-plugins-installed.png b/tests/plugins/plugins.spec.js-snapshots/linux/chrome/plugin-manager-no-plugins-installed.png new file mode 100644 index 00000000..35f5fdc6 Binary files /dev/null and b/tests/plugins/plugins.spec.js-snapshots/linux/chrome/plugin-manager-no-plugins-installed.png differ diff --git a/tests/plugins/plugins.spec.js-snapshots/linux/chrome/plugin-manager-plugin-installed.png b/tests/plugins/plugins.spec.js-snapshots/linux/chrome/plugin-manager-plugin-installed.png new file mode 100644 index 00000000..6716020c Binary files /dev/null and b/tests/plugins/plugins.spec.js-snapshots/linux/chrome/plugin-manager-plugin-installed.png differ diff --git a/tests/plugins/plugins.spec.js-snapshots/linux/firefox/lorem-ipsum-plugin-panel.png b/tests/plugins/plugins.spec.js-snapshots/linux/firefox/lorem-ipsum-plugin-panel.png new file mode 100644 index 00000000..f5541b4a Binary files /dev/null and b/tests/plugins/plugins.spec.js-snapshots/linux/firefox/lorem-ipsum-plugin-panel.png differ diff --git a/tests/plugins/plugins.spec.js-snapshots/linux/firefox/plugin-manager-no-plugins-installed.png b/tests/plugins/plugins.spec.js-snapshots/linux/firefox/plugin-manager-no-plugins-installed.png new file mode 100644 index 00000000..dafd55c1 Binary files /dev/null and b/tests/plugins/plugins.spec.js-snapshots/linux/firefox/plugin-manager-no-plugins-installed.png differ diff --git a/tests/plugins/plugins.spec.js-snapshots/linux/firefox/plugin-manager-plugin-installed.png b/tests/plugins/plugins.spec.js-snapshots/linux/firefox/plugin-manager-plugin-installed.png new file mode 100644 index 00000000..e9b4e6ef Binary files /dev/null and b/tests/plugins/plugins.spec.js-snapshots/linux/firefox/plugin-manager-plugin-installed.png differ diff --git a/tests/plugins/plugins.spec.js-snapshots/win32/chrome/lorem-ipsum-plugin-panel.png b/tests/plugins/plugins.spec.js-snapshots/win32/chrome/lorem-ipsum-plugin-panel.png new file mode 100644 index 00000000..c06488be Binary files /dev/null and b/tests/plugins/plugins.spec.js-snapshots/win32/chrome/lorem-ipsum-plugin-panel.png differ diff --git a/tests/plugins/plugins.spec.js-snapshots/win32/chrome/plugin-manager-no-plugins-installed.png b/tests/plugins/plugins.spec.js-snapshots/win32/chrome/plugin-manager-no-plugins-installed.png new file mode 100644 index 00000000..f70e5729 Binary files /dev/null and b/tests/plugins/plugins.spec.js-snapshots/win32/chrome/plugin-manager-no-plugins-installed.png differ diff --git a/tests/plugins/plugins.spec.js-snapshots/win32/chrome/plugin-manager-plugin-installed.png b/tests/plugins/plugins.spec.js-snapshots/win32/chrome/plugin-manager-plugin-installed.png new file mode 100644 index 00000000..3ed33568 Binary files /dev/null and b/tests/plugins/plugins.spec.js-snapshots/win32/chrome/plugin-manager-plugin-installed.png differ diff --git a/tests/plugins/plugins.spec.js-snapshots/win32/firefox/lorem-ipsum-plugin-panel.png b/tests/plugins/plugins.spec.js-snapshots/win32/firefox/lorem-ipsum-plugin-panel.png new file mode 100644 index 00000000..b69163ee Binary files /dev/null and b/tests/plugins/plugins.spec.js-snapshots/win32/firefox/lorem-ipsum-plugin-panel.png differ diff --git a/tests/plugins/plugins.spec.js-snapshots/win32/firefox/plugin-manager-no-plugins-installed.png b/tests/plugins/plugins.spec.js-snapshots/win32/firefox/plugin-manager-no-plugins-installed.png new file mode 100644 index 00000000..87d4aa3b Binary files /dev/null and b/tests/plugins/plugins.spec.js-snapshots/win32/firefox/plugin-manager-no-plugins-installed.png differ diff --git a/tests/plugins/plugins.spec.js-snapshots/win32/firefox/plugin-manager-plugin-installed.png b/tests/plugins/plugins.spec.js-snapshots/win32/firefox/plugin-manager-plugin-installed.png new file mode 100644 index 00000000..1d2850c2 Binary files /dev/null and b/tests/plugins/plugins.spec.js-snapshots/win32/firefox/plugin-manager-plugin-installed.png differ