@plone/volto 18.0.0-alpha.4 → 18.0.0-alpha.40

package/cypress/support/commands.js

@@ -1,3 +1,5 @@
+/* eslint-disable no-console */
+import '@testing-library/cypress/add-commands';
 import { getIfExists } from '../helpers';
 import { ploneAuth } from './constants';
 
@@ -20,8 +22,6 @@ const ploneAuthObj = {
   pass: ploneAuth[1],
 };
 
-export * from './volto-slate';
-
 // --- isInViewport ----------------------------------------------------------
 Cypress.Commands.add('isInViewport', (element) => {
   cy.get(element).then(($el) => {
@@ -39,6 +39,30 @@ Cypress.Commands.add('isInViewport', (element) => {
   });
 });
 
+// --- isInHTML ----------------------------------------------------------
+Cypress.Commands.add('isInHTML', ({ parent = 'body', content }) => {
+  cy.url().then((currentUrl) => {
+    // sometimes the cy command is called when the url is still at content/edit
+    // we want to query the html markup of the content, not the edit form
+    const url =
+      currentUrl.indexOf('/edit') !== -1
+        ? currentUrl.split('/edit')[0]
+        : currentUrl;
+    cy.request({
+      method: 'GET',
+      url: url,
+    }).then((response) => {
+      const html = Cypress.$(response.body);
+      if (content.startsWith('.') || content.startsWith('#')) {
+        return expect(html.find(parent)).to.have.descendants(content);
+      } else {
+        // check if parent contains the content text string in its HTML output
+        return expect(html.find(parent)).to.contain(content);
+      }
+    });
+  });
+});
+
 // --- AUTOLOGIN -------------------------------------------------------------
 Cypress.Commands.add('autologin', (usr, pass) => {
   let api_url, user, password;
@@ -678,10 +702,7 @@ Cypress.Commands.add(
   'pasteClipboard',
   { prevSubject: true },
   (query, htmlContent) => {
-    return cy
-      .wrap(query)
-      .type(' {backspace}')
-      .trigger('paste', createHtmlPasteEvent(htmlContent));
+    return cy.wrap(query).trigger('paste', createHtmlPasteEvent(htmlContent));
   },
 );
 
@@ -695,11 +716,10 @@ Cypress.Commands.add('clearSlate', (selector) => {
   return cy
     .get(selector)
     .focus()
-    .click()
-    .wait(1000)
-    .type('{selectAll}')
-    .wait(1000)
-    .type('{backspace}');
+    .click({ force: true })
+    .type('{selectAll}', { delay: 20 })
+    .type('{backspace}', { delay: 20 })
+    .wait(200);
 });
 
 Cypress.Commands.add('getSlate', (createNewSlate = false) => {
@@ -763,6 +783,15 @@ Cypress.Commands.add('typeInSlate', { prevSubject: true }, (subject, text) => {
   );
 });
 
+Cypress.Commands.add(
+  'typeWithDelay',
+  { prevSubject: 'element' },
+  (subject, text, options) => {
+    const delay = options && options.delay ? options.delay : 20;
+    cy.wrap(subject).type(text, { delay });
+  },
+);
+
 Cypress.Commands.add('lineBreakInSlate', { prevSubject: true }, (subject) => {
   return (
     cy
@@ -819,7 +848,6 @@ function getTextNode(el, match) {
     return walk.nextNode();
   }
 
-  const nodes = [];
   let node;
   while ((node = walk.nextNode())) {
     if (node.wholeText.includes(match)) {
@@ -848,12 +876,14 @@ function createHtmlPasteEvent(htmlContent) {
 
 Cypress.Commands.add('addNewBlock', (blockName, createNewSlate = false) => {
   let block;
-  block = cy.getSlate(createNewSlate).type(`/${blockName}{enter}`);
+  block = cy.getSlate(createNewSlate).click().type(`/${blockName}{enter}`);
   return block;
 });
 
 Cypress.Commands.add('navigate', (route = '') => {
-  return cy.window().its('appHistory').invoke('push', route);
+  cy.intercept('GET', '**/*').as('navGetCall');
+  cy.window().its('appHistory').invoke('push', route);
+  cy.wait('@navGetCall');
 });
 
 Cypress.Commands.add('store', () => {
@@ -902,9 +932,33 @@ Cypress.Commands.add('configureListingWith', (contentType) => {
     '.querystring-widget .fields:first-of-type > .field .react-select__menu .react-select__option',
   )
     .contains(contentType)
+
     .click();
 });
 
+Cypress.Commands.add(
+  'addLocationQuerystring',
+  (option = 'Relative path', value) => {
+    cy.get('.block-editor-listing').click();
+    cy.get('.querystring-widget .fields').contains('Add criteria').click();
+    cy.get('.querystring-widget .react-select__menu .react-select__option')
+      .contains('Location')
+      .click();
+
+    cy.get('.querystring-widget .fields').contains('Absolute path').click();
+    cy.get(
+      '.querystring-widget .fields .react-select__menu .react-select__option',
+    )
+      .contains(option)
+      .click();
+    if (value) {
+      cy.get('.querystring-widget .fields .input')
+        .click()
+        .type(`${value}{enter}`);
+    }
+  },
+);
+
 Cypress.Commands.add('queryCounter', (path, steps, number = 1) => {
   cy.intercept(path, cy.spy().as('counterName'));
   steps.forEach((element) => {

package/cypress/support/e2e.js

@@ -5,6 +5,15 @@ import './commands';
 import { setupGuillotina, tearDownGuillotina } from './guillotina';
 import { setup, teardown } from './reset-fixture';
 
+Cypress.on('uncaught:exception', (err) => {
+  // We are getting this error in Cypress tests but we don't use ResizeObserver ourselves
+  if (/ResizeObserver loop/.test(err.message)) {
+    // returning false here prevents Cypress from
+    // failing the test
+    return false;
+  }
+});
+
 before(function () {
   if (Cypress.env('API') === 'guillotina') {
     tearDownGuillotina({ allowFail: true });

package/cypress/support/helpers.js

@@ -0,0 +1 @@
+export * from './volto-slate';

package/cypress/support/volto-slate.js

@@ -75,3 +75,7 @@ export const selectSlateNodeOfWord = (el) => {
     win.document.dispatchEvent(event);
   });
 };
+
+export const getSlateEditorAndType = (selector, type) => {
+  return cy.get(selector).focus().click().wait(1000).type(type).wait(1000);
+};

package/jest-extender-plugin.js

@@ -10,9 +10,15 @@ module.exports = {
     options: { razzleOptions, pluginOptions },
     paths,
   }) {
-    // If the RAZZLE_JEST_CONFIG env var exists, use it as the file with the Jest config
-    // overrides
+    // If the RAZZLE_JEST_CONFIG env var exists,
+    // use it as the file with the Jest config overrides
     if (process.env.RAZZLE_JEST_CONFIG) {
+      if (fs.existsSync(path.resolve(process.env.RAZZLE_JEST_CONFIG))) {
+        const jestConfigPath = path.resolve(process.env.RAZZLE_JEST_CONFIG);
+        const jestConfig = require(jestConfigPath);
+        config = { ...config, ...jestConfig };
+        return config;
+      }
       if (
         fs.existsSync(`${projectRootPath}/${process.env.RAZZLE_JEST_CONFIG}`)
       ) {

package/jest-setup-afterenv.js

@@ -0,0 +1,2 @@
+// Jest-crap setup after env T_T
+import '@testing-library/jest-dom';