test: Add Cypress tests

eea · Jul 25, 2023 · 5c680b9 · 5c680b9
1 parent db39fec
commit 5c680b9
Showing 1 changed file with 100 additions and 0 deletions.
diff --git a/cypress/e2e/01-anchors-basics.cy.js b/cypress/e2e/01-anchors-basics.cy.js
@@ -65,4 +65,104 @@ describe('Block Tests: Anchors', () => {
     cy.get('h2[id="title-1"]').contains('Title 1');
     cy.get('h2[id="title-2"]').contains('Title 2');
   });
+
+  it('Add Block: add horizontal TOC', () => {
+    // Change page title
+    cy.clearSlateTitle();
+    cy.getSlateTitle().type('Volto Anchors');
+    cy.getSlate().click();
+
+    // Add TOC block
+    cy.get('.ui.basic.icon.button.block-add-button').first().click();
+    cy.get(".blocks-chooser .ui.form .field.searchbox input[type='text']").type(
+      'table of contents',
+    );
+    cy.get('.button.toc').click();
+    cy.get('#sidebar-properties .form .react-select-container').first().click();
+    cy.contains('Horizontal Menu').click();
+
+    // Add headings
+    cy.get('.ui.drag.block.inner.slate')
+      .click()
+      .type('Lorem ipsum dolor sit amet')
+      .click();
+    cy.get('.ui.drag.block.inner.slate span span span').setSelection(
+      'Lorem ipsum dolor sit amet',
+    );
+    cy.get('.slate-inline-toolbar .button-wrapper a[title="Title"]').click({
+      force: true,
+    });
+    cy.get('.ui.drag.block.inner.slate').click().type('{enter}');
+
+    cy.get('.ui.drag.block.inner.slate')
+      .eq(1)
+      .click()
+      .type('Lorem ipsum dolor sit amet')
+      .click();
+    cy.get('.ui.drag.block.inner.slate span span span')
+      .eq(1)
+      .setSelection('Lorem ipsum dolor sit amet');
+    cy.get('.slate-inline-toolbar .button-wrapper a[title="Title"]').click({
+      force: true,
+    });
+    cy.get('.ui.drag.block.inner.slate').eq(1).click().type('{enter}');
+
+    cy.get('.ui.drag.block.inner.slate')
+      .eq(2)
+      .click()
+      .type('Lorem ipsum dolor sit amet')
+      .click();
+    cy.get('.ui.drag.block.inner.slate span span span')
+      .eq(2)
+      .setSelection('Lorem ipsum dolor sit amet');
+    cy.get('.slate-inline-toolbar .button-wrapper a[title="Title"]').click({
+      force: true,
+    });
+    cy.get('.ui.drag.block.inner.slate').eq(2).click().type('{enter}');
+
+    cy.get('.ui.drag.block.inner.slate')
+      .eq(3)
+      .click()
+      .type('Lorem ipsum dolor sit amet')
+      .click();
+    cy.get('.ui.drag.block.inner.slate span span span')
+      .eq(3)
+      .setSelection('Lorem ipsum dolor sit amet');
+    cy.get('.slate-inline-toolbar .button-wrapper a[title="Title"]').click({
+      force: true,
+    });
+    cy.get('.ui.drag.block.inner.slate').eq(3).click().type('{enter}');
+
+    cy.get('.ui.drag.block.inner.slate')
+      .eq(4)
+      .click()
+      .type('Lorem ipsum dolor sit amet')
+      .click();
+    cy.get('.ui.drag.block.inner.slate span span span')
+      .eq(4)
+      .setSelection('Lorem ipsum dolor sit amet');
+    cy.get('.slate-inline-toolbar .button-wrapper a[title="Title"]').click({
+      force: true,
+    });
+    cy.get('.ui.drag.block.inner.slate').eq(4).click().type('{enter}');
+
+    // Save page
+    cy.get('#toolbar-save').click();
+    cy.url().should('eq', Cypress.config().baseUrl + '/cypress/my-page');
+
+    // Check if the page contains the TOC and the dropdown button
+    cy.contains('Volto Anchors');
+    cy.get('.table-of-contents  .dropdown').contains('More').click();
+
+    // Ensure that the dropdown menu is visible
+    cy.get('.menu.transition').should('be.visible');
+    cy.get('body').type('{downArrow}');
+
+    // Verify that the item from the dropdown menu is focused
+    cy.get('.item.focused').should('have.text', 'Lorem ipsum dolor sit amet');
+
+    // Press the "Enter" key adn verify that the dropdown is closed
+    cy.get('body').type('{enter}');
+    cy.get('.menu.transition').should('not.be.visible');
+  });
 });