diff --git a/.env b/.env new file mode 100644 index 0000000..ef282fa --- /dev/null +++ b/.env @@ -0,0 +1,3 @@ +# Jest configuration variables +# - possible values: ON, OFF +JEST_USE_SETUP=OFF \ No newline at end of file diff --git a/.eslintrc.js b/.eslintrc.js new file mode 100644 index 0000000..0cbd65c --- /dev/null +++ b/.eslintrc.js @@ -0,0 +1,65 @@ +const fs = require('fs'); +const path = require('path'); +const projectRootPath = fs.realpathSync(__dirname + '/../../../'); + +let voltoPath = path.join(projectRootPath, 'node_modules/@plone/volto'); +let configFile; +if (fs.existsSync(`${projectRootPath}/tsconfig.json`)) + configFile = `${projectRootPath}/tsconfig.json`; +else if (fs.existsSync(`${projectRootPath}/jsconfig.json`)) + configFile = `${projectRootPath}/jsconfig.json`; + +if (configFile) { + const jsConfig = require(configFile).compilerOptions; + const pathsConfig = jsConfig.paths; + if (pathsConfig['@plone/volto']) + voltoPath = `./${jsConfig.baseUrl}/${pathsConfig['@plone/volto'][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, +]); + +const addonExtenders = reg.getEslintExtenders().map((m) => require(m)); + +const defaultConfig = { + extends: `${voltoPath}/.eslintrc`, + settings: { + 'import/resolver': { + alias: { + map: [ + ['@plone/volto', '@plone/volto/src'], + ['@plone/volto-slate', '@plone/volto/packages/volto-slate/src'], + ...addonAliases, + ['@package', `${__dirname}/src`], + ['@root', `${__dirname}/src`], + ['~', `${__dirname}/src`], + ], + extensions: ['.js', '.jsx', '.json'], + }, + 'babel-plugin-root-import': { + rootPathSuffix: 'src', + }, + }, + }, + rules: { + 'react/jsx-no-target-blank': [ + 'error', + { + allowReferrer: true, + }, + ], + } +}; + +const config = addonExtenders.reduce( + (acc, extender) => extender.modify(acc), + defaultConfig, +); + +module.exports = config; diff --git a/.gitignore b/.gitignore index 53b9801..f1be4ff 100644 --- a/.gitignore +++ b/.gitignore @@ -1,6 +1,5 @@ .vscode/ .history -.eslintrc.js .nyc_output project coverage diff --git a/.project.eslintrc.js b/.project.eslintrc.js deleted file mode 100644 index 765070f..0000000 --- a/.project.eslintrc.js +++ /dev/null @@ -1,48 +0,0 @@ -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', - }, - }, - }, -}; - diff --git a/CHANGELOG.md b/CHANGELOG.md index b706f2e..9dd54e2 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,7 +4,23 @@ 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). -### [1.1.5](https://github.com/eea/volto-widget-theme-picker/compare/1.1.4...1.1.5) - 23 October 2023 +### [2.0.0](https://github.com/eea/volto-widget-theme-picker/compare/1.1.5...2.0.0) - 22 April 2024 + +#### :rocket: New Features + +- feat: Release 2.0.0 - Volto 17 support [alin - [`469692b`](https://github.com/eea/volto-widget-theme-picker/commit/469692b986faff3e590589d02cacedf75bcea3e5)] +- feat: Volto 17 support - refs #264527 [Alin Voinea - [`2534314`](https://github.com/eea/volto-widget-theme-picker/commit/25343143fa2865ba9a5910ed4796ae61830e4fb6)] + +#### :house: Internal changes + +- chore: Fix package.json [alin - [`c96ac43`](https://github.com/eea/volto-widget-theme-picker/commit/c96ac43af3199acc816875526bbc8b5875a2ec0d)] +- style: Automated code fix [eea-jenkins - [`6d26a6b`](https://github.com/eea/volto-widget-theme-picker/commit/6d26a6b9259901aed0fc1156413e12d15076a0f9)] + +#### :hammer_and_wrench: Others + +- test: add unit tests and delete snapshots [ana-oprea - [`7f2b845`](https://github.com/eea/volto-widget-theme-picker/commit/7f2b845f73872893f64e50035b051e75e4e37ddf)] +- test: Update to volto 17 PR30 [valentinab25 - [`6697fb7`](https://github.com/eea/volto-widget-theme-picker/commit/6697fb77ff151c01c7595da18935208ddfda1ef7)] +### [1.1.5](https://github.com/eea/volto-widget-theme-picker/compare/1.1.4...1.1.5) - 24 October 2023 #### :house: Internal changes @@ -13,7 +29,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog). #### :hammer_and_wrench: Others -- Add Sonarqube tag using clms-frontend addons list [EEA Jenkins - [`90a08dd`](https://github.com/eea/volto-widget-theme-picker/commit/90a08dd01ad5035b827eb4e74c4544d1420f9cd7)] - test: change volto version in Jenkinsfile [ana-oprea - [`3105c0e`](https://github.com/eea/volto-widget-theme-picker/commit/3105c0e34ff772eaf7bb13780ed0ee1ba6728063)] ### [1.1.4](https://github.com/eea/volto-widget-theme-picker/compare/1.1.3...1.1.4) - 29 September 2023 @@ -39,12 +54,10 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog). - i18n: Add en [Alin Voinea - [`887a3ae`](https://github.com/eea/volto-widget-theme-picker/commit/887a3ae639c49d368e76365eb42cdc9d4ee223ee)] - test: Update Makefile and docker-compose to align it with Jenkinsfile [valentinab25 - [`0aa0de3`](https://github.com/eea/volto-widget-theme-picker/commit/0aa0de382baa92e95dd857fe7b20bec01b0ded96)] -- Add Sonarqube tag using freshwater-frontend addons list [EEA Jenkins - [`662bf56`](https://github.com/eea/volto-widget-theme-picker/commit/662bf56d7da28dd685fcd1689f2f3744aa39504c)] ### [1.1.2](https://github.com/eea/volto-widget-theme-picker/compare/1.1.1...1.1.2) - 24 July 2023 #### :hammer_and_wrench: Others -- Add Sonarqube tag using climate-energy-frontend addons list [EEA Jenkins - [`76390e9`](https://github.com/eea/volto-widget-theme-picker/commit/76390e9e50474297312c34e51b66209b0febfae1)] ### [1.1.1](https://github.com/eea/volto-widget-theme-picker/compare/1.1.0...1.1.1) - 12 June 2023 #### :hammer_and_wrench: Others @@ -52,29 +65,14 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog). - test: jest should look for addons in node_modules Refs #253277 [valentinab25 - [`e1ce5b5`](https://github.com/eea/volto-widget-theme-picker/commit/e1ce5b55affe732c5637ee1e092fd304b8ee752e)] - test: Add unit tests for ThemePicker - refs #253277 [ana-oprea - [`af101a9`](https://github.com/eea/volto-widget-theme-picker/commit/af101a9151b86078a5d6e1f37656ac1f56446f03)] - test: Fix test config, coverage Refs #253277 [valentinab25 - [`3ff76f4`](https://github.com/eea/volto-widget-theme-picker/commit/3ff76f4002645a834c5d45c2bbb0683716cba2e4)] -- Add Sonarqube tag using eea-website-frontend addons list [EEA Jenkins - [`855f029`](https://github.com/eea/volto-widget-theme-picker/commit/855f0291af4cc38ecfbbee70ffa0a799b82bda6d)] -- Add Sonarqube tag using industry-frontend addons list [EEA Jenkins - [`6bcac86`](https://github.com/eea/volto-widget-theme-picker/commit/6bcac86da76ad9e42bf99db93459be408bd48f52)] ### [1.1.0](https://github.com/eea/volto-widget-theme-picker/compare/1.0.3...1.1.0) - 27 March 2023 #### :hammer_and_wrench: Others -- Add Sonarqube tag using marine-frontend addons list [EEA Jenkins - [`33b090c`](https://github.com/eea/volto-widget-theme-picker/commit/33b090c443f5e4e5dbebf0c5946865fcad006584)] -- Add Sonarqube tag using circularity-frontend addons list [EEA Jenkins - [`b647ad7`](https://github.com/eea/volto-widget-theme-picker/commit/b647ad7fd68de0f700fe7f1af02f294990d48db7)] -- Add Sonarqube tag using eea-website-frontend addons list [EEA Jenkins - [`8c07ffe`](https://github.com/eea/volto-widget-theme-picker/commit/8c07ffe86318c85ba97d5cb0a8ae7b8072cc59b5)] -- Add Sonarqube tag using cca-frontend addons list [EEA Jenkins - [`405feb5`](https://github.com/eea/volto-widget-theme-picker/commit/405feb55714d982adc0c6ba4df4db388291835f2)] -- Add Sonarqube tag using forests-frontend addons list [EEA Jenkins - [`23d2411`](https://github.com/eea/volto-widget-theme-picker/commit/23d2411fc2fbf7bc5e4505fc05f934f0e9b4744b)] -- Add Sonarqube tag using advisory-board-frontend addons list [EEA Jenkins - [`43e5107`](https://github.com/eea/volto-widget-theme-picker/commit/43e51073f63b0b911bd030c5cd03965ce4ffded1)] -- Add Sonarqube tag using clms-frontend addons list [EEA Jenkins - [`b064246`](https://github.com/eea/volto-widget-theme-picker/commit/b064246f48be642af450b2d1d3db17acf57490da)] -- Add Sonarqube tag using demo-kitkat-frontend addons list [EEA Jenkins - [`8667727`](https://github.com/eea/volto-widget-theme-picker/commit/8667727f125b2fdd57b938bfa082313afcfc2cc7)] -- Add Sonarqube tag using ims-frontend addons list [EEA Jenkins - [`bf4a677`](https://github.com/eea/volto-widget-theme-picker/commit/bf4a67766c52b5d5d52f0e5c14556c4ec0b30938)] -- Add Sonarqube tag using bise-frontend addons list [EEA Jenkins - [`9ccf553`](https://github.com/eea/volto-widget-theme-picker/commit/9ccf553f23ab84ad52ab9b1c28138ddda45ec081)] ### [1.0.3](https://github.com/eea/volto-widget-theme-picker/compare/1.0.2...1.0.3) - 8 February 2023 #### :hammer_and_wrench: Others -- Add Sonarqube tag using eea-website-frontend addons list [EEA Jenkins - [`de3314a`](https://github.com/eea/volto-widget-theme-picker/commit/de3314a716dae4d38cac81f4fa6733d904712d07)] -- Add Sonarqube tag using eea-website-frontend addons list [EEA Jenkins - [`c576cc7`](https://github.com/eea/volto-widget-theme-picker/commit/c576cc79bc481cf67c6b592e4baea6477d07e5ae)] -- Add Sonarqube tag using eea-website-frontend addons list [EEA Jenkins - [`19d97ad`](https://github.com/eea/volto-widget-theme-picker/commit/19d97ad979ea739f001159765ea529bf647ab022)] - back to no theme / undefined [andreiggr - [`e046c5f`](https://github.com/eea/volto-widget-theme-picker/commit/e046c5fb332180a4dd43d07512284c6be8d8a0ed)] ### [1.0.2](https://github.com/eea/volto-widget-theme-picker/compare/1.0.1...1.0.2) - 3 February 2023 diff --git a/Dockerfile b/Dockerfile index bd8e10d..b1ce603 100644 --- a/Dockerfile +++ b/Dockerfile @@ -1,6 +1,6 @@ # syntax=docker/dockerfile:1 ARG VOLTO_VERSION -FROM plone/frontend-builder:${VOLTO_VERSION} +FROM eeacms/frontend-builder:${VOLTO_VERSION} ARG ADDON_NAME ARG ADDON_PATH diff --git a/Jenkinsfile b/Jenkinsfile index dac026d..a8b33dc 100644 --- a/Jenkinsfile +++ b/Jenkinsfile @@ -1,16 +1,24 @@ pipeline { - agent any + tools { + jdk 'Java17' + } + agent { + node { label 'docker-host' } + } environment { - GIT_NAME = "volto-widget-theme-picker" - NAMESPACE = "@eeacms" - SONARQUBE_TAGS = "volto.eea.europa.eu,demo-www.eea.europa.eu,biodiversity.europa.eu,www.eea.europa.eu-ims,clmsdemo.devel6cph.eea.europa.eu,climate-advisory-board.europa.eu,forest.eea.europa.eu,climate-adapt.eea.europa.eu,www.eea.europa.eu-en,water.europa.eu-marine,industry.eea.europa.eu,climate-energy.eea.europa.eu,water.europa.eu-freshwater,land.copernicus.eu" - DEPENDENCIES = "" - VOLTO = "16" - } + GIT_NAME = "volto-widget-theme-picker" + NAMESPACE = "@eeacms" + SONARQUBE_TAGS = "volto.eea.europa.eu,demo-www.eea.europa.eu,biodiversity.europa.eu,www.eea.europa.eu-ims,clmsdemo.devel6cph.eea.europa.eu,climate-advisory-board.europa.eu,forest.eea.europa.eu,climate-adapt.eea.europa.eu,www.eea.europa.eu-en,water.europa.eu-marine,industry.eea.europa.eu,climate-energy.eea.europa.eu,water.europa.eu-freshwater,land.copernicus.eu,insitu-frontend.eionet.europa.eu,insitu.copernicus.eu" + DEPENDENCIES = "" + BACKEND_PROFILES = "eea.kitkat:testing" + BACKEND_ADDONS = "" + VOLTO = "17" + VOLTO16_BREAKING_CHANGES = "no" + IMAGE_NAME = BUILD_TAG.toLowerCase() + } stages { - stage('Release') { when { allOf { @@ -20,47 +28,36 @@ pipeline { } steps { node(label: 'docker') { - withCredentials([string(credentialsId: 'eea-jenkins-token', variable: 'GITHUB_TOKEN'),string(credentialsId: 'eea-jenkins-npm-token', variable: 'NPM_TOKEN')]) { - sh '''docker pull eeacms/gitflow''' - sh '''docker run -i --rm --name="$BUILD_TAG-gitflow-master" -e GIT_BRANCH="$BRANCH_NAME" -e GIT_NAME="$GIT_NAME" -e GIT_TOKEN="$GITHUB_TOKEN" -e NPM_TOKEN="$NPM_TOKEN" -e LANGUAGE=javascript eeacms/gitflow''' + withCredentials([string(credentialsId: 'eea-jenkins-token', variable: 'GITHUB_TOKEN'), string(credentialsId: 'eea-jenkins-npm-token', variable: 'NPM_TOKEN')]) { + sh '''docker run -i --rm --pull always --name="$IMAGE_NAME-gitflow-master" -e GIT_BRANCH="$BRANCH_NAME" -e GIT_NAME="$GIT_NAME" -e GIT_TOKEN="$GITHUB_TOKEN" -e NPM_TOKEN="$NPM_TOKEN" -e LANGUAGE=javascript eeacms/gitflow''' } } } } - stage('Code') { + stage('Check if testing needed') { when { allOf { - environment name: 'CHANGE_ID', value: '' - not { changelog '.*^Automated release [0-9\\.]+$' } not { branch 'master' } + not { branch 'develop' } + environment name: 'CHANGE_ID', value: '' } } steps { - parallel( - - "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" -e VOLTO=$VOLTO plone/volto-addon-ci 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" -e VOLTO=$VOLTO plone/volto-addon-ci stylelint''' - } - }, + script { + checkout scm + withCredentials([string(credentialsId: 'eea-jenkins-token', variable: 'GITHUB_TOKEN')]) { + check_result = sh script: '''docker run --pull always -i --rm --name="$IMAGE_NAME-gitflow-check" -e GIT_TOKEN="$GITHUB_TOKEN" -e GIT_BRANCH="$BRANCH_NAME" -e GIT_ORG="$GIT_ORG" -e GIT_NAME="$GIT_NAME" eeacms/gitflow /check_if_testing_needed.sh''', returnStatus: true - "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" -e VOLTO=$VOLTO plone/volto-addon-ci prettier''' + if (check_result == 0) { + env.SKIP_TESTS = 'yes' + } } - } - ) + } } } - stage('Tests') { + stage('Testing') { when { anyOf { allOf { @@ -76,23 +73,75 @@ pipeline { } } } - steps { - parallel( + parallel { + + stage('Volto 17') { + agent { node { label 'docker-1.13'} } + stages { + stage('Build test image') { + steps { + sh '''docker build --pull --build-arg="VOLTO_VERSION=$VOLTO" --build-arg="ADDON_NAME=$NAMESPACE/$GIT_NAME" --build-arg="ADDON_PATH=$GIT_NAME" . -t $IMAGE_NAME-frontend''' + } + } - "Volto": { - node(label: 'docker') { + stage('Fix code') { + when { + environment name: 'CHANGE_ID', value: '' + not { branch 'master' } + } + steps { 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" -e VOLTO=$VOLTO plone/volto-addon-ci''' - sh '''rm -rf xunit-reports''' - sh '''mkdir -p xunit-reports''' - sh '''docker cp $BUILD_TAG-volto:/opt/frontend/my-volto-project/coverage xunit-reports/''' - sh '''docker cp $BUILD_TAG-volto:/opt/frontend/my-volto-project/junit.xml xunit-reports/''' - sh '''docker cp $BUILD_TAG-volto:/opt/frontend/my-volto-project/unit_tests_log.txt xunit-reports/''' - stash name: "xunit-reports", includes: "xunit-reports/**" - archiveArtifacts artifacts: "xunit-reports/unit_tests_log.txt", fingerprint: true - publishHTML (target : [ + fix_result = sh(script: '''docker run --name="$IMAGE_NAME-fix" --entrypoint=make --workdir=/app/src/addons/$GIT_NAME $IMAGE_NAME-frontend ci-fix''', returnStatus: true) + sh '''docker cp $IMAGE_NAME-fix:/app/src/addons/$GIT_NAME/src .''' + sh '''docker rm -v $IMAGE_NAME-fix''' + FOUND_FIX = sh(script: '''git diff | wc -l''', returnStdout: true).trim() + + if (FOUND_FIX != '0') { + withCredentials([string(credentialsId: 'eea-jenkins-token', variable: 'GITHUB_TOKEN')]) { + sh '''sed -i "s|url = .*|url = https://eea-jenkins:$GITHUB_TOKEN@github.com/eea/$GIT_NAME.git|" .git/config''' + } + sh '''git fetch origin $GIT_BRANCH:$GIT_BRANCH''' + sh '''git checkout $GIT_BRANCH''' + sh '''git add src/''' + sh '''git commit -m "style: Automated code fix" ''' + sh '''git push --set-upstream origin $GIT_BRANCH''' + sh '''exit 1''' + } + } + } + } + + stage('ES lint') { + when { environment name: 'SKIP_TESTS', value: '' } + steps { + sh '''docker run --rm --name="$IMAGE_NAME-eslint" --entrypoint=make --workdir=/app/src/addons/$GIT_NAME $IMAGE_NAME-frontend lint''' + } + } + + stage('Style lint') { + when { environment name: 'SKIP_TESTS', value: '' } + steps { + sh '''docker run --rm --name="$IMAGE_NAME-stylelint" --entrypoint=make --workdir=/app/src/addons/$GIT_NAME $IMAGE_NAME-frontend stylelint''' + } + } + + stage('Prettier') { + when { environment name: 'SKIP_TESTS', value: '' } + steps { + sh '''docker run --rm --name="$IMAGE_NAME-prettier" --entrypoint=make --workdir=/app/src/addons/$GIT_NAME $IMAGE_NAME-frontend prettier''' + } + } + stage('Unit tests') { + when { environment name: 'SKIP_TESTS', value: '' } + steps { + script { + try { + sh '''docker run --name="$IMAGE_NAME-volto" --entrypoint=make --workdir=/app/src/addons/$GIT_NAME $IMAGE_NAME-frontend test-ci''' + sh '''rm -rf xunit-reports''' + sh '''mkdir -p xunit-reports''' + sh '''docker cp $IMAGE_NAME-volto:/app/coverage xunit-reports/''' + sh '''docker cp $IMAGE_NAME-volto:/app/junit.xml xunit-reports/''' + publishHTML(target : [ allowMissing: false, alwaysLinkToLastBuild: true, keepAll: true, @@ -105,87 +154,80 @@ pipeline { catchError(buildResult: 'SUCCESS', stageResult: 'SUCCESS') { junit testResults: 'xunit-reports/junit.xml', allowEmptyResults: true } - sh script: '''docker rm -v $BUILD_TAG-volto''', returnStatus: true + sh script: '''docker rm -v $IMAGE_NAME-volto''', returnStatus: true + } } } - } } - ) - } - } + + stage('Integration tests') { + when { environment name: 'SKIP_TESTS', value: '' } + steps { + script { + try { + sh '''docker run --pull always --rm -d --name="$IMAGE_NAME-plone" -e SITE="Plone" -e PROFILES="$BACKEND_PROFILES" -e ADDONS="$BACKEND_ADDONS" eeacms/plone-backend''' + sh '''docker run -d --shm-size=4g --link $IMAGE_NAME-plone:plone --name="$IMAGE_NAME-cypress" -e "RAZZLE_INTERNAL_API_PATH=http://plone:8080/Plone" --entrypoint=make --workdir=/app/src/addons/$GIT_NAME $IMAGE_NAME-frontend start-ci''' + frontend = sh script:'''docker exec --workdir=/app/src/addons/${GIT_NAME} $IMAGE_NAME-cypress make check-ci''', returnStatus: true + if ( frontend != 0 ) { + sh '''docker logs $IMAGE_NAME-cypress; exit 1''' + } - stage('Integration tests') { - when { - anyOf { - allOf { - not { environment name: 'CHANGE_ID', value: '' } - environment name: 'CHANGE_TARGET', value: 'develop' - } - allOf { - environment name: 'CHANGE_ID', value: '' - anyOf { - not { changelog '.*^Automated release [0-9\\.]+$' } - branch 'master' - } - } - } - } - steps { - parallel( + sh '''timeout -s 9 1800 docker exec --workdir=/app/src/addons/${GIT_NAME} $IMAGE_NAME-cypress make cypress-ci''' + } finally { + try { + if ( frontend == 0 ) { + sh '''rm -rf cypress-videos cypress-results cypress-coverage cypress-screenshots''' + sh '''mkdir -p cypress-videos cypress-results cypress-coverage cypress-screenshots''' + videos = sh script: '''docker cp $IMAGE_NAME-cypress:/app/src/addons/$GIT_NAME/cypress/videos cypress-videos/''', returnStatus: true + sh '''docker cp $IMAGE_NAME-cypress:/app/src/addons/$GIT_NAME/cypress/reports cypress-results/''' + screenshots = sh script: '''docker cp $IMAGE_NAME-cypress:/app/src/addons/$GIT_NAME/cypress/screenshots cypress-screenshots''', returnStatus: true - "Cypress": { - node(label: 'docker') { - script { - try { - 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; 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''' - } finally { - try { - sh '''rm -rf cypress-reports cypress-results cypress-coverage''' - sh '''mkdir -p cypress-reports cypress-results cypress-coverage''' - sh '''docker cp $BUILD_TAG-cypress:/opt/frontend/my-volto-project/src/addons/$GIT_NAME/cypress/videos cypress-reports/''' - sh '''docker cp $BUILD_TAG-cypress:/opt/frontend/my-volto-project/src/addons/$GIT_NAME/cypress/reports cypress-results/''' - coverage = sh script: '''docker cp $BUILD_TAG-cypress:/opt/frontend/my-volto-project/src/addons/$GIT_NAME/coverage cypress-coverage/''', returnStatus: true - if ( coverage == 0 ) { - publishHTML (target : [allowMissing: false, + archiveArtifacts artifacts: 'cypress-screenshots/**', fingerprint: true, allowEmptyArchive: true + + coverage = sh script: '''docker cp $IMAGE_NAME-cypress:/app/src/addons/$GIT_NAME/coverage cypress-coverage''', returnStatus: true + + if ( coverage == 0 ) { + publishHTML(target : [allowMissing: false, alwaysLinkToLastBuild: true, keepAll: true, reportDir: 'cypress-coverage/coverage/lcov-report', reportFiles: 'index.html', reportName: 'CypressCoverage', reportTitles: 'Integration Tests Code Coverage']) - } - sh '''touch empty_file; for ok_test in $(grep -E 'file=.*failures="0"' $(grep 'testsuites .*failures="0"' $(find cypress-results -name *.xml) empty_file | awk -F: '{print $1}') empty_file | sed 's/.* file="\\(.*\\)" time.*/\\1/' | sed 's#^cypress/integration/##g' | sed 's#^../../../node_modules/@eeacms/##g'); do rm -f cypress-reports/videos/$ok_test.mp4; rm -f cypress-reports/$ok_test.mp4; done''' - archiveArtifacts artifacts: 'cypress-reports/**/*.mp4', fingerprint: true, allowEmptyArchive: true - stash name: "cypress-coverage", includes: "cypress-coverage/**", allowEmpty: true - } - finally { - catchError(buildResult: 'SUCCESS', stageResult: 'SUCCESS') { + } + if ( videos == 0 ) { + sh '''for file in $(find cypress-results -name *.xml); do if [ $(grep -E 'failures="[1-9].*"' $file | wc -l) -eq 0 ]; then testname=$(grep -E 'file=.*failures="0"' $file | sed 's#.* file=".*\\/\\(.*\\.[jsxt]\\+\\)" time.*#\\1#' ); rm -f cypress-videos/videos/$testname.mp4; fi; done''' + archiveArtifacts artifacts: 'cypress-videos/**/*.mp4', fingerprint: true, allowEmptyArchive: true + } + } + } finally { + catchError(buildResult: 'SUCCESS', stageResult: 'SUCCESS') { junit testResults: 'cypress-results/**/*.xml', allowEmptyResults: true + } + catchError(buildResult: 'SUCCESS', stageResult: 'SUCCESS') { + sh '''docker logs $IMAGE_NAME-cypress''' + } + sh script: "docker stop $IMAGE_NAME-cypress", returnStatus: true + sh script: "docker stop $IMAGE_NAME-plone", returnStatus: true + sh script: "docker rm -v $IMAGE_NAME-plone", returnStatus: true + sh script: "docker rm -v $IMAGE_NAME-cypress", returnStatus: true } - sh script: "docker stop $BUILD_TAG-plone", returnStatus: true - sh script: "docker rm -v $BUILD_TAG-plone", returnStatus: true - sh script: "docker rm -v $BUILD_TAG-cypress", returnStatus: true - } } } - } } - ) - } - } - stage('Report to SonarQube') { when { anyOf { allOf { not { environment name: 'CHANGE_ID', value: '' } environment name: 'CHANGE_TARGET', value: 'develop' + environment name: 'SKIP_TESTS', value: '' } allOf { environment name: 'CHANGE_ID', value: '' + environment name: 'SKIP_TESTS', value: '' anyOf { allOf { branch 'develop' @@ -197,32 +239,120 @@ pipeline { } } steps { - node(label: 'swarm') { - script{ - checkout scm - unstash "xunit-reports" - unstash "cypress-coverage" - def scannerHome = tool 'SonarQubeScanner'; - def nodeJS = tool 'NodeJS'; - withSonarQubeEnv('Sonarqube') { - sh '''sed -i "s#/opt/frontend/my-volto-project/src/addons/${GIT_NAME}/##g" xunit-reports/coverage/lcov.info''' - sh '''sed -i "s#src/addons/${GIT_NAME}/##g" xunit-reports/coverage/lcov.info''' - sh "export PATH=${scannerHome}/bin:${nodeJS}/bin:$PATH; sonar-scanner -Dsonar.javascript.lcov.reportPaths=./xunit-reports/coverage/lcov.info,./cypress-coverage/coverage/lcov.info -Dsonar.sources=./src -Dsonar.projectKey=$GIT_NAME-$BRANCH_NAME -Dsonar.projectVersion=$BRANCH_NAME-$BUILD_NUMBER" - sh '''try=2; while [ \$try -gt 0 ]; do curl -s -XPOST -u "${SONAR_AUTH_TOKEN}:" "${SONAR_HOST_URL}api/project_tags/set?project=${GIT_NAME}-${BRANCH_NAME}&tags=${SONARQUBE_TAGS},${BRANCH_NAME}" > set_tags_result; if [ \$(grep -ic error set_tags_result ) -eq 0 ]; then try=0; else cat set_tags_result; echo "... Will retry"; sleep 60; try=\$(( \$try - 1 )); fi; done''' + script { + def scannerHome = tool 'SonarQubeScanner' + def nodeJS = tool 'NodeJS' + withSonarQubeEnv('Sonarqube') { + sh '''sed -i "s#/app/src/addons/${GIT_NAME}/##g" xunit-reports/coverage/lcov.info''' + sh '''sed -i "s#src/addons/${GIT_NAME}/##g" xunit-reports/coverage/lcov.info''' + sh "export PATH=${scannerHome}/bin:${nodeJS}/bin:$PATH; sonar-scanner -Dsonar.javascript.lcov.reportPaths=./xunit-reports/coverage/lcov.info,./cypress-coverage/coverage/lcov.info -Dsonar.sources=./src -Dsonar.projectKey=$GIT_NAME-$BRANCH_NAME -Dsonar.projectVersion=$BRANCH_NAME-$BUILD_NUMBER" + sh '''try=5; while [ \$try -gt 0 ]; do curl -s -XPOST -u "${SONAR_AUTH_TOKEN}:" "${SONAR_HOST_URL}api/project_tags/set?project=${GIT_NAME}-${BRANCH_NAME}&tags=${SONARQUBE_TAGS},${BRANCH_NAME}" > set_tags_result; if [ \$(grep -ic error set_tags_result ) -eq 0 ]; then try=0; else cat set_tags_result; echo "... Will retry"; sleep 15; try=\$(( \$try - 1 )); fi; done''' + } + } + } + } + + + } + } + + stage('Volto 16') { + agent { node { label 'integration'} } + when { + environment name: 'SKIP_TESTS', value: '' + not { environment name: 'VOLTO16_BREAKING_CHANGES', value: 'yes' } + } + stages { + stage('Build test image') { + steps { + sh '''docker build --pull --build-arg="VOLTO_VERSION=16" --build-arg="ADDON_NAME=$NAMESPACE/$GIT_NAME" --build-arg="ADDON_PATH=$GIT_NAME" . -t $IMAGE_NAME-frontend16''' } } + + stage('Unit tests Volto 16') { + steps { + script { + try { + sh '''docker run --name="$IMAGE_NAME-volto16" --entrypoint=make --workdir=/app/src/addons/$GIT_NAME $IMAGE_NAME-frontend16 test-ci''' + sh '''rm -rf xunit-reports16''' + sh '''mkdir -p xunit-reports16''' + sh '''docker cp $IMAGE_NAME-volto16:/app/junit.xml xunit-reports16/''' + } finally { + catchError(buildResult: 'SUCCESS', stageResult: 'SUCCESS') { + junit testResults: 'xunit-reports16/junit.xml', allowEmptyResults: true + } + sh script: '''docker rm -v $IMAGE_NAME-volto16''', returnStatus: true + } + } + } + } + + stage('Integration tests Volto 16') { + steps { + script { + try { + sh '''docker run --pull always --rm -d --name="$IMAGE_NAME-plone16" -e SITE="Plone" -e PROFILES="$BACKEND_PROFILES" -e ADDONS="$BACKEND_ADDONS" eeacms/plone-backend''' + sh '''docker run -d --shm-size=4g --link $IMAGE_NAME-plone16:plone --name="$IMAGE_NAME-cypress16" -e "RAZZLE_INTERNAL_API_PATH=http://plone:8080/Plone" --entrypoint=make --workdir=/app/src/addons/$GIT_NAME $IMAGE_NAME-frontend16 start-ci''' + frontend = sh script:'''docker exec --workdir=/app/src/addons/${GIT_NAME} $IMAGE_NAME-cypress16 make check-ci''', returnStatus: true + if ( frontend != 0 ) { + sh '''docker logs $IMAGE_NAME-cypress16; exit 1''' + } + sh '''timeout -s 9 1800 docker exec --workdir=/app/src/addons/${GIT_NAME} $IMAGE_NAME-cypress16 make cypress-ci''' + } finally { + try { + if ( frontend == 0 ) { + sh '''rm -rf cypress-videos16 cypress-results16 cypress-coverage16 cypress-screenshots16''' + sh '''mkdir -p cypress-videos16 cypress-results16 cypress-coverage16 cypress-screenshots16''' + videos = sh script: '''docker cp $IMAGE_NAME-cypress16:/app/src/addons/$GIT_NAME/cypress/videos cypress-videos16/''', returnStatus: true + sh '''docker cp $IMAGE_NAME-cypress16:/app/src/addons/$GIT_NAME/cypress/reports cypress-results16/''' + screenshots = sh script: '''docker cp $IMAGE_NAME-cypress16:/app/src/addons/$GIT_NAME/cypress/screenshots cypress-screenshots16''', returnStatus: true + + archiveArtifacts artifacts: 'cypress-screenshots16/**', fingerprint: true, allowEmptyArchive: true + + if ( videos == 0 ) { + sh '''for file in $(find cypress-results16 -name *.xml); do if [ $(grep -E 'failures="[1-9].*"' $file | wc -l) -eq 0 ]; then testname=$(grep -E 'file=.*failures="0"' $file | sed 's#.* file=".*\\/\\(.*\\.[jsxt]\\+\\)" time.*#\\1#' ); rm -f cypress-videos16/videos/$testname.mp4; fi; done''' + archiveArtifacts artifacts: 'cypress-videos16/**/*.mp4', fingerprint: true, allowEmptyArchive: true + } + } + } finally { + catchError(buildResult: 'SUCCESS', stageResult: 'SUCCESS') { + junit testResults: 'cypress-results16/**/*.xml', allowEmptyResults: true + } + catchError(buildResult: 'SUCCESS', stageResult: 'SUCCESS') { + sh '''docker logs $IMAGE_NAME-cypress16''' + } + sh script: "docker stop $IMAGE_NAME-cypress16", returnStatus: true + sh script: "docker stop $IMAGE_NAME-plone16", returnStatus: true + sh script: "docker rm -v $IMAGE_NAME-plone16", returnStatus: true + sh script: "docker rm -v $IMAGE_NAME-cypress16", returnStatus: true + } + } + } + } + } + + } + } + } + post { + always { + sh script: "docker rmi $IMAGE_NAME-frontend", returnStatus: true + sh script: "docker rmi $IMAGE_NAME-frontend16", returnStatus: true } } } + stage('SonarQube compare to master') { when { anyOf { allOf { not { environment name: 'CHANGE_ID', value: '' } environment name: 'CHANGE_TARGET', value: 'develop' + environment name: 'SKIP_TESTS', value: '' } allOf { + environment name: 'SKIP_TESTS', value: '' environment name: 'CHANGE_ID', value: '' branch 'develop' not { changelog '.*^Automated release [0-9\\.]+$' } @@ -230,18 +360,15 @@ pipeline { } } steps { - node(label: 'docker') { - script { - sh '''docker pull eeacms/gitflow''' - sh '''echo "Error" > checkresult.txt''' - catchError(buildResult: 'FAILURE', stageResult: 'FAILURE') { - sh '''set -o pipefail; docker run -i --rm --name="$BUILD_TAG-gitflow-sn" -e GIT_BRANCH="$BRANCH_NAME" -e GIT_NAME="$GIT_NAME" eeacms/gitflow /checkSonarqubemaster.sh | grep -v "Found script" | tee checkresult.txt''' - } - - publishChecks name: 'SonarQube', title: 'Sonarqube Code Quality Check', summary: "Quality check on the SonarQube metrics from branch develop, comparing it with the ones from master branch. No bugs are allowed", - text: readFile(file: 'checkresult.txt'), conclusion: "${currentBuild.currentResult}", - detailsURL: "${env.BUILD_URL}display/redirect" + script { + sh '''echo "Error" > checkresult.txt''' + catchError(buildResult: 'FAILURE', stageResult: 'FAILURE') { + sh '''set -o pipefail; docker run -i --rm --pull always --name="$IMAGE_NAME-gitflow-sn" -e GIT_BRANCH="$BRANCH_NAME" -e GIT_NAME="$GIT_NAME" eeacms/gitflow /checkSonarqubemaster.sh | grep -v "Found script" | tee checkresult.txt''' } + + publishChecks name: 'SonarQube', title: 'Sonarqube Code Quality Check', summary: 'Quality check on the SonarQube metrics from branch develop, comparing it with the ones from master branch. No bugs are allowed', + text: readFile(file: 'checkresult.txt'), conclusion: "${currentBuild.currentResult}", + detailsURL: "${env.BUILD_URL}display/redirect" } } } @@ -254,20 +381,16 @@ pipeline { environment name: 'CHANGE_TARGET', value: 'master' } steps { - node(label: 'docker') { - script { - if ( env.CHANGE_BRANCH != "develop" ) { - error "Pipeline aborted due to PR not made from develop branch" - } - withCredentials([string(credentialsId: 'eea-jenkins-token', variable: 'GITHUB_TOKEN')]) { - sh '''docker pull eeacms/gitflow''' - sh '''docker run -i --rm --name="$BUILD_TAG-gitflow-pr" -e GIT_CHANGE_TARGET="$CHANGE_TARGET" -e GIT_CHANGE_BRANCH="$CHANGE_BRANCH" -e GIT_CHANGE_AUTHOR="$CHANGE_AUTHOR" -e GIT_CHANGE_TITLE="$CHANGE_TITLE" -e GIT_TOKEN="$GITHUB_TOKEN" -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" -e GIT_ORG="$GIT_ORG" -e GIT_NAME="$GIT_NAME" -e LANGUAGE=javascript eeacms/gitflow''' - } + script { + if (env.CHANGE_BRANCH != 'develop') { + error 'Pipeline aborted due to PR not made from develop branch' + } + withCredentials([string(credentialsId: 'eea-jenkins-token', variable: 'GITHUB_TOKEN')]) { + sh '''docker run --pull always -i --rm --name="$IMAGE_NAME-gitflow-pr" -e GIT_CHANGE_TARGET="$CHANGE_TARGET" -e GIT_CHANGE_BRANCH="$CHANGE_BRANCH" -e GIT_CHANGE_AUTHOR="$CHANGE_AUTHOR" -e GIT_CHANGE_TITLE="$CHANGE_TITLE" -e GIT_TOKEN="$GITHUB_TOKEN" -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" -e GIT_ORG="$GIT_ORG" -e GIT_NAME="$GIT_NAME" -e LANGUAGE=javascript eeacms/gitflow''' } } } } - } post { @@ -290,3 +413,4 @@ pipeline { } } } + diff --git a/Makefile b/Makefile index f3614a8..522b577 100644 --- a/Makefile +++ b/Makefile @@ -46,10 +46,15 @@ endif DIR=$(shell basename $$(pwd)) NODE_MODULES?="../../../node_modules" PLONE_VERSION?=6 -VOLTO_VERSION?=16 +VOLTO_VERSION?=17 ADDON_PATH="${DIR}" ADDON_NAME="@eeacms/${ADDON_PATH}" DOCKER_COMPOSE=PLONE_VERSION=${PLONE_VERSION} VOLTO_VERSION=${VOLTO_VERSION} ADDON_NAME=${ADDON_NAME} ADDON_PATH=${ADDON_PATH} docker compose +RAZZLE_INTERNAL_API_PATH?="http://localhost:8080/Plone" +RAZZLE_DEV_PROXY_API_PATH?="${RAZZLE_INTERNAL_API_PATH}" +CYPRESS_API_PATH="${RAZZLE_DEV_PROXY_API_PATH}" + + # Top-level targets .PHONY: all @@ -77,11 +82,11 @@ shell: ## Start a shell in the frontend container .PHONY: cypress-open cypress-open: ## Open cypress integration tests - NODE_ENV=development $(NODE_MODULES)/cypress/bin/cypress open + CYPRESS_API_PATH="${RAZZLE_DEV_PROXY_API_PATH}" NODE_ENV=development $(NODE_MODULES)/cypress/bin/cypress open .PHONY: cypress-run cypress-run: ## Run cypress integration tests - NODE_ENV=development $(NODE_MODULES)/cypress/bin/cypress run + CYPRESS_API_PATH="${RAZZLE_DEV_PROXY_API_PATH}" NODE_ENV=development $(NODE_MODULES)/cypress/bin/cypress run .PHONY: test test: ## Run jest tests @@ -93,7 +98,7 @@ test-update: ## Update jest tests snapshots .PHONY: stylelint stylelint: ## Stylelint - $(NODE_MODULES)/stylelint/bin/stylelint.js --allow-empty-input 'src/**/*.{css,less}' + $(NODE_MODULES)/.bin/stylelint --allow-empty-input 'src/**/*.{css,less}' .PHONY: stylelint-overrides stylelint-overrides: @@ -101,7 +106,7 @@ stylelint-overrides: .PHONY: stylelint-fix stylelint-fix: ## Fix stylelint - $(NODE_MODULES)/stylelint/bin/stylelint.js --allow-empty-input 'src/**/*.{css,less}' --fix + $(NODE_MODULES)/.bin/stylelint --allow-empty-input 'src/**/*.{css,less}' --fix $(NODE_MODULES)/.bin/stylelint --custom-syntax less --allow-empty-input 'theme/**/*.overrides' 'src/**/*.overrides' --fix .PHONY: prettier @@ -114,11 +119,11 @@ prettier-fix: ## Fix prettier .PHONY: lint lint: ## ES Lint - $(NODE_MODULES)/eslint/bin/eslint.js --max-warnings=0 'src/**/*.{js,jsx}' + $(NODE_MODULES)/.bin/eslint --max-warnings=0 'src/**/*.{js,jsx}' .PHONY: lint-fix lint-fix: ## Fix ES Lint - $(NODE_MODULES)/eslint/bin/eslint.js --fix 'src/**/*.{js,jsx}' + $(NODE_MODULES)/.bin/eslint --fix 'src/**/*.{js,jsx}' .PHONY: i18n i18n: ## i18n @@ -129,3 +134,32 @@ i18n: ## i18n 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 :)" head -n 14 Makefile + +.PHONY: ci-fix +ci-fix: + echo "Running lint-fix" + make lint-fix + echo "Running prettier-fix" + make prettier-fix + echo "Running stylelint-fix" + make stylelint-fix + +.PHONY: test-ci +test-ci: + cd /app + RAZZLE_JEST_CONFIG=src/addons/${ADDON_PATH}/jest-addon.config.js CI=true yarn test src/addons/${ADDON_PATH}/src --watchAll=false --reporters=default --reporters=jest-junit --collectCoverage --coverageReporters lcov cobertura text + +.PHONY: start-ci +start-ci: + cp .coverage.babel.config.js /app/babel.config.js + cd ../.. + yarn start + +.PHONY: check-ci +check-ci: + $(NODE_MODULES)/.bin/wait-on -t 240000 http://localhost:3000 + +.PHONY: cypress-ci +cypress-ci: + $(NODE_MODULES)/.bin/wait-on -t 240000 http://localhost:3000 + CYPRESS_API_PATH="${RAZZLE_DEV_PROXY_API_PATH}" NODE_ENV=development $(NODE_MODULES)/cypress/bin/cypress run --browser chromium diff --git a/cypress.config.js b/cypress.config.js index 0755d54..02c57eb 100644 --- a/cypress.config.js +++ b/cypress.config.js @@ -2,12 +2,12 @@ const { defineConfig } = require('cypress'); module.exports = defineConfig({ viewportWidth: 1280, - defaultCommandTimeout: 5000, + defaultCommandTimeout: 8888, chromeWebSecurity: false, reporter: 'junit', - video: true, + video: false, retries: { - runMode: 1, + runMode: 2, openMode: 0, }, reporterOptions: { diff --git a/cypress/support/e2e.js b/cypress/support/e2e.js index b7c02f2..9dc7871 100644 --- a/cypress/support/e2e.js +++ b/cypress/support/e2e.js @@ -38,10 +38,6 @@ export const slateBeforeEach = (contentType = 'Document') => { 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'); }; diff --git a/jest-addon.config.js b/jest-addon.config.js index 3c86610..cdcbc95 100644 --- a/jest-addon.config.js +++ b/jest-addon.config.js @@ -1,3 +1,5 @@ +require('dotenv').config({ path: __dirname + '/.env' }) + module.exports = { testMatch: ['**/src/addons/**/?(*.)+(spec|test).[jt]s?(x)'], collectCoverageFrom: [ @@ -9,18 +11,26 @@ module.exports = { '@plone/volto/cypress': '/node_modules/@plone/volto/cypress', '@plone/volto/babel': '/node_modules/@plone/volto/babel', '@plone/volto/(.*)$': '/node_modules/@plone/volto/src/$1', - '@package/(.*)$': '/src/$1', - '@root/(.*)$': '/src/$1', + '@package/(.*)$': '/node_modules/@plone/volto/src/$1', + '@root/(.*)$': '/node_modules/@plone/volto/src/$1', '@plone/volto-quanta/(.*)$': '/src/addons/volto-quanta/src/$1', + '@eeacms/search/(.*)$': '/src/addons/volto-searchlib/searchlib/$1', + '@eeacms/search': '/src/addons/volto-searchlib/searchlib', '@eeacms/(.*?)/(.*)$': '/node_modules/@eeacms/$1/src/$2', - '@plone/volto-slate': + '@plone/volto-slate$': '/node_modules/@plone/volto/packages/volto-slate/src', + '@plone/volto-slate/(.*)$': + '/node_modules/@plone/volto/packages/volto-slate/src/$1', '~/(.*)$': '/src/$1', 'load-volto-addons': '/node_modules/@plone/volto/jest-addons-loader.js', }, + transformIgnorePatterns: [ + '/node_modules/(?!(@plone|@root|@package|@eeacms)/).*/', + ], transform: { '^.+\\.js(x)?$': 'babel-jest', + '^.+\\.ts(x)?$': 'babel-jest', '^.+\\.(png)$': 'jest-file', '^.+\\.(jpg)$': 'jest-file', '^.+\\.(svg)$': './node_modules/@plone/volto/jest-svgsystem-transform.js', @@ -33,4 +43,9 @@ module.exports = { statements: 5, }, }, -}; + ...(process.env.JEST_USE_SETUP === 'ON' && { + setupFilesAfterEnv: [ + '/node_modules/@eeacms/volto-widget-theme-picker/jest.setup.js', + ], + }), +} diff --git a/jest.setup.js b/jest.setup.js new file mode 100644 index 0000000..85b16f7 --- /dev/null +++ b/jest.setup.js @@ -0,0 +1,65 @@ +import { jest } from '@jest/globals'; +import configureStore from 'redux-mock-store'; +import thunk from 'redux-thunk'; +import { blocksConfig } from '@plone/volto/config/Blocks'; +import installSlate from '@plone/volto-slate/index'; + +var mockSemanticComponents = jest.requireActual('semantic-ui-react'); +var mockComponents = jest.requireActual('@plone/volto/components'); +var config = jest.requireActual('@plone/volto/registry').default; + +config.blocks.blocksConfig = { + ...blocksConfig, + ...config.blocks.blocksConfig, +}; + +jest.doMock('semantic-ui-react', () => ({ + __esModule: true, + ...mockSemanticComponents, + Popup: ({ content, trigger }) => { + return ( +
+
{trigger}
+
{content}
+
+ ); + }, +})); + +jest.doMock('@plone/volto/components', () => { + return { + __esModule: true, + ...mockComponents, + SidebarPortal: ({ children }) => , + }; +}); + +jest.doMock('@plone/volto/registry', () => + [installSlate].reduce((acc, apply) => apply(acc), config), +); + +const mockStore = configureStore([thunk]); + +global.fetch = jest.fn(() => + Promise.resolve({ + json: () => Promise.resolve({}), + }), +); + +global.store = mockStore({ + intl: { + locale: 'en', + messages: {}, + formatMessage: jest.fn(), + }, + content: { + create: {}, + subrequests: [], + }, + connected_data_parameters: {}, + screen: { + page: { + width: 768, + }, + }, +}); diff --git a/package.json b/package.json index f250be1..9795503 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@eeacms/volto-widget-theme-picker", - "version": "1.1.5", + "version": "2.0.0", "description": "@eeacms/volto-widget-theme-picker: Volto add-on", "main": "src/index.js", "author": "European Environment Agency: IDM2 A-Team", @@ -21,6 +21,7 @@ "@plone/scripts": "*", "babel-plugin-transform-class-properties": "^6.24.1", "cypress-fail-fast": "^5.0.1", + "dotenv": "^16.3.2", "husky": "^8.0.3", "lint-staged": "^14.0.1", "md5": "^2.3.0" diff --git a/src/Widgets/ThemePicker.test.jsx b/src/Widgets/ThemePicker.test.jsx index 8ca1b6f..4b0fc34 100644 --- a/src/Widgets/ThemePicker.test.jsx +++ b/src/Widgets/ThemePicker.test.jsx @@ -1,6 +1,7 @@ import React from 'react'; import { render, fireEvent } from '@testing-library/react'; -import renderer from 'react-test-renderer'; +import '@testing-library/jest-dom/extend-expect'; + import ThemePicker from './ThemePicker'; describe('ThemePicker', () => { @@ -16,18 +17,15 @@ describe('ThemePicker', () => { }; it('renders correctly', () => { - const component = renderer.create(); - - const json = component.toJSON(); - expect(json).toMatchSnapshot(); - const label = component.toJSON().children[0].children[0].children[0] - .children[0].children[0]; - const buttons = component.toJSON().children[0].children[0].children[0] - .children[0].children[1]; - - expect(label.children[0]).toBe('Test Theme Picker'); - expect(buttons.children[0].props.className).toContain('color1'); - expect(buttons.children[1].props.className).toContain('color2'); + const { container } = render(); + + expect(container.querySelector('.wrapper label')).toBeInTheDocument(); + expect( + container.querySelector('.wrapper .buttons .color1[title="Color 1"]'), + ).toBeInTheDocument(); + expect( + container.querySelector('.wrapper .buttons .color2[title="Color 2"]'), + ).toBeInTheDocument(); }); it('calls onChange with correct value when a color button is clicked', () => { @@ -41,10 +39,10 @@ describe('ThemePicker', () => { }); it('does not render when no colors are provided', () => { - const component = renderer.create(); + const { container } = render(); - let json = component.toJSON(); - expect(json).toMatchSnapshot(); - expect(json).toBeNull(); + expect( + container.querySelector('.wrapper .field-test-theme-picker'), + ).not.toBeInTheDocument(); }); }); diff --git a/src/Widgets/__snapshots__/ThemePicker.test.jsx.snap b/src/Widgets/__snapshots__/ThemePicker.test.jsx.snap deleted file mode 100644 index c3cbfe6..0000000 --- a/src/Widgets/__snapshots__/ThemePicker.test.jsx.snap +++ /dev/null @@ -1,48 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`ThemePicker does not render when no colors are provided 1`] = `null`; - -exports[`ThemePicker renders correctly 1`] = ` -
-
-
-
-
- -
-
-
-
-
-
-
-`;