@eeacms/volto-tableau 1.3.0 → 3.0.0

package/.coverage.babel.config.js

@@ -2,7 +2,7 @@ const defaultBabel = require('@plone/volto/babel');
 
 function applyDefault(api) {
   const voltoBabel = defaultBabel(api);
-  voltoBabel.plugins.push('@babel/plugin-transform-modules-commonjs', 'transform-class-properties', 'istanbul');
+  voltoBabel.plugins.push('istanbul');
   return voltoBabel;
 }
 

package/.i18n.babel.config.js

@@ -0,0 +1 @@
+module.exports = require('@plone/volto/babel');

package/.project.eslintrc.js

@@ -0,0 +1,47 @@
+const fs = require('fs');
+const path = require('path');
+
+const projectRootPath = fs.existsSync('./project')
+  ? fs.realpathSync('./project')
+  : fs.realpathSync('./../../../');
+const packageJson = require(path.join(projectRootPath, 'package.json'));
+const jsConfig = require(path.join(projectRootPath, 'jsconfig.json'))
+  .compilerOptions;
+
+const pathsConfig = jsConfig.paths;
+
+let voltoPath = path.join(projectRootPath, 'node_modules/@plone/volto');
+
+Object.keys(pathsConfig).forEach((pkg) => {
+  if (pkg === '@plone/volto') {
+    voltoPath = `./${jsConfig.baseUrl}/${pathsConfig[pkg][0]}`;
+  }
+});
+const AddonConfigurationRegistry = require(`${voltoPath}/addon-registry.js`);
+const reg = new AddonConfigurationRegistry(projectRootPath);
+
+// Extends ESlint configuration for adding the aliases to `src` directories in Volto addons
+const addonAliases = Object.keys(reg.packages).map((o) => [
+  o,
+  reg.packages[o].modulePath,
+]);
+
+module.exports = {
+  extends: `${projectRootPath}/node_modules/@plone/volto/.eslintrc`,
+  settings: {
+    'import/resolver': {
+      alias: {
+        map: [
+          ['@plone/volto', '@plone/volto/src'],
+          ...addonAliases,
+          ['@package', `${__dirname}/src`],
+          ['~', `${__dirname}/src`],
+        ],
+        extensions: ['.js', '.jsx', '.json'],
+      },
+      'babel-plugin-root-import': {
+        rootPathSuffix: 'src',
+      },
+    },
+  },
+};

package/CHANGELOG.md

@@ -4,11 +4,45 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
+### [3.0.0](https://github.com/eea/volto-tableau/compare/2.0.0...3.0.0) - 12 January 2023
+
+#### :hammer_and_wrench: Others
+
+- Remove sources from schema [dana-cfc4 - [`0d2b862`](https://github.com/eea/volto-tableau/commit/0d2b86212b72e06d4ab81804395eda0c2919aeb8)]
+- setup the loader, script loading, data provenance, error catching [andreiggr - [`bc65898`](https://github.com/eea/volto-tableau/commit/bc65898edf878f8d011573f91fb72fb1a956d8e9)]
+- merge with better_tableau_import [andreiggr - [`2d8f314`](https://github.com/eea/volto-tableau/commit/2d8f314a939f1122c0307ccfebf4215bcea2c148)]
+- better loader response [andreiggr - [`d6f3c86`](https://github.com/eea/volto-tableau/commit/d6f3c86cc97475819db71a99108e4da739d66576)]
+- Add ConnectedTableau [dana-cfc4 - [`d83417d`](https://github.com/eea/volto-tableau/commit/d83417d1b9ea454ded0b6f24e581ac2a85c32780)]
+- lint [andreiggr - [`f268b10`](https://github.com/eea/volto-tableau/commit/f268b10710a77cd19d9cc110d60447d495a747ed)]
+- fix crashing sources && better getContent [andreiggr - [`a202967`](https://github.com/eea/volto-tableau/commit/a202967340bcb8e366868193d236d9f49b563bfc)]
+- somewhat better import [andreiggr - [`48219a3`](https://github.com/eea/volto-tableau/commit/48219a368b7165ef9e9df3cf65e643be72f5f8b0)]
+- Fix style lint errors [dana-cfc4 - [`ed1873c`](https://github.com/eea/volto-tableau/commit/ed1873ce27c81e6f2a2459f38bc4cd10d65b559b)]
+- Fix initValue not initialized [dana-cfc4 - [`bbe5802`](https://github.com/eea/volto-tableau/commit/bbe5802c8e2ee794b15570959a00307531b32d96)]
+- Add placeholder in case of errors [dana-cfc4 - [`1af2d0d`](https://github.com/eea/volto-tableau/commit/1af2d0da04635716f4aef320c5f84694a59435e7)]
+- importmap for versions of tableau [Andrei Grigore - [`4e03cb2`](https://github.com/eea/volto-tableau/commit/4e03cb2c3a3bf11d186462067d12c2685b9bf607)]
+- Increase addon version [danac - [`26b58c5`](https://github.com/eea/volto-tableau/commit/26b58c57b6cb4be4eed23fe3343c65250e6d593a)]
+- Add data provenance [danac - [`bd46995`](https://github.com/eea/volto-tableau/commit/bd4699547be72b2d9dad292ee3681b937e741239)]
+- Add eslint config [danac - [`394e5d1`](https://github.com/eea/volto-tableau/commit/394e5d11591610a97cb5b57d882da818b0128b7e)]
+- Fix formatting issues [danac - [`2ef1bae`](https://github.com/eea/volto-tableau/commit/2ef1bae5caf44fb144f8251aed2895df2e03de7d)]
+- Add Embed EEA Tableau block [danac - [`54e45b2`](https://github.com/eea/volto-tableau/commit/54e45b2b0b29d01173315ffe47e74938e43cdf23)]
+## [2.0.0](https://github.com/eea/volto-tableau/compare/1.3.0...2.0.0) - 1 November 2022
+
+#### :bug: Bug Fixes
+
+- fix(cypress): fix silly test [Nilesh - [`d53131a`](https://github.com/eea/volto-tableau/commit/d53131adc4a38252727a6202860e258fbc4d899c)]
+
+#### :hammer_and_wrench: Others
+
+- Update block-basics.cy.js [Nilesh - [`e4f7ca4`](https://github.com/eea/volto-tableau/commit/e4f7ca45969d379fa373bb4b88a1680945b5ca7e)]
+- prepare 2.0 [Nilesh - [`e60db00`](https://github.com/eea/volto-tableau/commit/e60db002471ca193a446edbbfc3d015ad88bbc8c)]
+- Update block-basics.cy.js [Nilesh - [`65b6419`](https://github.com/eea/volto-tableau/commit/65b64190af746d24e87276d397db2ad6473e9883)]
+- Update commands.js [Nilesh - [`7c48437`](https://github.com/eea/volto-tableau/commit/7c4843780efb9b85a4728de73c00d831c1d8fdcf)]
+- Update e2e.js [Nilesh - [`f67b45c`](https://github.com/eea/volto-tableau/commit/f67b45c170f58f8d0301192994226f173e4cb00a)]
+- latest volto compatibility refs #154757 [nileshgulia1 - [`881ba48`](https://github.com/eea/volto-tableau/commit/881ba482dc9b82e7fdac16549d41e80a6d26b3de)]
 ### [1.3.0](https://github.com/eea/volto-tableau/compare/1.2.5...1.3.0) - 28 September 2022
 
 #### :hammer_and_wrench: Others
 
-- refactor script set tableau [andreiggr - [`d78328e`](https://github.com/eea/volto-tableau/commit/d78328e74d67d685390ca0671a44a1bfe9b21e97)]
 - Bump version [Miu Razvan - [`837f8a7`](https://github.com/eea/volto-tableau/commit/837f8a70257660253b70b818977693101d6576e9)]
 - clear lint [andreiggr - [`69d83b8`](https://github.com/eea/volto-tableau/commit/69d83b806aa48a6a696e01b6e026de07e6a34dfe)]
 ### [1.2.5](https://github.com/eea/volto-tableau/compare/1.2.4...1.2.5) - 2 September 2022

package/Jenkinsfile

@@ -4,9 +4,9 @@ pipeline {
   environment {
         GIT_NAME = "volto-tableau"
         NAMESPACE = "@eeacms"
-        SONARQUBE_TAGS = "volto.eea.europa.eu,climate-energy.eea.europa.eu,forest.eea.europa.eu,biodiversity.europa.eu,water.europa.eu-freshwater"
+        SONARQUBE_TAGS = "volto.eea.europa.eu,climate-energy.eea.europa.eu,forest.eea.europa.eu,biodiversity.europa.eu,water.europa.eu-freshwater,water.europa.eu-marine"
         DEPENDENCIES = ""
-        VOLTO = "16.0.0-alpha.14"
+        VOLTO = "alpha"
     }
 
   stages {
@@ -41,19 +41,19 @@ pipeline {
 
           "ES lint": {
             node(label: 'docker') {
-              sh '''docker run -i --rm --name="$BUILD_TAG-eslint" -e NAMESPACE="$NAMESPACE" -e GIT_NAME=$GIT_NAME -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" plone/volto-addon-ci eslint'''
+              sh '''docker run -i --rm --name="$BUILD_TAG-eslint" -e NAMESPACE="$NAMESPACE" -e GIT_NAME=$GIT_NAME -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" -e VOLTO=$VOLTO plone/volto-addon-ci:alpha eslint'''
             }
           },
 
           "Style lint": {
             node(label: 'docker') {
-              sh '''docker run -i --rm --name="$BUILD_TAG-stylelint" -e NAMESPACE="$NAMESPACE" -e GIT_NAME=$GIT_NAME -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" plone/volto-addon-ci stylelint'''
+              sh '''docker run -i --rm --name="$BUILD_TAG-stylelint" -e NAMESPACE="$NAMESPACE" -e GIT_NAME=$GIT_NAME -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" -e VOLTO=$VOLTO plone/volto-addon-ci:alpha stylelint'''
             }
           },
 
           "Prettier": {
             node(label: 'docker') {
-              sh '''docker run -i --rm --name="$BUILD_TAG-prettier" -e NAMESPACE="$NAMESPACE" -e GIT_NAME=$GIT_NAME -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" plone/volto-addon-ci prettier'''
+              sh '''docker run -i --rm --name="$BUILD_TAG-prettier" -e NAMESPACE="$NAMESPACE" -e GIT_NAME=$GIT_NAME -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" -e VOLTO=$VOLTO plone/volto-addon-ci:alpha prettier'''
             }
           }
         )
@@ -77,8 +77,8 @@ pipeline {
             node(label: 'docker') {
               script {
                 try {
-                  sh '''docker pull plone/volto-addon-ci'''
-                  sh '''docker run -i --name="$BUILD_TAG-volto" -e NAMESPACE="$NAMESPACE" -e GIT_NAME=$GIT_NAME -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" plone/volto-addon-ci'''
+                  sh '''docker pull plone/volto-addon-ci:alpha'''
+                  sh '''docker run -i --name="$BUILD_TAG-volto" -e NAMESPACE="$NAMESPACE" -e GIT_NAME=$GIT_NAME -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" -e VOLTO=$VOLTO plone/volto-addon-ci:alpha'''
                   sh '''rm -rf xunit-reports'''
                   sh '''mkdir -p xunit-reports'''
                   sh '''docker cp $BUILD_TAG-volto:/opt/frontend/my-volto-project/coverage xunit-reports/'''
@@ -125,8 +125,8 @@ pipeline {
             node(label: 'docker') {
               script {
                 try {
-                  sh '''docker pull eeacms/plone-backend; docker run -d --rm --name="$BUILD_TAG-plone" -e SITE="Plone" -e PROFILES="eea.kitkat:testing" eeacms/plone-backend'''
-                  sh '''docker pull plone/volto-addon-ci; docker run -i --name="$BUILD_TAG-cypress" --link $BUILD_TAG-plone:plone -e NAMESPACE="$NAMESPACE" -e GIT_NAME=$GIT_NAME -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" -e DEPENDENCIES="$DEPENDENCIES" -e NODE_ENV=development -e VOLTO="$VOLTO" plone/volto-addon-ci cypress'''
+                  sh '''docker pull eeacms/plone-backend; docker run --rm -d --name="$BUILD_TAG-plone" -e SITE="Plone" -e PROFILES="eea.kitkat:testing" eeacms/plone-backend'''
+                  sh '''docker pull plone/volto-addon-ci:alpha; docker run -i --name="$BUILD_TAG-cypress" --link $BUILD_TAG-plone:plone -e NAMESPACE="$NAMESPACE" -e GIT_NAME=$GIT_NAME -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" -e DEPENDENCIES="$DEPENDENCIES" -e NODE_ENV=development -e VOLTO=$VOLTO plone/volto-addon-ci:alpha cypress'''
                 } finally {
                   try {
                     sh '''rm -rf cypress-reports cypress-results cypress-coverage'''
@@ -239,4 +239,4 @@ pipeline {
       }
     }
   }
-}
+}

package/babel.config.js

@@ -0,0 +1,17 @@
+module.exports = function (api) {
+  api.cache(true);
+  const presets = ['razzle'];
+  const plugins = [
+    [
+      'react-intl', // React Intl extractor, required for the whole i18n infrastructure to work
+      {
+        messagesDir: './build/messages/',
+      },
+    ],
+  ];
+
+  return {
+    plugins,
+    presets,
+  };
+};

package/cypress/{integration/block-basics.js → e2e/block-basics.cy.js}

@@ -1,20 +1,17 @@
-import { setupBeforeEach, tearDownAfterEach } from '../support';
+import { slateBeforeEach, slateAfterEach } from '../support/e2e';
 
 describe('Blocks Tests', () => {
-  beforeEach(setupBeforeEach);
-  afterEach(tearDownAfterEach);
+  beforeEach(slateBeforeEach);
+  afterEach(slateAfterEach);
 
   it('Add Block: Empty', () => {
     // Change page title
-    cy.get('.documentFirstHeading > .public-DraftStyleDefault-block')
-      .clear()
-      .type('My Add-on Page')
-      .get('.documentFirstHeading span[data-text]')
-      .contains('My Add-on Page');
+    cy.clearSlateTitle();
+    cy.getSlateTitle().type('My Add-on Page');
 
-    cy.get('.documentFirstHeading > .public-DraftStyleDefault-block').type(
-      '{enter}',
-    );
+    cy.get('.documentFirstHeading').contains('My Add-on Page');
+
+    cy.getSlate().click();
 
     // Add block
     cy.get('.ui.basic.icon.button.block-add-button').first().click();

package/cypress/support/commands.js

@@ -1,5 +1,8 @@
 /* eslint no-console: ["error", { allow: ["log"] }] */
 
+const SLATE_SELECTOR = '.content-area .slate-editor [contenteditable=true]';
+const SLATE_TITLE_SELECTOR = '.block.inner.title [contenteditable="true"]';
+
 // --- AUTOLOGIN -------------------------------------------------------------
 Cypress.Commands.add('autologin', () => {
   let api_url, user, password;
@@ -92,7 +95,7 @@ Cypress.Commands.add(
             title: contentTitle,
             blocks: {
               'd3f1c443-583f-4e8e-a682-3bf25752a300': { '@type': 'title' },
-              '7624cf59-05d0-4055-8f55-5fd6597d84b0': { '@type': 'text' },
+              '7624cf59-05d0-4055-8f55-5fd6597d84b0': { '@type': 'slate' },
             },
             blocks_layout: {
               items: [
@@ -125,6 +128,100 @@ Cypress.Commands.add(
   },
 );
 
+// --- Add DX Content-Type ----------------------------------------------------------
+Cypress.Commands.add('addContentType', (name) => {
+  let api_url, auth;
+  api_url = Cypress.env('API_PATH') || 'http://localhost:8080/Plone';
+  auth = {
+    user: 'admin',
+    pass: 'admin',
+  };
+  return cy
+    .request({
+      method: 'POST',
+      url: `${api_url}/@controlpanels/dexterity-types/${name}`,
+      headers: {
+        Accept: 'application/json',
+      },
+      auth: auth,
+      body: {
+        title: name,
+      },
+    })
+    .then(() => console.log(`${name} content-type added.`));
+});
+
+// --- Remove DX behavior ----------------------------------------------------------
+Cypress.Commands.add('removeContentType', (name) => {
+  let api_url, auth;
+  api_url = Cypress.env('API_PATH') || 'http://localhost:8080/Plone';
+  auth = {
+    user: 'admin',
+    pass: 'admin',
+  };
+  return cy
+    .request({
+      method: 'DELETE',
+      url: `${api_url}/@controlpanels/dexterity-types/${name}`,
+      headers: {
+        Accept: 'application/json',
+      },
+      auth: auth,
+      body: {},
+    })
+    .then(() => console.log(`${name} content-type removed.`));
+});
+
+// --- Add DX field ----------------------------------------------------------
+Cypress.Commands.add('addSlateJSONField', (type, name) => {
+  let api_url, auth;
+  api_url = Cypress.env('API_PATH') || 'http://localhost:8080/Plone';
+  auth = {
+    user: 'admin',
+    pass: 'admin',
+  };
+  return cy
+    .request({
+      method: 'POST',
+      url: `${api_url}/@types/${type}`,
+      headers: {
+        Accept: 'application/json',
+      },
+      auth: auth,
+      body: {
+        id: name,
+        title: name,
+        description: 'Slate JSON Field',
+        factory: 'SlateJSONField',
+        required: false,
+      },
+    })
+    .then(() => console.log(`${name} SlateJSONField field added to ${type}`));
+});
+
+// --- Remove DX field ----------------------------------------------------------
+Cypress.Commands.add('removeSlateJSONField', (type, name) => {
+  let api_url, auth;
+  api_url = Cypress.env('API_PATH') || 'http://localhost:8080/Plone';
+  auth = {
+    user: 'admin',
+    pass: 'admin',
+  };
+  return cy
+    .request({
+      method: 'DELETE',
+      url: `${api_url}/@types/${type}/${name}`,
+      headers: {
+        Accept: 'application/json',
+      },
+      auth: auth,
+      body: {},
+    })
+    .then(() =>
+      console.log(`${name} SlateJSONField field removed from ${type}`),
+    );
+});
+
 // --- REMOVE CONTENT --------------------------------------------------------
 Cypress.Commands.add('removeContent', (path) => {
   let api_url, auth;
@@ -146,6 +243,41 @@ Cypress.Commands.add('removeContent', (path) => {
     .then(() => console.log(`${path} removed`));
 });
 
+Cypress.Commands.add('typeInSlate', { prevSubject: true }, (subject, text) => {
+  return (
+    cy
+      .wrap(subject)
+      .then((subject) => {
+        subject[0].dispatchEvent(
+          new InputEvent('beforeinput', {
+            inputType: 'insertText',
+            data: text,
+          }),
+        );
+        return subject;
+      })
+      // TODO: do this only for Electron-based browser which does not understand instantaneously
+      // that the user inserted some text in the block
+      .wait(1000)
+  );
+});
+
+Cypress.Commands.add('lineBreakInSlate', { prevSubject: true }, (subject) => {
+  return (
+    cy
+      .wrap(subject)
+      .then((subject) => {
+        subject[0].dispatchEvent(
+          new InputEvent('beforeinput', { inputType: 'insertLineBreak' }),
+        );
+        return subject;
+      })
+      // TODO: do this only for Electron-based browser which does not understand instantaneously
+      // that the block was split
+      .wait(1000)
+  );
+});
+
 // --- SET WORKFLOW ----------------------------------------------------------
 Cypress.Commands.add(
   'setWorkflow',
@@ -247,6 +379,83 @@ Cypress.Commands.add(
   },
 );
 
+Cypress.Commands.add('getSlate', ({ createNewSlate = true } = {}) => {
+  let slate;
+  cy.getIfExists(
+    SLATE_SELECTOR,
+    () => {
+      slate = cy.get(SLATE_SELECTOR).last();
+    },
+    () => {
+      if (createNewSlate) {
+        cy.get('.block.inner').last().type('{moveToEnd}{enter}');
+      }
+      slate = cy.get(SLATE_SELECTOR, { timeout: 10000 }).last();
+    },
+  );
+  return slate;
+});
+
+Cypress.Commands.add('clearSlate', (selector) => {
+  return cy
+    .get(selector)
+    .focus()
+    .click()
+    .wait(1000)
+    .type('{selectAll}')
+    .wait(1000)
+    .type('{backspace}');
+});
+
+Cypress.Commands.add('getSlateTitle', () => {
+  return cy.get(SLATE_TITLE_SELECTOR, {
+    timeout: 10000,
+  });
+});
+
+Cypress.Commands.add('clearSlateTitle', () => {
+  return cy.clearSlate(SLATE_TITLE_SELECTOR);
+});
+
+Cypress.Commands.add('setSlateSelection', (subject, query, endQuery) => {
+  cy.get('.slate-editor.selected [contenteditable=true]')
+    .focus()
+    .click()
+    .setSelection(subject, query, endQuery)
+    .wait(1000); // this wait is needed for the selection change to be detected after
+});
+
+Cypress.Commands.add('getSlateEditorAndType', (type) => {
+  cy.getSlate().focus().click().type(type);
+});
+
+Cypress.Commands.add('setSlateCursor', (subject, query, endQuery) => {
+  cy.get('.slate-editor.selected [contenteditable=true]')
+    .focus()
+    .click()
+    .setCursor(subject, query, endQuery)
+    .wait(1000);
+});
+
+Cypress.Commands.add('clickSlateButton', (button) => {
+  cy.get(`.slate-inline-toolbar .button-wrapper a[title="${button}"]`, {
+    timeout: 10000,
+  }).click({ force: true }); //force click is needed to ensure the button in visible in view.
+});
+
+Cypress.Commands.add('toolbarSave', () => {
+  cy.wait(1000);
+
+  // Save
+  cy.get('#toolbar-save').click();
+  cy.waitForResourceToLoad('@navigation');
+  cy.waitForResourceToLoad('@breadcrumbs');
+  cy.waitForResourceToLoad('@actions');
+  cy.waitForResourceToLoad('@types');
+  cy.waitForResourceToLoad('my-page');
+  cy.url().should('eq', Cypress.config().baseUrl + '/cypress/my-page');
+});
+
 // Low level command reused by `setCursorBefore` and `setCursorAfter`, equal to `setCursorAfter`
 Cypress.Commands.add(
   'setCursor',
@@ -313,3 +522,16 @@ Cypress.Commands.add('store', () => {
 Cypress.Commands.add('settings', (key, value) => {
   return cy.window().its('settings');
 });
+
+Cypress.Commands.add(
+  'getIfExists',
+  (selector, successAction = () => {}, failAction = () => {}) => {
+    cy.get('body').then((body) => {
+      if (body.find(selector).length > 0 && successAction) {
+        successAction();
+      } else if (failAction) {
+        failAction();
+      }
+    });
+  },
+);

package/cypress/support/e2e.js

@@ -0,0 +1,125 @@
+// ***********************************************************
+// This example support/index.js is processed and
+// loaded automatically before your test files.
+//
+// This is a great place to put global configuration and
+// behavior that modifies Cypress.
+//
+// You can change the location of this file or turn off
+// automatically serving support files with the
+// 'supportFile' configuration option.
+//
+// You can read more here:
+// https://on.cypress.io/configuration
+// ***********************************************************
+
+// Import commands.js using ES2015 syntax:
+import './commands';
+// Alternatively you can use CommonJS syntax:
+// require('./commands')
+
+//Generate code-coverage
+import '@cypress/code-coverage/support';
+
+export const slateBeforeEach = (contentType = 'Document') => {
+  cy.autologin();
+  cy.createContent({
+    contentType: 'Document',
+    contentId: 'cypress',
+    contentTitle: 'Cypress',
+  });
+  cy.createContent({
+    contentType: contentType,
+    contentId: 'my-page',
+    contentTitle: 'My Page',
+    path: 'cypress',
+  });
+  cy.visit('/cypress/my-page');
+  cy.waitForResourceToLoad('@navigation');
+  cy.waitForResourceToLoad('@breadcrumbs');
+  cy.waitForResourceToLoad('@actions');
+  cy.waitForResourceToLoad('@types');
+  cy.waitForResourceToLoad('my-page');
+  cy.navigate('/cypress/my-page/edit');
+};
+
+export const slateAfterEach = () => {
+  cy.autologin();
+  cy.removeContent('cypress');
+};
+
+export const slateJsonBeforeEach = (contentType = 'slate') => {
+  cy.autologin();
+  cy.addContentType(contentType);
+  cy.addSlateJSONField(contentType, 'slate');
+  slateBeforeEach(contentType);
+};
+
+export const slateJsonAfterEach = (contentType = 'slate') => {
+  cy.autologin();
+  cy.removeContentType(contentType);
+  slateAfterEach();
+};
+
+export const getSelectedSlateEditor = () => {
+  return cy.get('.slate-editor.selected [contenteditable=true]').click();
+};
+
+export const createSlateBlock = () => {
+  cy.get('.ui.basic.icon.button.block-add-button').first().click();
+  cy.get('.blocks-chooser .title').contains('Text').click();
+  cy.get('.ui.basic.icon.button.slate').contains('Text').click();
+  return getSelectedSlateEditor();
+};
+
+export const getSlateBlockValue = (sb) => {
+  return sb.invoke('attr', 'data-slate-value').then((str) => {
+    return typeof str === 'undefined' ? [] : JSON.parse(str);
+  });
+};
+
+export const createSlateBlockWithList = ({
+  numbered,
+  firstItemText,
+  secondItemText,
+}) => {
+  let s1 = createSlateBlock();
+
+  s1.typeInSlate(firstItemText + secondItemText);
+
+  // select all contents of slate block
+  // - this opens hovering toolbar
+  cy.contains(firstItemText + secondItemText).then((el) => {
+    selectSlateNodeOfWord(el);
+  });
+
+  // TODO: do not hardcode these selectors:
+  if (numbered) {
+    // this is the numbered list option in the hovering toolbar
+    cy.get('.slate-inline-toolbar > :nth-child(9)').click();
+  } else {
+    // this is the bulleted list option in the hovering toolbar
+    cy.get('.slate-inline-toolbar > :nth-child(10)').click();
+  }
+
+  // move the text cursor
+  const sse = getSelectedSlateEditor();
+  sse.type('{leftarrow}');
+  for (let i = 0; i < firstItemText.length; ++i) {
+    sse.type('{rightarrow}');
+  }
+
+  // simulate pressing Enter
+  getSelectedSlateEditor().lineBreakInSlate();
+
+  return s1;
+};
+
+export const selectSlateNodeOfWord = (el) => {
+  return cy.window().then((win) => {
+    var event = new CustomEvent('Test_SelectWord', {
+      detail: el[0],
+    });
+    win.document.dispatchEvent(event);
+  });
+};

package/cypress.config.js

@@ -0,0 +1,26 @@
+const { defineConfig } = require('cypress');
+
+module.exports = defineConfig({
+  viewportWidth: 1280,
+  defaultCommandTimeout: 8888,
+  chromeWebSecurity: false,
+  reporter: 'junit',
+  video: true,
+  retries: {
+    runMode: 8,
+    openMode: 0,
+  },
+  reporterOptions: {
+    mochaFile: 'cypress/reports/cypress-[hash].xml',
+    jenkinsMode: true,
+    toConsole: true,
+  },
+  e2e: {
+    setupNodeEvents(on, config) {
+      // e2e testing node events setup code
+      require('@cypress/code-coverage/task')(on, config);
+      return config;
+    },
+    baseUrl: 'http://localhost:3000',
+  },
+});

package/jest-addon.config.js

@@ -11,16 +11,15 @@ module.exports = {
     '@package/(.*)$': '<rootDir>/src/$1',
     '@plone/volto-quanta/(.*)$': '<rootDir>/src/addons/volto-quanta/src/$1',
     '@eeacms/(.*?)/(.*)$': '<rootDir>/src/addons/$1/src/$2',
-    'volto-slate/(.*)$': '<rootDir>/src/addons/volto-slate/src/$1',
+    '@plone/volto-slate':
+      '<rootDir>/node_modules/@plone/volto/packages/volto-slate/src',
     '~/(.*)$': '<rootDir>/src/$1',
     'load-volto-addons':
       '<rootDir>/node_modules/@plone/volto/jest-addons-loader.js',
+    '\\.(css|less|scss|sass)$': 'identity-obj-proxy',
   },
   transform: {
     '^.+\\.js(x)?$': 'babel-jest',
-    '^.+\\.css$': 'jest-css-modules',
-    '^.+\\.less$': 'jest-css-modules',
-    '^.+\\.scss$': 'jest-css-modules',
     '^.+\\.(png)$': 'jest-file',
     '^.+\\.(jpg)$': 'jest-file',
     '^.+\\.(svg)$': './node_modules/@plone/volto/jest-svgsystem-transform.js',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-tableau",
-  "version": "1.3.0",
+  "version": "3.0.0",
   "description": "@eeacms/volto-tableau: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",
@@ -24,7 +24,9 @@
   },
   "devDependencies": {
     "@cypress/code-coverage": "^3.9.5",
-    "babel-plugin-transform-class-properties": "^6.24.1"
+    "@plone/scripts": "*",
+    "babel-plugin-transform-class-properties": "^6.24.1",
+    "md5": "^2.3.0"
   },
   "scripts": {
     "release": "release-it",