Merge branch 'develop' of https://github.com/eea/volto-slate-footnote …

…into docs

.coverage.babel.config.js

@@ -0,0 +1,9 @@
+const defaultBabel = require('@plone/volto/babel');
+
+function applyDefault(api) {
+  const voltoBabel = defaultBabel(api);
+  voltoBabel.plugins.push('istanbul');
+  return voltoBabel;
+}
+
+module.exports = applyDefault;

.gitignore

@@ -1,15 +1,25 @@
 .vscode/
 .history
+.eslintrc.js
+.nyc_output
+project
+coverage
 logs
 *.log
 npm-debug.log*
 .DS_Store
 *.swp
 yarn-error.log
+yarn.lock
+package-lock.json
 
 node_modules
 build
 dist
+cypress/videos
+cypress/reports
+screenshots
+videos
 .env.local
 .env.development.local
 .env.test.local

.husky/pre-commit

@@ -0,0 +1,2 @@
+[ -n "$CI" ] && exit 0
+yarn lint-staged

.project.eslintrc.js

@@ -0,0 +1,48 @@
+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',
+      },
+    },
+  },
+};
+

.release-it.json

@@ -1,15 +1,17 @@
 {
+  "npm": {
+    "publish": true
+  },
   "git": {
     "changelog": "npx auto-changelog --stdout --commit-limit false -u --template https://raw.githubusercontent.com/release-it/release-it/master/templates/changelog-compact.hbs",
-    "tagName": "v${version}"
+    "tagName": "${version}"
   },
   "github": {
     "release": true,
     "releaseName": "${version}",
     "releaseNotes": "npx auto-changelog --stdout --commit-limit false -u --template https://raw.githubusercontent.com/release-it/release-it/master/templates/changelog-compact.hbs"
   },
   "hooks": {
-    "before:init": "yarn test",
     "after:bump": "npx auto-changelog --commit-limit false -p"
   }
 }

DEVELOP.md

@@ -2,40 +2,42 @@
 
 ## Develop
 
-Before starting make sure your development environment is properly set. See [Volto Developer Documentation](https://docs.voltocms.com/getting-started/install/)
+1. Make sure you have `docker` and `docker compose` installed and running on your machine:
 
-1. Install `mrs.developer`
+    ```Bash
+    git clone https://github.com/eea/volto-slate-footnote.git
+    cd volto-slate-footnote
+    git checkout -b bugfix-123456 develop
+    make
+    make start
+    ```
 
-        $ npm install -g mrs.developer
+1. Wait for `Volto started at 0.0.0.0:3000` meesage
 
-1. Install `@plone/create-volto-app`
+1. Go to http://localhost:3000
 
-        $ npm install -g @plone/create-volto-app
+1. Initialize git hooks
 
-1. Create new volto app
+    ```Bash
+    yarn prepare
+    ```
 
-        $ create-volto-app my-volto-project
-        $ cd my-volto-project
+1. Happy hacking!
 
-1. Update `package.json` with the following information:
+### Or add @eeacms/volto-slate-footnote to your Volto project
 
-        {
-            "scripts": {
-                "develop": "missdev --config=jsconfig.json --output=addons"
-            },
-
-            "addons": [
-                "volto-slate:asDefault",
-                "@eeacms/volto-slate-footnote"
-            ],
-
-            "dependencies": [
-                "@plone/volto": "8.2.0",
-                "volto-slate": "github:eea/volto-slate#0.8.2"
-            ]
-        }
+Before starting make sure your development environment is properly set. See [Volto Developer Documentation](https://docs.voltocms.com/getting-started/install/)
+
+1.  Make sure you have installed `yo`, `@plone/generator-volto` and `mrs-developer`
 
-1. Add the following to `mrs.developer.json`:
+        npm install -g yo @plone/generator-volto mrs-developer
+
+1.  Create new volto app
+
+        yo @plone/volto my-volto-project --addon @eeacms/volto-slate-footnote --skip-install
+        cd my-volto-project
+
+1.  Add the following to `mrs.developer.json`:
 
         {
             "volto-slate-footnote": {
@@ -46,27 +48,59 @@ Before starting make sure your development environment is properly set. See [Vol
             }
         }
 
-1. Install
+1.  Install
 
-        $ yarn develop
-        $ yarn
+        make develop
+        yarn
 
-1. Start backend
+1.  Start backend
 
-        $ docker run -d --name plone -p 8080:8080 -e SITE=Plone -e VERSIONS="plone.restapi=7.0.0a5" -e ADDONS="kitconcept.volto" plone:5
+        docker run --pull always -it --rm --name plone -p 8080:8080 -e SITE=Plone plone/plone-backend
 
     ...wait for backend to setup and start - `Ready to handle requests`:
 
-        $ docker logs -f plone
-
     ...you can also check http://localhost:8080/Plone
 
-1. Start frontend
+1.  Start frontend
 
-        $ yarn start
+        yarn start
 
-1. Go to http://localhost:3000
+1.  Go to http://localhost:3000
 
-1. Happy hacking!
+1.  Happy hacking!
+
+        cd src/addons/volto-slate-footnote/
+
+## Cypress
+
+To run cypress locally, first make sure you don't have any Volto/Plone running on ports `8080` and `3000`.
+
+You don't have to be in a `clean-volto-project`, you can be in any Volto Frontend
+project where you added `volto-slate-footnote` to `mrs.developer.json`
+
+Go to:
+
+  ```BASH
+  cd src/addons/volto-slate-footnote/
+  ```
+
+Start:
+
+  ```Bash
+  make
+  make start
+  ```
+
+This will build and start with Docker a clean `Plone backend` and `Volto Frontend` with `volto-slate-footnote` block installed.
+
+Open Cypress Interface:
+
+  ```Bash
+  make cypress-open
+  ```
+
+Or run it:
 
-        $ cd src/addons/volto-slate-footnote/
+  ```Bash
+  make cypress-run
+  ```

Dockerfile

@@ -0,0 +1,14 @@
+# syntax=docker/dockerfile:1
+ARG VOLTO_VERSION
+FROM plone/frontend-builder:${VOLTO_VERSION}
+
+ARG ADDON_NAME
+ARG ADDON_PATH
+
+COPY --chown=node:node ./ /app/src/addons/${ADDON_PATH}/
+
+RUN /setupAddon
+RUN yarn install
+
+ENTRYPOINT ["yarn"]
+CMD ["start"]