Functional tests - add test create and delete link widget

tests/puppeteer/campaigns/data/demo/linkWidgets.js

@@ -0,0 +1,13 @@
+module.exports = {
+  LinkWidgets: {
+    demo_1: {
+      name: 'Footer test block',
+      frName: 'Footer test block',
+      hook: 'displayFooter',
+      contentPages: ['Delivery'],
+      productsPages: ['New products'],
+      staticPages: ['Contact us'],
+      customPages: [{name: 'Home in footer', url: global.FO.URL}],
+    },
+  },
+};

tests/puppeteer/campaigns/functional/BO/design/linkWidget/01_CreateAndCheckFooterLinkWidget.js

@@ -0,0 +1,100 @@
+require('module-alias/register');
+// Using chai
+const {expect} = require('chai');
+const helper = require('@utils/helpers');
+const loginCommon = require('@commonTests/loginBO');
+// Importing pages
+const BOBasePage = require('@pages/BO/BObasePage');
+const LoginPage = require('@pages/BO/login');
+const DashboardPage = require('@pages/BO/dashboard');
+const LinkWidgetsPage = require('@pages/BO/design/linkWidgets');
+const AddLinkWidgetPage = require('@pages/BO/design/linkWidgets/add');
+const FOBasePage = require('@pages/FO/FObasePage');
+const {LinkWidgets} = require('@data/demo/linkWidgets');
+
+let browser;
+let page;
+let numberOfLinkWidgetInFooter = 0;
+
+// Init objects needed
+const init = async function () {
+  return {
+    boBasePage: new BOBasePage(page),
+    loginPage: new LoginPage(page),
+    dashboardPage: new DashboardPage(page),
+    linkWidgetsPage: new LinkWidgetsPage(page),
+    addLinkWidgetPage: new AddLinkWidgetPage(page),
+    foBasePage: new FOBasePage(page),
+  };
+};
+/*
+Create link widget
+Check existence in FO
+Delete link widget created
+ */
+describe('Create footer link widget and check it in FO', async () => {
+  // before and after functions
+  before(async function () {
+    browser = await helper.createBrowser();
+    page = await helper.newTab(browser);
+    this.pageObjects = await init();
+  });
+  after(async () => {
+    await helper.closeBrowser(browser);
+  });
+  // Login into BO
+  loginCommon.loginBO();
+
+  it('should go to link Widget page', async function () {
+    await this.pageObjects.boBasePage.goToSubMenu(
+      this.pageObjects.boBasePage.designParentLink,
+      this.pageObjects.boBasePage.linkWidgetLink,
+    );
+    await this.pageObjects.boBasePage.closeSfToolBar();
+    const pageTitle = await this.pageObjects.linkWidgetsPage.getPageTitle();
+    await expect(pageTitle).to.contains(this.pageObjects.linkWidgetsPage.pageTitle);
+  });
+
+  describe('Create link widget', async () => {
+    it('should go to add new link widget page', async function () {
+      await this.pageObjects.linkWidgetsPage.goToNewLinkWidgetPage();
+      const pageTitle = await this.pageObjects.addLinkWidgetPage.getPageTitle();
+      await expect(pageTitle).to.contains(this.pageObjects.addLinkWidgetPage.pageTitle);
+    });
+
+    it('should create link widget', async function () {
+      const textResult = await this.pageObjects.addLinkWidgetPage.addLinkWidget(LinkWidgets.demo_1);
+      await expect(textResult).to.equal(this.pageObjects.linkWidgetsPage.successfulCreationMessage);
+      numberOfLinkWidgetInFooter = await this.pageObjects.linkWidgetsPage.getNumberOfElementInGrid(35);
+      await expect(numberOfLinkWidgetInFooter).to.be.above(0);
+    });
+  });
+
+  describe('Go to FO and check existence of link Widget created', async () => {
+    it('should go to FO and check link widget in home page footer', async function () {
+      page = await this.pageObjects.linkWidgetsPage.viewMyShop();
+      this.pageObjects = await init();
+      await this.pageObjects.foBasePage.changeLanguage('en');
+      const title = await this.pageObjects.foBasePage.getFooterLinksBlockTitle(numberOfLinkWidgetInFooter);
+      await expect(title).to.contains(LinkWidgets.demo_1.name);
+      const linksTextContent = await this.pageObjects.foBasePage.getFooterLinksTextContent(numberOfLinkWidgetInFooter);
+      await Promise.all([
+        expect(linksTextContent).to.include.members(LinkWidgets.demo_1.contentPages),
+        expect(linksTextContent).to.include.members(LinkWidgets.demo_1.productsPages),
+        expect(linksTextContent).to.include.members(LinkWidgets.demo_1.staticPages),
+        expect(linksTextContent).to.include.members(LinkWidgets.demo_1.customPages.map(el => el.name)),
+      ]);
+      page = await this.pageObjects.foBasePage.closePage(browser, 1);
+      this.pageObjects = await init();
+    });
+  });
+
+  describe('Delete link widget created', async () => {
+    it('should delete link widget created', async function () {
+      const textResult = await this.pageObjects.linkWidgetsPage.deleteLinkWidget(35, numberOfLinkWidgetInFooter);
+      await expect(textResult).to.equal(this.pageObjects.linkWidgetsPage.successfulDeleteMessage);
+      const numberOfLinkWidgetAfterDelete = await this.pageObjects.linkWidgetsPage.getNumberOfElementInGrid(35);
+      await expect(numberOfLinkWidgetAfterDelete).to.equal(numberOfLinkWidgetInFooter - 1);
+    });
+  });
+});

tests/puppeteer/pages/BO/BObasePage.js

@@ -58,6 +58,8 @@ module.exports = class BOBasePage extends CommonPage {
     this.designParentLink = '#subtab-AdminParentThemes';
     // Pages
     this.pagesLink = '#subtab-AdminCmsContent';
+    // Link widget
+    this.linkWidgetLink = '#subtab-AdminLinkWidget';
 
     // International
     this.internationalParentLink = '#subtab-AdminInternational';

tests/puppeteer/pages/BO/design/linkWidgets/add.js

@@ -0,0 +1,189 @@
+require('module-alias/register');
+const BOBasePage = require('@pages/BO/BObasePage');
+
+module.exports = class AddLinkWidget extends BOBasePage {
+  constructor(page) {
+    super(page);
+
+    this.pageTitle = 'Link Widget •';
+
+    // Selectors
+    this.changeNamelangButton = '#form_link_block_block_name';
+    this.changeNameLangSpan = 'div.dropdown-menu span[data-locale=\'%LANG\']';
+    this.nameInput = '#form_link_block_block_name_%ID';
+    this.hookSelect = '#form_link_block_id_hook';
+    this.cmsPagesCheckbox = '#form_link_block_cms_%ID + i';
+    this.cmsPagesCheckbox = '#form_link_block_cms_%ID + i';
+    this.productsPagesCheckbox = '#form_link_block_product_%ID + i';
+    this.staticContentCheckbox = '#form_link_block_static_%ID + i';
+    this.customTitleInput = '#form_link_block_custom_%POSITION_%ID_title';
+    this.customUrlInput = '#form_link_block_custom_%POSITION_%ID_url';
+    this.customBlockForm = '#form_link_block_custom';
+    this.formGroupRowDiv = `${this.customBlockForm} > div.form-group.row:nth-of-type(%ID)`;
+    this.deleteCustomUrlButton = `${this.formGroupRowDiv} button.remove_custom_url`;
+    this.addCustomBlockButton = 'button[data-collection-id=\'form_link_block_custom\']';
+    this.saveButton = '.card-footer button';
+  }
+
+  /* Methods */
+  /**
+   * Change input name language
+   * @param lang
+   * @return {Promise<void>}
+   */
+  async changeLanguage(lang) {
+    await Promise.all([
+      this.page.click(this.changeNamelangButton),
+      this.page.waitForSelector(`${this.changeNamelangButton}[aria-expanded='false']`, {visible: true}),
+    ]);
+    await Promise.all([
+      this.page.click(this.changeNameLangSpan.replace('%LANG', lang)),
+      this.page.waitForSelector(`${this.changeNamelangButton}[aria-expanded='true']`, {visible: true}),
+    ]);
+  }
+
+  /**
+   * Select content pages
+   * @param contentPages
+   * @return {Promise<void>}
+   */
+  async selectContentPages(contentPages) {
+    /* eslint-disable no-restricted-syntax */
+    for (const contentPage of contentPages) {
+      switch (contentPage) {
+        case 'Delivery':
+          await this.page.click(this.cmsPagesCheckbox.replace('%ID', 0));
+          break;
+        case 'Legal Notice':
+          await this.page.click(this.cmsPagesCheckbox.replace('%ID', 1));
+          break;
+        case 'Terms and conditions of use':
+          await this.page.click(this.cmsPagesCheckbox.replace('%ID', 2));
+          break;
+        case 'About us':
+          await this.page.click(this.cmsPagesCheckbox.replace('%ID', 3));
+          break;
+        case 'Secure payment':
+          await this.page.click(this.cmsPagesCheckbox.replace('%ID', 4));
+          break;
+        default:
+          // Do nothing
+      }
+    }
+    /* eslint-enable no-restricted-syntax */
+  }
+
+  /**
+   * Select product pages
+   * @param productPages
+   * @return {Promise<void>}
+   */
+  async selectProductPages(productPages) {
+    /* eslint-disable no-restricted-syntax */
+    for (const productPage of productPages) {
+      switch (productPage) {
+        case 'Prices drop':
+          await this.page.click(this.productsPagesCheckbox.replace('%ID', 0));
+          break;
+        case 'New products':
+          await this.page.click(this.productsPagesCheckbox.replace('%ID', 1));
+          break;
+        case 'Best sales':
+          await this.page.click(this.productsPagesCheckbox.replace('%ID', 2));
+          break;
+        default:
+        // Do nothing
+      }
+    }
+    /* eslint-enable no-restricted-syntax */
+  }
+
+  /**
+   * Select static pages
+   * @param staticPages
+   * @return {Promise<void>}
+   */
+  async selectStaticPages(staticPages) {
+    /* eslint-disable no-restricted-syntax */
+    for (const staticPage of staticPages) {
+      switch (staticPage) {
+        case 'Contact us':
+          await this.page.click(this.staticContentCheckbox.replace('%ID', 0));
+          break;
+        case 'Sitemap':
+          await this.page.click(this.staticContentCheckbox.replace('%ID', 1));
+          break;
+        case 'Stores':
+          await this.page.click(this.staticContentCheckbox.replace('%ID', 2));
+          break;
+        case 'Login':
+          await this.page.click(this.staticContentCheckbox.replace('%ID', 3));
+          break;
+        case 'My account':
+          await this.page.click(this.staticContentCheckbox.replace('%ID', 4));
+          break;
+        default:
+        // Do nothing
+      }
+    }
+    /* eslint-enable no-restricted-syntax */
+  }
+
+  /**
+   * Add custom pages
+   * @param customPages
+   * @return {Promise<void>}
+   */
+  async addCustomPages(customPages) {
+    for (let i = 1; i <= customPages.length; i++) {
+      // Set english title and url
+      await this.changeLanguage('en');
+      await this.setValue(
+        this.customTitleInput.replace('%POSITION', i).replace('%ID', 1),
+        customPages[i - 1].name,
+      );
+      await this.setValue(
+        this.customUrlInput.replace('%POSITION', i).replace('%ID', 1),
+        customPages[i - 1].url,
+      );
+      // Set french title and url
+      await this.changeLanguage('fr');
+      await this.setValue(
+        this.customTitleInput.replace('%POSITION', i).replace('%ID', 2),
+        customPages[i - 1].name,
+      );
+      await this.setValue(
+        this.customUrlInput.replace('%POSITION', i).replace('%ID', 2),
+        customPages[i - 1].url,
+      );
+      // Add another custom page block
+      await this.page.click(this.addCustomBlockButton);
+    }
+  }
+
+  /**
+   * Add linkWidget
+   * @param linkWidgetData
+   * @return {Promise<*|string>}
+   */
+  async addLinkWidget(linkWidgetData) {
+    // Set name in languages
+    await this.changeLanguage('en');
+    await this.setValue(this.nameInput.replace('%ID', 1), linkWidgetData.name);
+    await this.changeLanguage('fr');
+    await this.setValue(this.nameInput.replace('%ID', 2), linkWidgetData.frName);
+    // Choose hook
+    await this.selectByVisibleText(this.hookSelect, linkWidgetData.hook);
+    // select content pages
+    await this.selectContentPages(linkWidgetData.contentPages);
+    // select product pages
+    await this.selectProductPages(linkWidgetData.productsPages);
+    // select static pages
+    await this.selectStaticPages(linkWidgetData.staticPages);
+    // Add custom pages
+    await this.addCustomPages(linkWidgetData.customPages);
+    // Save
+    await this.clickAndWaitForNavigation(this.saveButton);
+    return this.getTextContent(this.alertSuccessBlockParagraph);
+  }
+};

tests/puppeteer/pages/BO/design/linkWidgets/index.js

@@ -0,0 +1,61 @@
+require('module-alias/register');
+const BOBasePage = require('@pages/BO/BObasePage');
+
+module.exports = class LinkWidgets extends BOBasePage {
+  constructor(page) {
+    super(page);
+
+    this.pageTitle = 'Link Widget •';
+
+    // Header Selectors
+    this.newBlockLink = '#page-header-desc-configuration-add';
+    this.gridPanel = '#link_widget_grid_%HOOKID_grid_panel';
+    this.gridheaderTitle = `${this.gridPanel} h3.card-header-title`;
+    this.gridTable = 'table#link_widget_grid_%HOOKID_grid_table';
+    this.tableRow = `${this.gridTable} tbody tr`;
+    this.tableColumn = `${this.tableRow} td.column-%COLUMN`;
+    this.actionsColumn = `${this.tableRow} td.column-actions`;
+    this.dropdownToggleButton = `${this.actionsColumn} a.dropdown-toggle`;
+    this.dropdownToggleMenu = `${this.actionsColumn} div.dropdown-menu`;
+    this.deleteRowLink = `${this.dropdownToggleMenu} a[data-url*='/delete']`;
+  }
+
+  /* Header methods */
+  /**
+   * Go to new Block page
+   * @return {Promise<void>}
+   */
+  async goToNewLinkWidgetPage() {
+    await this.clickAndWaitForNavigation(this.newBlockLink);
+  }
+
+  /* Table methods */
+  /**
+   * Get Number of element in grid
+   * @param hookId, table to get number from
+   * @return {Promise<integer>}
+   */
+  async getNumberOfElementInGrid(hookId) {
+    return this.getNumberFromText(this.gridheaderTitle.replace('%HOOKID', hookId));
+  }
+
+  /**
+   * Delete link widget
+   * @param hookId, table to delete from
+   * @param row, row to delete
+   * @return {Promise<textContent>}
+   */
+  async deleteLinkWidget(hookId, row) {
+    this.dialogListener(true);
+    await Promise.all([
+      this.page.click(this.dropdownToggleButton.replace('%HOOKID', hookId).replace('%ROW', row)),
+      this.page.waitForSelector(
+        `${this.dropdownToggleButton}[aria-expanded='true']`.replace('%HOOKID', hookId).replace('%ROW', row),
+      ),
+    ]);
+    await this.clickAndWaitForNavigation(this.deleteRowLink.replace('%HOOKID', hookId).replace('%ROW', row));
+    await this.page.waitForSelector(this.alertSuccessBlockParagraph, {visible: true});
+    return this.getTextContent(this.alertSuccessBlockParagraph);
+
+  }
+};