Added compatibility with the Volto 17 Image component (#28)

* Added compatibility with the Volto 17 Image component

* Changelog

* Fix build

* Mention in the notes

* More fixes to acceptance

* Fix width of slider when changing the route to edit.

.eslintignore

@@ -1,3 +1,4 @@
 cypress
 node_modules
 acceptance
+**/*.json

.github/workflows/acceptance.yml

@@ -4,7 +4,7 @@ on: [push]
 env:
   ADDON_NAME: "@kitconcept/volto-slider-block"
   ADDON_PATH: "volto-slider-block"
-  VOLTO_VERSION: "16"
+  VOLTO_VERSION: "17.0.0-alpha.27"
 
 jobs:
 
@@ -23,7 +23,7 @@ jobs:
           yarn
 
       - name: "Cypress: Acceptance tests"
-        uses: cypress-io/github-action@v5
+        uses: cypress-io/github-action@v6
         env:
           BABEL_ENV: production
           CYPRESS_RETRIES: 2

.github/workflows/changelog.yml

@@ -3,7 +3,7 @@ on:
   pull_request:
     types: [assigned, opened, synchronize, reopened, labeled, unlabeled]
     branches:
-      - master
+      - main
 
 env:
   node-version: 16.x
@@ -36,8 +36,8 @@ jobs:
           # Fetch the pull request' base branch so towncrier will be able to
           # compare the current branch with the base branch.
           # Source: https://github.com/actions/checkout/#fetch-all-branches.
-          git fetch --no-tags origin master
-          towncrier check --compare-with origin/master
+          git fetch --no-tags origin main
+          towncrier check --compare-with origin/main
         env:
           BASE_BRANCH: ${{ github.base_ref }}
         if: github.event_name == 'pull_request'

.github/workflows/code.yml

@@ -5,8 +5,7 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node-version: [16.x]
-        python-version: [3.8]
+        node-version: [18.x]
 
     steps:
       - name: Main checkout

.github/workflows/unit.yml

@@ -5,8 +5,7 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node-version: [16.x]
-        python-version: [3.8]
+        node-version: [18.x]
 
     steps:
       - name: Main checkout

Makefile

@@ -22,10 +22,10 @@ RESET=`tput sgr0`
 YELLOW=`tput setaf 3`
 
 PLONE_VERSION=6
-VOLTO_VERSION=16.20.3
+VOLTO_VERSION=17.0.0-alpha.27
 
-ADDON_NAME='@kitconcept/volto-light-theme'
-ADDON_PATH='volto-light-theme'
+ADDON_NAME='@kitconcept/volto-slider-block'
+ADDON_PATH='volto-slider-block'
 COMPOSE_FILE=dockerfiles/docker-compose.yml
 ACCEPTANCE_COMPOSE=acceptance/docker-compose.yml
 CMD=CURRENT_DIR=${CURRENT_DIR} ADDON_NAME=${ADDON_NAME} ADDON_PATH=${ADDON_PATH} VOLTO_VERSION=${VOLTO_VERSION} PLONE_VERSION=${PLONE_VERSION} docker compose
@@ -76,6 +76,12 @@ dev: ## Develop the addon
 help:		## Show this help.
 	@echo -e "$$(grep -hE '^\S+:.*##' $(MAKEFILE_LIST) | sed -e 's/:.*##\s*/:/' -e 's/^\(.\+\):\(.*\)/\\x1b[36m\1\\x1b[m:\2/' | column -c2 -t -s :)"
 
+## Setup the local environment
+.PHONY: install
+install: ## Install the local environment, Cypress, build acceptance containers
+	yarn
+	make install-acceptance
+
 # Dev Helpers
 .PHONY: i18n
 i18n: ## Sync i18n

README.md

@@ -17,14 +17,13 @@ The Volto Slider Block allows editors to add sliders to a Volto page. You can se
 
 https://user-images.githubusercontent.com/486927/170819371-6284d8e7-e5df-4893-9dab-cd06b1054505.mov
 
-## Compatibility
+## Volto Compatibility
 
-Due to a change on how Volto handles defaults, this add-on changed the way of dealing with them, since the release of Volto 16.0.0 RC2.
-
-This are the recommended versions:
+These are the recommended versions:
 
 | Version | Volto version |
 | ------- | ------------- |
+| >=5.0.0 | >=17.0.0-alpha.27 |
 | >=3.0.0 | >=16.0.0-rc.2 |
 | <=2.1.0 | <=16.0.0-a50  |
 

acceptance/cypress/tests/block.cy.js

@@ -24,9 +24,9 @@ context('Block Acceptance Tests', () => {
     cy.get('#toolbar-save').click();
   });
 
-  it.only('As editor I can add a Slider block and teaser another content', () => {
+  it('As editor I can add a Slider block and teaser another content', () => {
     cy.intercept('PATCH', '/**').as('save');
-    cy.intercept('GET', '/**/document').as('content');
+    cy.intercept('GET', `/**/*?expand*`).as('content');
 
     cy.visit('/document/edit');
     cy.addNewBlock('slider');

acceptance/docker-compose.yml

@@ -15,9 +15,11 @@ services:
     environment:
       RAZZLE_INTERNAL_API_PATH: http://backend-acceptance:55001/plone
       RAZZLE_API_PATH: http://localhost:55001/plone
+      HOST: 0.0.0.0
     ports:
       - 3000:3000
       - 3001:3001
+    tty: true
     depends_on:
       - backend-acceptance
     profiles:

acceptance/package.json

@@ -1,5 +1,5 @@
 {
   "dependencies": {
-    "@plone/volto-testing": "^3.1.0"
+    "@plone/volto-testing": "4.0.0-alpha.1"
   }
 }