diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml index d17f4d6dd..ba1304b14 100644 --- a/.gitlab-ci.yml +++ b/.gitlab-ci.yml @@ -40,7 +40,7 @@ lint: - cd js - yarn install #- yarn run lint || export EXITVALUE=1 - - yarn run prettier --ignore-path="src/i18n/*" -c . || export EXITVALUE=1 + - yarn run prettier -c . || export EXITVALUE=1 - yarn run build - cd ../ - exit $EXITVALUE @@ -78,6 +78,21 @@ exunit: - lint script: - mix coveralls + +jest: + stage: test + before_script: + - cd js + - yarn install + dependencies: + - lint + script: + - yarn run test:unit --no-color + artifacts: + when: always + paths: + - js/coverage + expire_in: 30 days # cypress: # stage: test # services: diff --git a/js/.eslintrc.js b/js/.eslintrc.js index 939c4df9d..2ffd6107a 100644 --- a/js/.eslintrc.js +++ b/js/.eslintrc.js @@ -67,5 +67,14 @@ module.exports = { mocha: true, }, }, + { + files: [ + "**/__tests__/*.{j,t}s?(x)", + "**/tests/unit/**/*.spec.{j,t}s?(x)", + ], + env: { + jest: true, + }, + }, ], }; diff --git a/js/.gitignore b/js/.gitignore index 2b5352494..b3a5de1e2 100644 --- a/js/.gitignore +++ b/js/.gitignore @@ -4,6 +4,7 @@ node_modules /tests/e2e/videos/ /tests/e2e/screenshots/ +/coverage # local env files .env.local diff --git a/js/.prettierignore b/js/.prettierignore index 03ef6314b..49212628b 100644 --- a/js/.prettierignore +++ b/js/.prettierignore @@ -1 +1,2 @@ -src/i18n/*.json \ No newline at end of file +src/i18n/*.json +coverage/ \ No newline at end of file diff --git a/js/jest.config.js b/js/jest.config.js new file mode 100644 index 000000000..b10500065 --- /dev/null +++ b/js/jest.config.js @@ -0,0 +1,19 @@ +module.exports = { + preset: "@vue/cli-plugin-unit-jest/presets/typescript-and-babel", + collectCoverage: true, + collectCoverageFrom: [ + "**/*.{vue,ts}", + "!**/node_modules/**", + "!get_union_json.ts", + ], + coverageReporters: ["html", "text", "text-summary"], + // The following should fix the issue with svgs and ?inline loader (see Logo.vue), but doesn't work + // + // transform: { + // "^.+\\.svg$": "/tests/unit/svgTransform.js", + // }, + // moduleNameMapper: { + // "^@/(.*svg)(\\?inline)$": "/src/$1", + // "^@/(.*)$": "/src/$1", + // }, +}; diff --git a/js/package.json b/js/package.json index 4b6af9d46..6dd93bfd2 100644 --- a/js/package.json +++ b/js/package.json @@ -5,7 +5,7 @@ "scripts": { "serve": "vue-cli-service serve", "build": "vue-cli-service build --modern", - "test:unit": "vue-cli-service test:unit", + "test:unit": "LANG=en_US.UTF-8 LANGUAGE=en_US:en LC_ALL=en_US.UTF-8 vue-cli-service test:unit", "test:e2e": "vue-cli-service test:e2e", "lint": "vue-cli-service lint" }, @@ -39,6 +39,7 @@ "tippy.js": "^6.2.3", "tiptap": "^1.26.0", "tiptap-extensions": "^1.29.1", + "unfetch": "^4.2.0", "v-tooltip": "2.0.2", "vue": "^2.6.11", "vue-apollo": "^3.0.3", @@ -52,6 +53,7 @@ "vuedraggable": "2.23.2" }, "devDependencies": { + "@types/jest": "^24.0.19", "@types/leaflet": "^1.5.2", "@types/leaflet.locatecontrol": "^0.60.7", "@types/lodash": "^4.14.141", @@ -69,6 +71,7 @@ "@vue/cli-plugin-pwa": "~4.5.9", "@vue/cli-plugin-router": "~4.5.9", "@vue/cli-plugin-typescript": "~4.5.9", + "@vue/cli-plugin-unit-jest": "~4.5.0", "@vue/cli-service": "~4.5.9", "@vue/eslint-config-airbnb": "^5.0.2", "@vue/eslint-config-prettier": "^6.0.0", @@ -79,6 +82,7 @@ "eslint-plugin-import": "^2.20.2", "eslint-plugin-prettier": "^3.1.3", "eslint-plugin-vue": "^7.0.0", + "mock-apollo-client": "^0.4", "prettier": "2.2.1", "prettier-eslint": "^12.0.0", "sass": "^1.29.0", diff --git a/js/src/components/Logo.vue b/js/src/components/Logo.vue index be7e20083..97d010f41 100644 --- a/js/src/components/Logo.vue +++ b/js/src/components/Logo.vue @@ -1,12 +1,13 @@