From 728a7fbb1480850082d555aa2c6d09f835dc083b Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 12:08:36 -0400
Subject: [PATCH 01/28] Adding react-testing-library
---
package.json | 4 +++-
yarn.lock | 30 +++++++++++++++++++++++++++++-
2 files changed, 32 insertions(+), 2 deletions(-)
diff --git a/package.json b/package.json
index 0debeeb..607bfde 100644
--- a/package.json
+++ b/package.json
@@ -56,6 +56,7 @@
"node_modules"
],
"setupFilesAfterEnv": [
+ "react-testing-library/cleanup-after-each",
"/jest/setup.js"
],
"snapshotSerializers": [
@@ -114,6 +115,7 @@
"react-feather": "^1.1.5",
"react-helmet": "^5.2.0",
"react-i18next": "^10.5.3",
- "react-modal": "^3.8.1"
+ "react-modal": "^3.8.1",
+ "react-testing-library": "^6.0.2"
}
}
diff --git a/yarn.lock b/yarn.lock
index 86d0ca5..a701f40 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -700,7 +700,7 @@
"@babel/plugin-transform-react-jsx-self" "^7.0.0"
"@babel/plugin-transform-react-jsx-source" "^7.0.0"
-"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2":
+"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.3.4":
version "7.4.2"
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.4.2.tgz#f5ab6897320f16decd855eed70b705908a313fe8"
integrity sha512-7Bl2rALb7HpvXFL7TETNzKSAeBVCPHELzc0C//9FCxN8nsiueWSJBqaF+2oIJScyILStASR/Cx5WMkXGYTiJFA==
@@ -1077,6 +1077,11 @@
"@sentry/types" "4.5.3"
tslib "^1.9.3"
+"@sheerun/mutationobserver-shim@^0.3.2":
+ version "0.3.2"
+ resolved "https://registry.yarnpkg.com/@sheerun/mutationobserver-shim/-/mutationobserver-shim-0.3.2.tgz#8013f2af54a2b7d735f71560ff360d3a8176a87b"
+ integrity sha512-vTCdPp/T/Q3oSqwHmZ5Kpa9oI7iLtGl3RQaA/NyLHikvcrPxACkkKVr/XzkSPJWXHRhKGzVvb0urJsbMlRxi1Q==
+
"@sindresorhus/is@^0.7.0":
version "0.7.0"
resolved "https://registry.yarnpkg.com/@sindresorhus/is/-/is-0.7.0.tgz#9a06f4f137ee84d7df0460c1fdb1135ffa6c50fd"
@@ -3992,6 +3997,16 @@ dom-serializer@0, dom-serializer@~0.1.0:
domelementtype "^1.3.0"
entities "^1.1.1"
+dom-testing-library@^3.13.1:
+ version "3.18.2"
+ resolved "https://registry.yarnpkg.com/dom-testing-library/-/dom-testing-library-3.18.2.tgz#07d65166743ad3299b7bee5b488e9622c31241bc"
+ integrity sha512-+nYUgGhHarrCY8kLVmyHlgM+IGwBXXrYsWIJB6vpAx2ne9WFgKfwMGcOkkTKQhuAro0sP6RIuRGfm5NF3+ccmQ==
+ dependencies:
+ "@babel/runtime" "^7.3.4"
+ "@sheerun/mutationobserver-shim" "^0.3.2"
+ pretty-format "^24.5.0"
+ wait-for-expect "^1.1.0"
+
dom-walk@^0.1.0:
version "0.1.1"
resolved "https://registry.yarnpkg.com/dom-walk/-/dom-walk-0.1.1.tgz#672226dc74c8f799ad35307df936aba11acd6018"
@@ -10721,6 +10736,14 @@ react-test-renderer@^16.0.0-0:
react-is "^16.8.5"
scheduler "^0.13.5"
+react-testing-library@^6.0.2:
+ version "6.0.2"
+ resolved "https://registry.yarnpkg.com/react-testing-library/-/react-testing-library-6.0.2.tgz#afd7ddaa174e21cf672605e4e4f6f8156c4c9ef9"
+ integrity sha512-hWJIixR/jxJBnemcWI5O2JCMXlwoIpgF1IEUF8EYNEADORSZ9fs8rEJu4ygqyC53l3QOowkNb8D+eF5kGT3srg==
+ dependencies:
+ "@babel/runtime" "^7.3.1"
+ dom-testing-library "^3.13.1"
+
react@^16.7.0:
version "16.8.5"
resolved "https://registry.yarnpkg.com/react/-/react-16.8.5.tgz#49be3b655489d74504ad994016407e8a0445de66"
@@ -12948,6 +12971,11 @@ w3c-hr-time@^1.0.1:
dependencies:
browser-process-hrtime "^0.1.2"
+wait-for-expect@^1.1.0:
+ version "1.1.0"
+ resolved "https://registry.yarnpkg.com/wait-for-expect/-/wait-for-expect-1.1.0.tgz#6607375c3f79d32add35cd2c87ce13f351a3d453"
+ integrity sha512-vQDokqxyMyknfX3luCDn16bSaRcOyH6gGuUXMIbxBLeTo6nWuEWYqMTT9a+44FmW8c2m6TRWBdNvBBjA1hwEKg==
+
walker@~1.0.5:
version "1.0.7"
resolved "https://registry.yarnpkg.com/walker/-/walker-1.0.7.tgz#2f7f9b8fd10d677262b18a884e28d19618e028fb"
From 4fd02d661d50464e51fd02e682d29f708b9ba4a3 Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 12:13:50 -0400
Subject: [PATCH 02/28] Removing enzyme
---
jest/setup.js | 5 --
package.json | 6 --
yarn.lock | 218 ++------------------------------------------------
3 files changed, 6 insertions(+), 223 deletions(-)
diff --git a/jest/setup.js b/jest/setup.js
index 6c6f32f..46b6c2d 100644
--- a/jest/setup.js
+++ b/jest/setup.js
@@ -1,8 +1,3 @@
-import Enzyme from 'enzyme';
-import Adapter from 'enzyme-adapter-react-16';
-
-Enzyme.configure({ adapter: new Adapter() });
-
global.___loader = {
enqueue: jest.fn()
};
diff --git a/package.json b/package.json
index 607bfde..94ce179 100644
--- a/package.json
+++ b/package.json
@@ -59,9 +59,6 @@
"react-testing-library/cleanup-after-each",
"/jest/setup.js"
],
- "snapshotSerializers": [
- "enzyme-to-json/serializer"
- ],
"testPathIgnorePatterns": [
"node_modules",
".cache"
@@ -86,9 +83,6 @@
"babel-jest": "^24.5.0",
"babel-plugin-dynamic-import-node": "^2.2.0",
"babel-preset-gatsby": "^0.1.6",
- "enzyme": "^3.8.0",
- "enzyme-adapter-react-16": "^1.7.1",
- "enzyme-to-json": "^3.3.5",
"eslint": "^5.11.1",
"eslint-plugin-jest": "^22.1.2",
"eslint-plugin-react": "^7.12.1",
diff --git a/yarn.lock b/yarn.lock
index a701f40..8ef4019 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1660,11 +1660,6 @@ array-equal@^1.0.0:
resolved "https://registry.yarnpkg.com/array-equal/-/array-equal-1.0.0.tgz#8c2a5ef2472fd9ea742b04c77a75093ba2757c93"
integrity sha1-jCpe8kcv2ep0KwTHenUJO6J1fJM=
-array-filter@^1.0.0:
- version "1.0.0"
- resolved "https://registry.yarnpkg.com/array-filter/-/array-filter-1.0.0.tgz#baf79e62e6ef4c2a4c0b831232daffec251f9d83"
- integrity sha1-uveeYubvTCpMC4MSMtr/7CUfnYM=
-
array-filter@~0.0.0:
version "0.0.1"
resolved "https://registry.yarnpkg.com/array-filter/-/array-filter-0.0.1.tgz#7da8cf2e26628ed732803581fd21f67cacd2eeec"
@@ -1725,15 +1720,6 @@ array-unique@^0.3.2:
resolved "https://registry.yarnpkg.com/array-unique/-/array-unique-0.3.2.tgz#a894b75d4bc4f6cd679ef3244a9fd8f46ae2d428"
integrity sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg=
-array.prototype.flat@^1.2.1:
- version "1.2.1"
- resolved "https://registry.yarnpkg.com/array.prototype.flat/-/array.prototype.flat-1.2.1.tgz#812db8f02cad24d3fab65dd67eabe3b8903494a4"
- integrity sha512-rVqIs330nLJvfC7JqYvEWwqVr5QjYF1ib02i3YJtR/fICO6527Tjpc/e4Mvmxh3GIePPreRXMdaGyC99YphWEw==
- dependencies:
- define-properties "^1.1.2"
- es-abstract "^1.10.0"
- function-bind "^1.1.1"
-
arraybuffer.slice@~0.0.7:
version "0.0.7"
resolved "https://registry.yarnpkg.com/arraybuffer.slice/-/arraybuffer.slice-0.0.7.tgz#3bbc4275dd584cc1b10809b89d4e8b63a69e7675"
@@ -3928,11 +3914,6 @@ diffie-hellman@^5.0.0:
miller-rabin "^4.0.0"
randombytes "^2.0.0"
-discontinuous-range@1.0.0:
- version "1.0.0"
- resolved "https://registry.yarnpkg.com/discontinuous-range/-/discontinuous-range-1.0.0.tgz#e38331f0844bba49b9a9cb71c771585aab1bc65a"
- integrity sha1-44Mx8IRLukm5qctxx3FYWqsbxlo=
-
dns-equal@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/dns-equal/-/dns-equal-1.0.0.tgz#b39e7f1da6eb0a75ba9c17324b34753c47e0654d"
@@ -4225,64 +4206,6 @@ envinfo@^5.8.1:
resolved "https://registry.yarnpkg.com/envinfo/-/envinfo-5.12.1.tgz#83068c33e0972eb657d6bc69a6df30badefb46ef"
integrity sha512-pwdo0/G3CIkQ0y6PCXq4RdkvId2elvtPCJMG0konqlrfkWQbf1DWeH9K2b/cvu2YgGvPPTOnonZxXM1gikFu1w==
-enzyme-adapter-react-16@^1.7.1:
- version "1.11.2"
- resolved "https://registry.yarnpkg.com/enzyme-adapter-react-16/-/enzyme-adapter-react-16-1.11.2.tgz#8efeafb27e96873a5492fdef3f423693182eb9d4"
- integrity sha512-2ruTTCPRb0lPuw/vKTXGVZVBZqh83MNDnakMhzxhpJcIbneEwNy2Cv0KvL97pl57/GOazJHflWNLjwWhex5AAA==
- dependencies:
- enzyme-adapter-utils "^1.10.1"
- object.assign "^4.1.0"
- object.values "^1.1.0"
- prop-types "^15.7.2"
- react-is "^16.8.4"
- react-test-renderer "^16.0.0-0"
- semver "^5.6.0"
-
-enzyme-adapter-utils@^1.10.1:
- version "1.10.1"
- resolved "https://registry.yarnpkg.com/enzyme-adapter-utils/-/enzyme-adapter-utils-1.10.1.tgz#58264efa19a7befdbf964fb7981a108a5452ac96"
- integrity sha512-oasinhhLoBuZsIkTe8mx0HiudtfErUtG0Ooe1FOplu/t4c9rOmyG5gtrBASK6u4whHIRWvv0cbZMElzNTR21SA==
- dependencies:
- function.prototype.name "^1.1.0"
- object.assign "^4.1.0"
- object.fromentries "^2.0.0"
- prop-types "^15.7.2"
- semver "^5.6.0"
-
-enzyme-to-json@^3.3.5:
- version "3.3.5"
- resolved "https://registry.yarnpkg.com/enzyme-to-json/-/enzyme-to-json-3.3.5.tgz#f8eb82bd3d5941c9d8bc6fd9140030777d17d0af"
- integrity sha512-DmH1wJ68HyPqKSYXdQqB33ZotwfUhwQZW3IGXaNXgR69Iodaoj8TF/D9RjLdz4pEhGq2Tx2zwNUIjBuqoZeTgA==
- dependencies:
- lodash "^4.17.4"
-
-enzyme@^3.8.0:
- version "3.9.0"
- resolved "https://registry.yarnpkg.com/enzyme/-/enzyme-3.9.0.tgz#2b491f06ca966eb56b6510068c7894a7e0be3909"
- integrity sha512-JqxI2BRFHbmiP7/UFqvsjxTirWoM1HfeaJrmVSZ9a1EADKkZgdPcAuISPMpoUiHlac9J4dYt81MC5BBIrbJGMg==
- dependencies:
- array.prototype.flat "^1.2.1"
- cheerio "^1.0.0-rc.2"
- function.prototype.name "^1.1.0"
- has "^1.0.3"
- html-element-map "^1.0.0"
- is-boolean-object "^1.0.0"
- is-callable "^1.1.4"
- is-number-object "^1.0.3"
- is-regex "^1.0.4"
- is-string "^1.0.4"
- is-subset "^0.1.1"
- lodash.escape "^4.0.1"
- lodash.isequal "^4.5.0"
- object-inspect "^1.6.0"
- object-is "^1.0.1"
- object.assign "^4.1.0"
- object.entries "^1.0.4"
- object.values "^1.0.4"
- raf "^3.4.0"
- rst-selector-parser "^2.2.3"
- string.prototype.trim "^1.1.2"
-
eol@^0.8.1:
version "0.8.1"
resolved "https://registry.yarnpkg.com/eol/-/eol-0.8.1.tgz#defc3224990c7eca73bb34461a56cf9dc24761d0"
@@ -4309,7 +4232,7 @@ error-stack-parser@^2.0.0:
dependencies:
stackframe "^1.0.4"
-es-abstract@^1.10.0, es-abstract@^1.11.0, es-abstract@^1.12.0, es-abstract@^1.5.0, es-abstract@^1.5.1, es-abstract@^1.7.0:
+es-abstract@^1.11.0, es-abstract@^1.12.0, es-abstract@^1.5.1, es-abstract@^1.7.0:
version "1.13.0"
resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.13.0.tgz#ac86145fdd5099d8dd49558ccba2eaf9b88e24e9"
integrity sha512-vDZfg/ykNxQVwup/8E1BZhVzFfBxs9NqMzGcvIJrqg5k2/5Za2bWo40dK2J1pgLngZ7c+Shh8lwYtLGyrwPutg==
@@ -5356,20 +5279,11 @@ fsevents@^1.2.7:
nan "^2.9.2"
node-pre-gyp "^0.10.0"
-function-bind@^1.0.2, function-bind@^1.1.1:
+function-bind@^1.1.1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.1.tgz#a56899d3ea3c9bab874bb9773b7c5ede92f4895d"
integrity sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==
-function.prototype.name@^1.1.0:
- version "1.1.0"
- resolved "https://registry.yarnpkg.com/function.prototype.name/-/function.prototype.name-1.1.0.tgz#8bd763cc0af860a859cc5d49384d74b932cd2327"
- integrity sha512-Bs0VRrTz4ghD8pTmbJQD1mZ8A/mN0ur/jGz+A6FBxPDUPkm1tNfF6bhTYPA7i7aF4lZJVr+OXTNNrnnIl58Wfg==
- dependencies:
- define-properties "^1.1.2"
- function-bind "^1.1.1"
- is-callable "^1.1.3"
-
functional-red-black-tree@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/functional-red-black-tree/-/functional-red-black-tree-1.0.1.tgz#1b0ab3bd553b2a0d6399d29c0e3ea0b252078327"
@@ -6254,13 +6168,6 @@ html-comment-regex@^1.1.0:
resolved "https://registry.yarnpkg.com/html-comment-regex/-/html-comment-regex-1.1.2.tgz#97d4688aeb5c81886a364faa0cad1dda14d433a7"
integrity sha512-P+M65QY2JQ5Y0G9KKdlDpo0zK+/OHptU5AaBwUfAIDJZk1MYf32Frm84EcOytfJE0t5JvkAnKlmjsXDnWzCJmQ==
-html-element-map@^1.0.0:
- version "1.0.0"
- resolved "https://registry.yarnpkg.com/html-element-map/-/html-element-map-1.0.0.tgz#19a41940225153ecdfead74f8509154ff1cdc18b"
- integrity sha512-/SP6aOiM5Ai9zALvCxDubIeez0LvG3qP7R9GcRDnJEP/HBmv0A8A9K0o8+HFudcFt46+i921ANjzKsjPjb7Enw==
- dependencies:
- array-filter "^1.0.0"
-
html-encoding-sniffer@^1.0.2:
version "1.0.2"
resolved "https://registry.yarnpkg.com/html-encoding-sniffer/-/html-encoding-sniffer-1.0.2.tgz#e70d84b94da53aa375e11fe3a351be6642ca46f8"
@@ -6716,11 +6623,6 @@ is-binary-path@^1.0.0:
dependencies:
binary-extensions "^1.0.0"
-is-boolean-object@^1.0.0:
- version "1.0.0"
- resolved "https://registry.yarnpkg.com/is-boolean-object/-/is-boolean-object-1.0.0.tgz#98f8b28030684219a95f375cfbd88ce3405dff93"
- integrity sha1-mPiygDBoQhmpXzdc+9iM40Bd/5M=
-
is-buffer@^1.1.5, is-buffer@~1.1.1:
version "1.1.6"
resolved "https://registry.yarnpkg.com/is-buffer/-/is-buffer-1.1.6.tgz#efaa2ea9daa0d7ab2ea13a97b2b8ad51fefbe8be"
@@ -6738,7 +6640,7 @@ is-builtin-module@^3.0.0:
dependencies:
builtin-modules "^3.0.0"
-is-callable@^1.1.3, is-callable@^1.1.4:
+is-callable@^1.1.4:
version "1.1.4"
resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.1.4.tgz#1e1adf219e1eeb684d691f9d6a05ff0d30a24d75"
integrity sha512-r5p9sxJjYnArLjObpjA4xu5EKI3CuKHkJXMhT7kwbpUyIFD1n5PMAsoPvWnvtZiNz7LjkYDRZhd7FlI0eMijEA==
@@ -6872,11 +6774,6 @@ is-npm@^1.0.0:
resolved "https://registry.yarnpkg.com/is-npm/-/is-npm-1.0.0.tgz#f2fb63a65e4905b406c86072765a1a4dc793b9f4"
integrity sha1-8vtjpl5JBbQGyGBydloaTceTufQ=
-is-number-object@^1.0.3:
- version "1.0.3"
- resolved "https://registry.yarnpkg.com/is-number-object/-/is-number-object-1.0.3.tgz#f265ab89a9f445034ef6aff15a8f00b00f551799"
- integrity sha1-8mWrian0RQNO9q/xWo8AsA9VF5k=
-
is-number@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/is-number/-/is-number-3.0.0.tgz#24fd6201a4782cf50561c810276afc7d12d71195"
@@ -6986,16 +6883,6 @@ is-stream@^1.0.0, is-stream@^1.0.1, is-stream@^1.1.0:
resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-1.1.0.tgz#12d4a3dd4e68e0b79ceb8dbc84173ae80d91ca44"
integrity sha1-EtSj3U5o4Lec6428hBc66A2RykQ=
-is-string@^1.0.4:
- version "1.0.4"
- resolved "https://registry.yarnpkg.com/is-string/-/is-string-1.0.4.tgz#cc3a9b69857d621e963725a24caeec873b826e64"
- integrity sha1-zDqbaYV9Yh6WNyWiTK7shzuCbmQ=
-
-is-subset@^0.1.1:
- version "0.1.1"
- resolved "https://registry.yarnpkg.com/is-subset/-/is-subset-0.1.1.tgz#8a59117d932de1de00f245fcdd39ce43f1e939a6"
- integrity sha1-ilkRfZMt4d4A8kX83TnOQ/HpOaY=
-
is-svg@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/is-svg/-/is-svg-3.0.0.tgz#9321dbd29c212e5ca99c4fa9794c714bcafa2f75"
@@ -7978,11 +7865,6 @@ lodash._shimkeys@~2.4.1:
dependencies:
lodash._objecttypes "~2.4.1"
-lodash.escape@^4.0.1:
- version "4.0.1"
- resolved "https://registry.yarnpkg.com/lodash.escape/-/lodash.escape-4.0.1.tgz#c9044690c21e04294beaa517712fded1fa88de98"
- integrity sha1-yQRGkMIeBClL6qUXcS/e0fqI3pg=
-
lodash.every@^4.6.0:
version "4.6.0"
resolved "https://registry.yarnpkg.com/lodash.every/-/lodash.every-4.6.0.tgz#eb89984bebc4364279bb3aefbbd1ca19bfa6c6a7"
@@ -8023,11 +7905,6 @@ lodash.isboolean@^3.0.3:
resolved "https://registry.yarnpkg.com/lodash.isboolean/-/lodash.isboolean-3.0.3.tgz#6c2e171db2a257cd96802fd43b01b20d5f5870f6"
integrity sha1-bC4XHbKiV82WgC/UOwGyDV9YcPY=
-lodash.isequal@^4.5.0:
- version "4.5.0"
- resolved "https://registry.yarnpkg.com/lodash.isequal/-/lodash.isequal-4.5.0.tgz#415c4478f2bcc30120c22ce10ed3226f7d3e18e0"
- integrity sha1-QVxEePK8wwEgwizhDtMib30+GOA=
-
lodash.isinteger@^4.0.4:
version "4.0.4"
resolved "https://registry.yarnpkg.com/lodash.isinteger/-/lodash.isinteger-4.0.4.tgz#619c0af3d03f8b04c31f5882840b77b11cd68343"
@@ -8567,11 +8444,6 @@ moment@^2.21.0:
resolved "https://registry.yarnpkg.com/moment/-/moment-2.24.0.tgz#0d055d53f5052aa653c9f6eb68bb5d12bf5c2b5b"
integrity sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg==
-moo@^0.4.3:
- version "0.4.3"
- resolved "https://registry.yarnpkg.com/moo/-/moo-0.4.3.tgz#3f847a26f31cf625a956a87f2b10fbc013bfd10e"
- integrity sha512-gFD2xGCl8YFgGHsqJ9NKRVdwlioeW3mI1iqfLNYQOv0+6JRwG58Zk9DIGQgyIaffSYaO1xsKnMaYzzNr1KyIAw==
-
morgan@^1.8.2:
version "1.9.1"
resolved "https://registry.yarnpkg.com/morgan/-/morgan-1.9.1.tgz#0a8d16734a1d9afbc824b99df87e738e58e2da59"
@@ -8685,17 +8557,6 @@ ncp@1.0.x:
resolved "https://registry.yarnpkg.com/ncp/-/ncp-1.0.1.tgz#d15367e5cb87432ba117d2bf80fdf45aecfb4246"
integrity sha1-0VNn5cuHQyuhF9K/gP30Wuz7QkY=
-nearley@^2.7.10:
- version "2.16.0"
- resolved "https://registry.yarnpkg.com/nearley/-/nearley-2.16.0.tgz#77c297d041941d268290ec84b739d0ee297e83a7"
- integrity sha512-Tr9XD3Vt/EujXbZBv6UAHYoLUSMQAxSsTnm9K3koXzjzNWY195NqALeyrzLZBKzAkL3gl92BcSogqrHjD8QuUg==
- dependencies:
- commander "^2.19.0"
- moo "^0.4.3"
- railroad-diagrams "^1.0.0"
- randexp "0.4.6"
- semver "^5.4.1"
-
needle@^2.2.1:
version "2.2.4"
resolved "https://registry.yarnpkg.com/needle/-/needle-2.2.4.tgz#51931bff82533b1928b7d1d69e01f1b00ffd2a4e"
@@ -9002,16 +8863,6 @@ object-hash@^1.1.4:
resolved "https://registry.yarnpkg.com/object-hash/-/object-hash-1.3.1.tgz#fde452098a951cb145f039bb7d455449ddc126df"
integrity sha512-OSuu/pU4ENM9kmREg0BdNrUDIl1heYa4mBZacJc+vVWz4GtAwu7jO8s4AIt2aGRUTqxykpWzI3Oqnsm13tTMDA==
-object-inspect@^1.6.0:
- version "1.6.0"
- resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.6.0.tgz#c70b6cbf72f274aab4c34c0c82f5167bf82cf15b"
- integrity sha512-GJzfBZ6DgDAmnuaM3104jR4s1Myxr3Y3zfIyN4z3UdqN69oSRacNK8UhnobDdC+7J2AHCjGwxQubNJfE70SXXQ==
-
-object-is@^1.0.1:
- version "1.0.1"
- resolved "https://registry.yarnpkg.com/object-is/-/object-is-1.0.1.tgz#0aa60ec9989a0b3ed795cf4d06f62cf1ad6539b6"
- integrity sha1-CqYOyZiaCz7Xlc9NBvYs8a1lObY=
-
object-keys@^1.0.11, object-keys@^1.0.12:
version "1.1.0"
resolved "https://registry.yarnpkg.com/object-keys/-/object-keys-1.1.0.tgz#11bd22348dd2e096a045ab06f6c85bcc340fa032"
@@ -9039,16 +8890,6 @@ object.assign@^4.1.0:
has-symbols "^1.0.0"
object-keys "^1.0.11"
-object.entries@^1.0.4:
- version "1.1.0"
- resolved "https://registry.yarnpkg.com/object.entries/-/object.entries-1.1.0.tgz#2024fc6d6ba246aee38bdb0ffd5cfbcf371b7519"
- integrity sha512-l+H6EQ8qzGRxbkHOd5I/aHRhHDKoQXQ8g0BYt4uSweQU1/J6dZUOyWh9a2Vky35YCKjzmgxOzta2hH6kf9HuXA==
- dependencies:
- define-properties "^1.1.3"
- es-abstract "^1.12.0"
- function-bind "^1.1.1"
- has "^1.0.3"
-
object.fromentries@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/object.fromentries/-/object.fromentries-2.0.0.tgz#49a543d92151f8277b3ac9600f1e930b189d30ab"
@@ -9074,7 +8915,7 @@ object.pick@^1.3.0:
dependencies:
isobject "^3.0.1"
-object.values@^1.0.4, object.values@^1.1.0:
+object.values@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/object.values/-/object.values-1.1.0.tgz#bf6810ef5da3e5325790eaaa2be213ea84624da9"
integrity sha512-8mf0nKLAoFX6VlNVdhGj31SVYpaNFtUnuoOXWyFEstsWRgU837AK+JYM0iAxwkSzGRbwn8cbFmgbyxj1j4VbXg==
@@ -10420,7 +10261,7 @@ prop-types@^15.5.10, prop-types@^15.5.4:
loose-envify "^1.3.1"
object-assign "^4.1.1"
-prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2:
+prop-types@^15.6.1, prop-types@^15.6.2:
version "15.7.2"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
@@ -10556,26 +10397,6 @@ querystringify@^2.0.0:
resolved "https://registry.yarnpkg.com/querystringify/-/querystringify-2.1.1.tgz#60e5a5fd64a7f8bfa4d2ab2ed6fdf4c85bad154e"
integrity sha512-w7fLxIRCRT7U8Qu53jQnJyPkYZIaR4n5151KMfcJlO/A9397Wxb1amJvROTK6TOnp7PfoAmg/qXiNHI+08jRfA==
-raf@^3.4.0:
- version "3.4.1"
- resolved "https://registry.yarnpkg.com/raf/-/raf-3.4.1.tgz#0742e99a4a6552f445d73e3ee0328af0ff1ede39"
- integrity sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==
- dependencies:
- performance-now "^2.1.0"
-
-railroad-diagrams@^1.0.0:
- version "1.0.0"
- resolved "https://registry.yarnpkg.com/railroad-diagrams/-/railroad-diagrams-1.0.0.tgz#eb7e6267548ddedfb899c1b90e57374559cddb7e"
- integrity sha1-635iZ1SN3t+4mcG5Dlc3RVnN234=
-
-randexp@0.4.6:
- version "0.4.6"
- resolved "https://registry.yarnpkg.com/randexp/-/randexp-0.4.6.tgz#e986ad5e5e31dae13ddd6f7b3019aa7c87f60ca3"
- integrity sha512-80WNmd9DA0tmZrw9qQa62GPPWfuXJknrmVmLcxvq4uZBdYqb1wYoKTmnlGUchvVWe0XiLupYkBoXVOxz3C8DYQ==
- dependencies:
- discontinuous-range "1.0.0"
- ret "~0.1.10"
-
randombytes@^2.0.0, randombytes@^2.0.1, randombytes@^2.0.5:
version "2.1.0"
resolved "https://registry.yarnpkg.com/randombytes/-/randombytes-2.1.0.tgz#df6f84372f0270dc65cdf6291349ab7a473d4f2a"
@@ -10698,7 +10519,7 @@ react-i18next@^10.5.3:
"@babel/runtime" "^7.3.1"
html-parse-stringify2 "2.0.1"
-react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.4, react-is@^16.8.5:
+react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.4:
version "16.8.5"
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.8.5.tgz#c54ac229dd66b5afe0de5acbe47647c3da692ff8"
integrity sha512-sudt2uq5P/2TznPV4Wtdi+Lnq3yaYW8LfvPKLM9BKD8jJNBkxMVyB0C9/GmVhLw7Jbdmndk/73n7XQGeN9A3QQ==
@@ -10726,16 +10547,6 @@ react-side-effect@^1.1.0:
exenv "^1.2.1"
shallowequal "^1.0.1"
-react-test-renderer@^16.0.0-0:
- version "16.8.5"
- resolved "https://registry.yarnpkg.com/react-test-renderer/-/react-test-renderer-16.8.5.tgz#4cba7a8aad73f7e8a0bc4379a0fe21632886a563"
- integrity sha512-/pFpHYQH4f35OqOae/DgOCXJDxBqD3K3akVfDhLgR0qYHoHjnICI/XS9QDwIhbrOFHWL7okVW9kKMaHuKvt2ng==
- dependencies:
- object-assign "^4.1.1"
- prop-types "^15.6.2"
- react-is "^16.8.5"
- scheduler "^0.13.5"
-
react-testing-library@^6.0.2:
version "6.0.2"
resolved "https://registry.yarnpkg.com/react-testing-library/-/react-testing-library-6.0.2.tgz#afd7ddaa174e21cf672605e4e4f6f8156c4c9ef9"
@@ -11277,14 +11088,6 @@ router@^1.3.1:
setprototypeof "1.1.0"
utils-merge "1.0.1"
-rst-selector-parser@^2.2.3:
- version "2.2.3"
- resolved "https://registry.yarnpkg.com/rst-selector-parser/-/rst-selector-parser-2.2.3.tgz#81b230ea2fcc6066c89e3472de794285d9b03d91"
- integrity sha1-gbIw6i/MYGbInjRy3nlChdmwPZE=
- dependencies:
- lodash.flattendeep "^4.4.0"
- nearley "^2.7.10"
-
rsvp@^3.6.2:
version "3.6.2"
resolved "https://registry.yarnpkg.com/rsvp/-/rsvp-3.6.2.tgz#2e96491599a96cde1b515d5674a8f7a91452926a"
@@ -12096,15 +11899,6 @@ string-width@^3.0.0:
is-fullwidth-code-point "^2.0.0"
strip-ansi "^5.1.0"
-string.prototype.trim@^1.1.2:
- version "1.1.2"
- resolved "https://registry.yarnpkg.com/string.prototype.trim/-/string.prototype.trim-1.1.2.tgz#d04de2c89e137f4d7d206f086b5ed2fae6be8cea"
- integrity sha1-0E3iyJ4Tf019IG8Ia17S+ua+jOo=
- dependencies:
- define-properties "^1.1.2"
- es-abstract "^1.5.0"
- function-bind "^1.0.2"
-
string_decoder@^1.0.0, string_decoder@^1.1.1:
version "1.2.0"
resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-1.2.0.tgz#fe86e738b19544afe70469243b2a1ee9240eae8d"
From 143a18807e0fa88e95711559c38ca9c63ca69ffa Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 12:15:06 -0400
Subject: [PATCH 03/28] Adding mocking tools for components
---
src/__mocks__/component-mock.js | 17 +++++++++++++++++
src/__mocks__/react-i18next.js | 6 ++++++
2 files changed, 23 insertions(+)
create mode 100644 src/__mocks__/component-mock.js
create mode 100644 src/__mocks__/react-i18next.js
diff --git a/src/__mocks__/component-mock.js b/src/__mocks__/component-mock.js
new file mode 100644
index 0000000..ba6ef4c
--- /dev/null
+++ b/src/__mocks__/component-mock.js
@@ -0,0 +1,17 @@
+const React = require('react');
+
+const buildMock = component => {
+ const componentName = component.displayName || component.name || 'Component';
+ const Mock = ({ children, ...props }) => (
+ { children }
+ );
+ Mock.propTypes = component.propTypes;
+ return Mock;
+};
+
+module.exports = path => {
+ const actual = jest.requireActual(path).default;
+ return buildMock(actual);
+};
+
+module.exports.buildMock = buildMock;
diff --git a/src/__mocks__/react-i18next.js b/src/__mocks__/react-i18next.js
new file mode 100644
index 0000000..14d998c
--- /dev/null
+++ b/src/__mocks__/react-i18next.js
@@ -0,0 +1,6 @@
+const reactI18next = jest.requireActual('react-i18next');
+
+module.exports = {
+ ...reactI18next,
+ Trans: require('__mocks__/component-mock').buildMock(reactI18next.Trans)
+};
From babab418c731591884fdd1ee4cb2c9f6a99d1618 Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 12:15:24 -0400
Subject: [PATCH 04/28] Replacing enzyme in SentryError tests
---
.../SentryError/__snapshots__/test.js.snap | 37 +++++++++++--------
src/components/SentryError/index.js | 4 +-
src/components/SentryError/test.js | 27 ++++++++------
3 files changed, 40 insertions(+), 28 deletions(-)
diff --git a/src/components/SentryError/__snapshots__/test.js.snap b/src/components/SentryError/__snapshots__/test.js.snap
index d967bff..bd27abf 100644
--- a/src/components/SentryError/__snapshots__/test.js.snap
+++ b/src/components/SentryError/__snapshots__/test.js.snap
@@ -1,21 +1,26 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`SentryError rendering 1`] = `
-
-
-
- This error has been logged. You may also
-
+
+
+
- fill out a report
-
- .
-
-
-
+ This error has been logged. You may also
+
+ fill out a report
+
+ .
+
+
+
+
`;
diff --git a/src/components/SentryError/index.js b/src/components/SentryError/index.js
index f78f7ad..e0c1d94 100644
--- a/src/components/SentryError/index.js
+++ b/src/components/SentryError/index.js
@@ -16,7 +16,9 @@ const reportError = event => {
export const SentryError = ({ t }) => (
- This error has been logged. You may also This error has been logged. You may also fill out a report .
diff --git a/src/components/SentryError/test.js b/src/components/SentryError/test.js
index 1b82779..dfb1641 100644
--- a/src/components/SentryError/test.js
+++ b/src/components/SentryError/test.js
@@ -1,7 +1,10 @@
jest.mock('@sentry/browser');
+jest.mock('components/Message', () =>
+ require('__mocks__/component-mock')('components/Message'));
+
import React from 'react';
-import { shallow } from 'enzyme';
+import { render, fireEvent } from 'react-testing-library';
import * as Sentry from '@sentry/browser';
import { mockT } from 'i18n';
@@ -9,34 +12,36 @@ import { SentryError } from 'components/SentryError';
describe('SentryError', () => {
test('rendering', () => {
- const component = shallow(
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
describe('error reporting', () => {
test('fill out a report when an event has been logged', () => {
Sentry.lastEventId.mockReturnValue(1);
- const component = shallow(
+ const { getByTestId } = render(
);
- const eventObj = { preventDefault: jest.fn() };
- component.find('a').simulate('click', eventObj);
+ const event = new MouseEvent('click', { bubbles: true });
+ jest.spyOn(event, 'preventDefault');
+ fireEvent(getByTestId('error-report'), event);
- expect(eventObj.preventDefault).toHaveBeenCalled();
+ expect(event.preventDefault).toHaveBeenCalled();
expect(Sentry.showReportDialog).toHaveBeenCalled();
});
test('fill out a report when an event has not been logged', () => {
Sentry.lastEventId.mockReturnValue(false);
- const component = shallow(
+ const { getByTestId } = render(
);
- const eventObj = { preventDefault: jest.fn() };
- component.find('a').simulate('click', eventObj);
+ const event = new MouseEvent('click', { bubbles: true });
+ jest.spyOn(event, 'preventDefault');
+ fireEvent(getByTestId('error-report'), event);
- expect(eventObj.preventDefault).toHaveBeenCalled();
+ expect(event.preventDefault).toHaveBeenCalled();
expect(Sentry.showReportDialog).not.toHaveBeenCalled();
});
});
From d813fdf742d309ebd7e74fae342bbbe6a98d94ae Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 12:57:09 -0400
Subject: [PATCH 05/28] Updating component mock to handle non-standard attrs
---
src/__mocks__/component-mock.js | 4 +++-
src/components/SentryError/__snapshots__/test.js.snap | 7 +++++--
2 files changed, 8 insertions(+), 3 deletions(-)
diff --git a/src/__mocks__/component-mock.js b/src/__mocks__/component-mock.js
index ba6ef4c..ac50082 100644
--- a/src/__mocks__/component-mock.js
+++ b/src/__mocks__/component-mock.js
@@ -3,7 +3,9 @@ const React = require('react');
const buildMock = component => {
const componentName = component.displayName || component.name || 'Component';
const Mock = ({ children, ...props }) => (
- { children }
+ { children }
);
Mock.propTypes = component.propTypes;
return Mock;
diff --git a/src/components/SentryError/__snapshots__/test.js.snap b/src/components/SentryError/__snapshots__/test.js.snap
index bd27abf..2bf482e 100644
--- a/src/components/SentryError/__snapshots__/test.js.snap
+++ b/src/components/SentryError/__snapshots__/test.js.snap
@@ -4,12 +4,15 @@ exports[`SentryError rendering 1`] = `
This error has been logged. You may also
Date: Sun, 24 Mar 2019 12:57:53 -0400
Subject: [PATCH 06/28] Updating index page tests to use react-testing-library
---
src/pages/__snapshots__/index.test.js.snap | 124 ++++++++-------------
src/pages/index.test.js | 17 ++-
2 files changed, 60 insertions(+), 81 deletions(-)
diff --git a/src/pages/__snapshots__/index.test.js.snap b/src/pages/__snapshots__/index.test.js.snap
index b2aaaeb..10c9f0b 100644
--- a/src/pages/__snapshots__/index.test.js.snap
+++ b/src/pages/__snapshots__/index.test.js.snap
@@ -1,89 +1,61 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Index Page rendering 1`] = `
-
-
+
-
-
-
- You need JavaScript to use Regexper.
-
-
- If you have concerns regarding the use of tracking code on Regexper, please see the
-
- Privacy Policy
-
- .
-
-
-
-
+
-
+
`;
exports[`Index Page rendering with an expression on the URL 1`] = `
-
-
+
-
-
-
- You need JavaScript to use Regexper.
-
-
- If you have concerns regarding the use of tracking code on Regexper, please see the
-
- Privacy Policy
-
- .
-
-
-
-
+
-
+
`;
diff --git a/src/pages/index.test.js b/src/pages/index.test.js
index ede26f7..ca1dfda 100644
--- a/src/pages/index.test.js
+++ b/src/pages/index.test.js
@@ -1,5 +1,12 @@
+jest.mock('components/Metadata', () =>
+ require('__mocks__/component-mock')('components/Metadata'));
+jest.mock('components/Message', () =>
+ require('__mocks__/component-mock')('components/Message'));
+jest.mock('components/App', () =>
+ require('__mocks__/component-mock')('components/App'));
+
import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
import { IndexPage } from 'pages/index';
@@ -18,19 +25,19 @@ const queryResult = {
describe('Index Page', () => {
test('rendering', () => {
- const component = shallow(
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('rendering with an expression on the URL', () => {
- const component = shallow(
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
});
From 5d700f47aaab34def4903d9cbfaaba7361cb852b Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 12:59:31 -0400
Subject: [PATCH 07/28] Updating 404 page to use react-testing-library
---
src/pages/404.test.js | 11 ++++++---
src/pages/__snapshots__/404.test.js.snap | 29 ++++++++++++++++--------
2 files changed, 27 insertions(+), 13 deletions(-)
diff --git a/src/pages/404.test.js b/src/pages/404.test.js
index 9ad5dbf..939135d 100644
--- a/src/pages/404.test.js
+++ b/src/pages/404.test.js
@@ -1,14 +1,19 @@
+jest.mock('components/Metadata', () =>
+ require('__mocks__/component-mock')('components/Metadata'));
+jest.mock('components/Message', () =>
+ require('__mocks__/component-mock')('components/Message'));
+
import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
import { mockT } from 'i18n';
import { ErrorPage } from 'pages/404';
describe('Error Page', () => {
test('rendering', () => {
- const component = shallow(
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
});
diff --git a/src/pages/__snapshots__/404.test.js.snap b/src/pages/__snapshots__/404.test.js.snap
index 0bf48f1..43bfeea 100644
--- a/src/pages/__snapshots__/404.test.js.snap
+++ b/src/pages/__snapshots__/404.test.js.snap
@@ -1,19 +1,28 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Error Page rendering 1`] = `
-
-
+
-
-
+
The page you have requested could not be found.
-
+
-
-
+
+
`;
From 9f15287fcca944826e65202a81ce84f61c87b83f Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 13:01:03 -0400
Subject: [PATCH 08/28] Updating privacy page to use react-testing-library
---
src/pages/__snapshots__/privacy.test.js.snap | 16 +++++++++++-----
src/pages/privacy.test.js | 11 ++++++++---
2 files changed, 19 insertions(+), 8 deletions(-)
diff --git a/src/pages/__snapshots__/privacy.test.js.snap b/src/pages/__snapshots__/privacy.test.js.snap
index 6c1aa89..d2080d6 100644
--- a/src/pages/__snapshots__/privacy.test.js.snap
+++ b/src/pages/__snapshots__/privacy.test.js.snap
@@ -1,10 +1,16 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Privacy Page rendering 1`] = `
-
-
+
-
-
+
+
`;
diff --git a/src/pages/privacy.test.js b/src/pages/privacy.test.js
index 38be05d..6e2e7aa 100644
--- a/src/pages/privacy.test.js
+++ b/src/pages/privacy.test.js
@@ -1,14 +1,19 @@
+jest.mock('components/Metadata', () =>
+ require('__mocks__/component-mock')('components/Metadata'));
+jest.mock('components/PrivacyPolicy', () =>
+ require('__mocks__/component-mock')('components/PrivacyPolicy'));
+
import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
import { mockT } from 'i18n';
import { PrivacyPage } from 'pages/privacy';
describe('Privacy Page', () => {
test('rendering', () => {
- const component = shallow(
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
});
From ced6c42c3d826ae3f7c6392d6ba80b8845acd404 Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 13:02:22 -0400
Subject: [PATCH 09/28] Updating PrivacyPolicy to use react-testing-library
---
.../PrivacyPolicy/__snapshots__/test.js.snap | 101 ++++++++++--------
src/components/PrivacyPolicy/test.js | 9 +-
2 files changed, 60 insertions(+), 50 deletions(-)
diff --git a/src/components/PrivacyPolicy/__snapshots__/test.js.snap b/src/components/PrivacyPolicy/__snapshots__/test.js.snap
index 5a30c2d..bfa44fc 100644
--- a/src/components/PrivacyPolicy/__snapshots__/test.js.snap
+++ b/src/components/PrivacyPolicy/__snapshots__/test.js.snap
@@ -1,56 +1,63 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`PrivacyPolicy rendering 1`] = `
-
-
+
-
- Regexper and the tools used to create it are all open source. If you are concerned that the JavaScript being delivered is in any way malicious, please inspect the source in the
-
- GitLab repository
-
- .
-
-
- There are two data collection tools integrated in the app. These tools are not used to collect personal information:
-
-
-
+
+
+ Regexper and the tools used to create it are all open source. If you are concerned that the JavaScript being delivered is in any way malicious, please inspect the source in the
+
+ GitLab repository
+
+ .
+
+
+ There are two data collection tools integrated in the app. These tools are not used to collect personal information:
+
+
+
+
+ Google Analytics
+
+ is used to track browser usage data and application performance. It is configured to anonymize the client IP address.
+
+
+
+ Sentry.io
+
+ is a tool used to capture and report client-side JavaScript errors. It is configured to not store the client IP address.
+
+
+
+ Regexper honors the browser
- Google Analytics
+ “Do Not Track”
- is used to track browser usage data and application performance. It is configured to anonymize the client IP address.
-
-
+ setting and will not enable these data collection tools if that setting is enabled. Also, most popular ad blockers will prevent these tools from sending any tracking data. Disabling or blocking these data collection tools will
- Sentry.io
+ not
- is a tool used to capture and report client-side JavaScript errors. It is configured to not store the client IP address.
-
-
-
- Regexper honors the browser
-
- “Do Not Track”
-
- setting and will not enable these data collection tools if that setting is enabled. Also, most popular ad blockers will prevent these tools from sending any tracking data. Disabling or blocking these data collection tools will
-
- not
-
- impact the performance of this app. The information collected by these tools is used to monitor application performance, determine browser support, and collect error reports.
-
-
- Regexper is not supported by ad revenue or sales of any kind.
-
-
-
+ impact the performance of this app. The information collected by these tools is used to monitor application performance, determine browser support, and collect error reports.
+
+
+ Regexper is not supported by ad revenue or sales of any kind.
+
+
+
+
`;
diff --git a/src/components/PrivacyPolicy/test.js b/src/components/PrivacyPolicy/test.js
index e26b427..3a1c4b3 100644
--- a/src/components/PrivacyPolicy/test.js
+++ b/src/components/PrivacyPolicy/test.js
@@ -1,14 +1,17 @@
+jest.mock('components/Message', () =>
+ require('__mocks__/component-mock')('components/Message'));
+
import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
import { mockT } from 'i18n';
import { PrivacyPolicy } from 'components/PrivacyPolicy';
describe('PrivacyPolicy', () => {
test('rendering', () => {
- const component = shallow(
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
});
From 383197a4c17a16b0b78fe5dfadadd541571f42dd Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 13:04:06 -0400
Subject: [PATCH 10/28] Updating Footer to use react-testing-library
---
.../Footer/__snapshots__/test.js.snap | 78 ++++++++++---------
src/components/Footer/test.js | 6 +-
2 files changed, 46 insertions(+), 38 deletions(-)
diff --git a/src/components/Footer/__snapshots__/test.js.snap b/src/components/Footer/__snapshots__/test.js.snap
index 2ede97f..26bebd6 100644
--- a/src/components/Footer/__snapshots__/test.js.snap
+++ b/src/components/Footer/__snapshots__/test.js.snap
@@ -1,42 +1,50 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Footer rendering 1`] = `
-
+ Generated images licensed:
+
+
+
+
+
+
+
+ abc-123
+
+
+
`;
diff --git a/src/components/Footer/test.js b/src/components/Footer/test.js
index e681fc2..2e7bf3a 100644
--- a/src/components/Footer/test.js
+++ b/src/components/Footer/test.js
@@ -1,14 +1,14 @@
import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
import { mockT } from 'i18n';
import { Footer } from 'components/Footer';
describe('Footer', () => {
test('rendering', () => {
- const component = shallow(
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
});
From ace907779fbe3a9ae1d1c1371d42c975623bc43f Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 13:06:11 -0400
Subject: [PATCH 11/28] Updating Layout to use react-testing-library
---
.../Layout/__snapshots__/test.js.snap | 46 ++++++++++---------
src/components/Layout/test.js | 13 ++++--
2 files changed, 35 insertions(+), 24 deletions(-)
diff --git a/src/components/Layout/__snapshots__/test.js.snap b/src/components/Layout/__snapshots__/test.js.snap
index 27a00b1..7f80226 100644
--- a/src/components/Layout/__snapshots__/test.js.snap
+++ b/src/components/Layout/__snapshots__/test.js.snap
@@ -1,26 +1,30 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Layout rendering 1`] = `
-
-
-
-
-
-
- Example content
-
-
-
+ Example content
+
+
+
+
`;
diff --git a/src/components/Layout/test.js b/src/components/Layout/test.js
index 9ecec6c..8654862 100644
--- a/src/components/Layout/test.js
+++ b/src/components/Layout/test.js
@@ -1,15 +1,22 @@
+jest.mock('components/SentryBoundary', () =>
+ require('__mocks__/component-mock')('components/SentryBoundary'));
+jest.mock('components/Header', () =>
+ require('__mocks__/component-mock')('components/Header'));
+jest.mock('components/Footer', () =>
+ require('__mocks__/component-mock')('components/Footer'));
+
import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
import { Layout } from 'components/Layout';
describe('Layout', () => {
test('rendering', () => {
- const component = shallow(
+ const { asFragment } = render(
Example content
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
});
From 092fd39da6d128a0968dff7f89da2a826e73c906 Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 13:07:39 -0400
Subject: [PATCH 12/28] Updating tests for Loader to use react-testing-library
---
.../Loader/__snapshots__/test.js.snap | 133 +++++++++---------
src/components/Loader/test.js | 6 +-
2 files changed, 66 insertions(+), 73 deletions(-)
diff --git a/src/components/Loader/__snapshots__/test.js.snap b/src/components/Loader/__snapshots__/test.js.snap
index 29fa6a5..ff47cf2 100644
--- a/src/components/Loader/__snapshots__/test.js.snap
+++ b/src/components/Loader/__snapshots__/test.js.snap
@@ -1,82 +1,75 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Loader rendering 1`] = `
-
+
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
TRANSLATE(Loading...)
-
+
`;
diff --git a/src/components/Loader/test.js b/src/components/Loader/test.js
index c463c51..49231b8 100644
--- a/src/components/Loader/test.js
+++ b/src/components/Loader/test.js
@@ -1,5 +1,5 @@
import React from 'react';
-import { mount } from 'enzyme';
+import { render } from 'react-testing-library';
import { mockT } from 'i18n';
import { Loader } from 'components/Loader';
@@ -8,9 +8,9 @@ describe('Loader', () => {
test('rendering', () => {
// Using full rendering here since styles for this depend on the structure
// of the SVG.
- const component = mount(
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
});
From e29b40990c53efa1416be815f5140f66c4343770 Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 13:18:29 -0400
Subject: [PATCH 13/28] Updating SentryBoundary to use react-testing-library
---
.../SentryBoundary/__snapshots__/test.js.snap | 21 ++++++++--
src/components/SentryBoundary/test.js | 38 ++++++++++++-------
2 files changed, 43 insertions(+), 16 deletions(-)
diff --git a/src/components/SentryBoundary/__snapshots__/test.js.snap b/src/components/SentryBoundary/__snapshots__/test.js.snap
index 013e4a1..330b19e 100644
--- a/src/components/SentryBoundary/__snapshots__/test.js.snap
+++ b/src/components/SentryBoundary/__snapshots__/test.js.snap
@@ -1,7 +1,22 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`SentryBoundary error handling 1`] = ` `;
+exports[`SentryBoundary error handling 1`] = `
+
+ Example content
+
+`;
-exports[`SentryBoundary error handling 2`] = ` `;
+exports[`SentryBoundary error handling 2`] = `
+
+
+
+`;
-exports[`SentryBoundary rendering 1`] = `"Example content"`;
+exports[`SentryBoundary rendering 1`] = `
+
+ Example content
+
+`;
diff --git a/src/components/SentryBoundary/test.js b/src/components/SentryBoundary/test.js
index 456392e..76a869b 100644
--- a/src/components/SentryBoundary/test.js
+++ b/src/components/SentryBoundary/test.js
@@ -1,41 +1,53 @@
jest.mock('@sentry/browser');
+jest.mock('components/SentryError', () =>
+ require('__mocks__/component-mock')('components/SentryError'));
import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
import * as Sentry from '@sentry/browser';
import SentryBoundary from 'components/SentryBoundary';
describe('SentryBoundary', () => {
test('rendering', () => {
- const component = shallow(
+ const { asFragment } = render(
Example content
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('error handling', () => {
- const Child = () => 'Example content';
- const component = shallow(
+ // Hide React's console logging about the error
+ jest.spyOn(console, 'error').mockImplementation(() => {});
+
+ const error =new Error('Example error');
+ const Child = ({ shouldThrow }) => {
+ if (shouldThrow) {
+ throw error;
+ }
+
+ return 'Example content';
+ };
+ const { asFragment, rerender } = render(
-
+
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
- const error = new Error('Example error');
- component.find('Child').simulateError(error);
- // NOTE: Enzyme doesn't call getDerivedStateFromError yet, so we have to
- // set the state manually
- component.setState(SentryBoundary.getDerivedStateFromError(error));
+ rerender(
+
+
+
+ );
const scope = { setExtra: jest.fn() };
expect(Sentry.withScope).toHaveBeenCalled();
Sentry.withScope.mock.calls[0][0](scope);
expect(Sentry.captureException).toHaveBeenCalledWith(error);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
});
From 4d31079ca22b04cc4d7cfe09953644e97b0d60f2 Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 13:47:00 -0400
Subject: [PATCH 14/28] Updating InstallPrompt to use react-testing-library
---
.../InstallPrompt/__snapshots__/test.js.snap | 61 ++++++++++++---
src/components/InstallPrompt/index.js | 5 +-
src/components/InstallPrompt/test.js | 74 +++++++++----------
3 files changed, 91 insertions(+), 49 deletions(-)
diff --git a/src/components/InstallPrompt/__snapshots__/test.js.snap b/src/components/InstallPrompt/__snapshots__/test.js.snap
index 1d40561..17abdcb 100644
--- a/src/components/InstallPrompt/__snapshots__/test.js.snap
+++ b/src/components/InstallPrompt/__snapshots__/test.js.snap
@@ -1,16 +1,57 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`InstallPrompt rendering 1`] = `""`;
+exports[`InstallPrompt accepting install prompt 1`] = `
+
+
+
+ Add to Home Screen
+
+
+
+`;
-exports[`InstallPrompt rendering after an install prompt has been requested 1`] = `""`;
+exports[`InstallPrompt accepting install prompt 2`] = ` `;
+
+exports[`InstallPrompt rejecting install prompt 1`] = `
+
+
+
+ Add to Home Screen
+
+
+
+`;
+
+exports[`InstallPrompt rejecting install prompt 2`] = ` `;
+
+exports[`InstallPrompt rendering 1`] = ` `;
+
+exports[`InstallPrompt rendering after an install prompt has been requested 1`] = ` `;
exports[`InstallPrompt rendering after an install prompt has been requested 2`] = `
-
-
- Add to Home Screen
-
-
+
+
+
+ Add to Home Screen
+
+
+
`;
diff --git a/src/components/InstallPrompt/index.js b/src/components/InstallPrompt/index.js
index 43f263a..57b31d9 100644
--- a/src/components/InstallPrompt/index.js
+++ b/src/components/InstallPrompt/index.js
@@ -43,7 +43,10 @@ class InstallPrompt extends React.PureComponent {
return null;
}
- return
+ return
Add to Home Screen
;
}
diff --git a/src/components/InstallPrompt/test.js b/src/components/InstallPrompt/test.js
index e0fc673..ea3edb2 100644
--- a/src/components/InstallPrompt/test.js
+++ b/src/components/InstallPrompt/test.js
@@ -1,88 +1,86 @@
import React from 'react';
-import { shallow } from 'enzyme';
+import { render, fireEvent } from 'react-testing-library';
import { InstallPrompt } from 'components/InstallPrompt';
describe('InstallPrompt', () => {
test('rendering', () => {
- const component = shallow(
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('rendering after an install prompt has been requested', () => {
- const component = shallow(
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
- component.instance().handleInstallPrompt({
+ const event = new Event('beforeinstallprompt', {
prompt: jest.fn()
});
+ fireEvent(window, event);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
- test('adding and removing event listener', () => {
+ test('removing event listener', () => {
jest.spyOn(window, 'addEventListener');
jest.spyOn(window, 'removeEventListener');
- const component = shallow(
+ const { unmount } = render(
);
- const handleInstallPrompt = component.instance().handleInstallPrompt;
- expect(window.addEventListener).toHaveBeenCalledWith(
- 'beforeinstallprompt',
- handleInstallPrompt);
-
- component.unmount();
+ unmount();
expect(window.removeEventListener).toHaveBeenCalledWith(
'beforeinstallprompt',
- handleInstallPrompt);
+ expect.any(Function));
});
test('accepting install prompt', async () => {
- const component = shallow(
+ const { asFragment, getByTestId } = render(
);
- const promptObj = {
- prompt: jest.fn(),
- userChoice: Promise.resolve()
- };
- const eventObj = { preventDefault: jest.fn() };
+ const promptEvent = new Event('beforeinstallprompt');
+ promptEvent.prompt = jest.fn();
+ promptEvent.userChoice = Promise.resolve();
+ const clickEvent = new MouseEvent('click', { bubbles: true });
+ jest.spyOn(clickEvent, 'preventDefault');
- component.instance().handleInstallPrompt(promptObj);
- component.find('a').simulate('click', eventObj);
+ fireEvent(window, promptEvent);
+ expect(asFragment()).toMatchSnapshot();
+ fireEvent(getByTestId('install'), clickEvent);
// Allow async code to run
await new Promise(resolve => setTimeout(resolve));
- expect(eventObj.preventDefault).toHaveBeenCalled();
- expect(promptObj.prompt).toHaveBeenCalled();
- expect(component.state('installPrompt')).toBeNull();
+ expect(clickEvent.preventDefault).toHaveBeenCalled();
+ expect(promptEvent.prompt).toHaveBeenCalled();
+ expect(asFragment()).toMatchSnapshot();
});
test('rejecting install prompt', async () => {
- const component = shallow(
+ const { asFragment, getByTestId } = render(
);
- const promptObj = {
- prompt: jest.fn(),
- userChoice: Promise.reject()
- };
- const eventObj = { preventDefault: jest.fn() };
+ const promptEvent = new Event('beforeinstallprompt');
+ promptEvent.prompt = jest.fn();
+ promptEvent.userChoice = Promise.reject();
+ const clickEvent = new MouseEvent('click', { bubbles: true });
+ jest.spyOn(clickEvent, 'preventDefault');
- component.instance().handleInstallPrompt(promptObj);
- component.find('a').simulate('click', eventObj);
+ fireEvent(window, promptEvent);
+ expect(asFragment()).toMatchSnapshot();
+ fireEvent(getByTestId('install'), clickEvent);
// Allow async code to run
await new Promise(resolve => setTimeout(resolve));
- expect(eventObj.preventDefault).toHaveBeenCalled();
- expect(promptObj.prompt).toHaveBeenCalled();
- expect(component.state('installPrompt')).toBeNull();
+ expect(clickEvent.preventDefault).toHaveBeenCalled();
+ expect(promptEvent.prompt).toHaveBeenCalled();
+ expect(asFragment()).toMatchSnapshot();
});
});
From 791142005eb6774b9ed90eb2c65cd6043dbc1cb3 Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 13:47:34 -0400
Subject: [PATCH 15/28] Supporting different module types
---
src/__mocks__/component-mock.js | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/src/__mocks__/component-mock.js b/src/__mocks__/component-mock.js
index ac50082..96afcc9 100644
--- a/src/__mocks__/component-mock.js
+++ b/src/__mocks__/component-mock.js
@@ -12,8 +12,8 @@ const buildMock = component => {
};
module.exports = path => {
- const actual = jest.requireActual(path).default;
- return buildMock(actual);
+ const actual = jest.requireActual(path);
+ return buildMock(actual.default || actual);
};
module.exports.buildMock = buildMock;
From 53def33627ea860b0f6657b38536d484d93e7893 Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 14:02:54 -0400
Subject: [PATCH 16/28] Updating Header to use react-testing-library
---
.../Header/__snapshots__/test.js.snap | 687 +++++++++++-------
src/components/Header/index.js | 5 +-
src/components/Header/test.js | 60 +-
3 files changed, 465 insertions(+), 287 deletions(-)
diff --git a/src/components/Header/__snapshots__/test.js.snap b/src/components/Header/__snapshots__/test.js.snap
index 6838977..0016f11 100644
--- a/src/components/Header/__snapshots__/test.js.snap
+++ b/src/components/Header/__snapshots__/test.js.snap
@@ -1,182 +1,30 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`Header closing the Privacy Policy modal 1`] = `
-
-
-
-
-
-
-`;
-
-exports[`Header closing the Privacy Policy modal 2`] = `
-
-
-
-
-
-
-`;
-
exports[`Header opening the Privacy Policy modal 1`] = `
-
-
+
-
-
+
-
+
+`;
+
+exports[`Header opening the Privacy Policy modal while holding alt key 1`] = `
+
+
+
+
+
+
+`;
+
+exports[`Header opening the Privacy Policy modal while holding ctrl key 1`] = `
+
+
+
+
+
+
+`;
+
+exports[`Header opening the Privacy Policy modal while holding meta key 1`] = `
+
+
+
+
+
+
+`;
+
+exports[`Header opening the Privacy Policy modal while holding shift key 1`] = `
+
+
+
+
+
+
`;
exports[`Header rendering 1`] = `
-
-
+
-
-
+
-
+
`;
exports[`Header rendering with no banner 1`] = `
-
-
+
-
-
+
-
+
`;
diff --git a/src/components/Header/index.js b/src/components/Header/index.js
index 5e54d30..651598d 100644
--- a/src/components/Header/index.js
+++ b/src/components/Header/index.js
@@ -64,7 +64,10 @@ class Header extends React.PureComponent {
-
+
Privacy Policy
diff --git a/src/components/Header/test.js b/src/components/Header/test.js
index bc75c45..00ebf38 100644
--- a/src/components/Header/test.js
+++ b/src/components/Header/test.js
@@ -1,60 +1,62 @@
+jest.mock('react-modal', () =>
+ require('__mocks__/component-mock')('react-modal'));
+jest.mock('react-feather/dist/icons/gitlab', () =>
+ require('__mocks__/component-mock')('react-feather/dist/icons/gitlab'));
+jest.mock('components/LocaleSwitcher', () =>
+ require('__mocks__/component-mock')('components/LocaleSwitcher'));
+jest.mock('components/InstallPrompt', () =>
+ require('__mocks__/component-mock')('components/InstallPrompt'));
+jest.mock('components/PrivacyPolicy', () =>
+ require('__mocks__/component-mock')('components/PrivacyPolicy'));
+
import React from 'react';
-import { shallow } from 'enzyme';
+import { render, fireEvent } from 'react-testing-library';
import { Header } from 'components/Header';
describe('Header', () => {
test('rendering', () => {
- const component = shallow(
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('rendering with no banner', () => {
- const component = shallow(
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('opening the Privacy Policy modal', () => {
- const component = shallow(
+ const { asFragment, getByTestId } = render(
);
- const eventObj = { preventDefault: jest.fn() };
+ const event = new MouseEvent('click', { bubbles: true });
+ jest.spyOn(event, 'preventDefault');
- component.instance().handleOpen(eventObj);
+ fireEvent(getByTestId('privacy-link'), event);
- expect(eventObj.preventDefault).toHaveBeenCalled();
- expect(component).toMatchSnapshot();
+ expect(event.preventDefault).toHaveBeenCalled();
+ expect(asFragment()).toMatchSnapshot();
});
['shift', 'ctrl', 'alt', 'meta'].forEach(key => {
test(`opening the Privacy Policy modal while holding ${ key } key`, () => {
- const component = shallow(
+ const { asFragment, getByTestId } = render(
);
- const eventObj = { preventDefault: jest.fn() };
+ const event = new MouseEvent('click', {
+ bubbles: true,
+ [key + 'Key']: true
+ });
+ jest.spyOn(event, 'preventDefault');
- component.instance().handleOpen({ [key + 'Key']: true, ...eventObj });
+ fireEvent(getByTestId('privacy-link'), event);
- expect(eventObj.preventDefault).not.toHaveBeenCalled();
- expect(component.state('showModal')).toEqual(false);
+ expect(event.preventDefault).not.toHaveBeenCalled();
+ expect(asFragment()).toMatchSnapshot();
});
});
-
- test('closing the Privacy Policy modal', () => {
- const component = shallow(
-
- );
-
- component.setState({ showModal: true });
-
- expect(component).toMatchSnapshot();
-
- component.instance().handleClose();
-
- expect(component).toMatchSnapshot();
- });
});
From a1281543e29a35d922fd16477edaf6b6e27fb55d Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 14:09:05 -0400
Subject: [PATCH 17/28] Updating Messasge to use react-testing-library
---
.../Message/__snapshots__/test.js.snap | 152 +++++++++---------
src/components/Message/test.js | 31 ++--
2 files changed, 101 insertions(+), 82 deletions(-)
diff --git a/src/components/Message/__snapshots__/test.js.snap b/src/components/Message/__snapshots__/test.js.snap
index 123c105..7fb8652 100644
--- a/src/components/Message/__snapshots__/test.js.snap
+++ b/src/components/Message/__snapshots__/test.js.snap
@@ -1,99 +1,105 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Message rendering 1`] = `
-
+
`;
exports[`Message rendering with a close button 1`] = `
-
+
-
- Testing
-
-
+
+ Testing
+
+
+
+ Close
+
+
+
-
-
+
`;
exports[`Message rendering with icon 1`] = `
-
+
`;
exports[`Message rendering with type 1`] = `
-
+
`;
diff --git a/src/components/Message/test.js b/src/components/Message/test.js
index 348eae6..d77019b 100644
--- a/src/components/Message/test.js
+++ b/src/components/Message/test.js
@@ -1,43 +1,56 @@
+jest.mock('react-feather/dist/icons/info', () =>
+ require('__mocks__/component-mock')('react-feather/dist/icons/info'));
+jest.mock('react-feather/dist/icons/alert-octagon', () =>
+ require('__mocks__/component-mock')(
+ 'react-feather/dist/icons/alert-octagon'
+ ));
+jest.mock('react-feather/dist/icons/alert-triangle', () =>
+ require('__mocks__/component-mock')(
+ 'react-feather/dist/icons/alert-triangle'
+ ));
+jest.mock('react-feather/dist/icons/x-square', () =>
+ require('__mocks__/component-mock')('react-feather/dist/icons/x-square'));
+
import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
import Message from 'components/Message';
describe('Message', () => {
test('rendering', () => {
- const component = shallow(
+ const { asFragment } = render(
Message content
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('rendering with icon', () => {
const Icon = () => 'Sample icon SVG';
- const component = shallow(
+ const { asFragment } = render(
Message content
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('rendering with type', () => {
- const component = shallow(
+ const { asFragment } = render(
Message content
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('rendering with a close button', () => {
- const component = shallow(
+ const { asFragment } = render(
Message content
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
});
From 0d512a1a4db8fdf4872a8b1651cc9b4eecfc3bcc Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 14:16:07 -0400
Subject: [PATCH 18/28] Updating Metadata to use react-testing-library
---
.../Metadata/__snapshots__/test.js.snap | 58 ++++++++++---------
src/components/Metadata/test.js | 18 ++++--
2 files changed, 43 insertions(+), 33 deletions(-)
diff --git a/src/components/Metadata/__snapshots__/test.js.snap b/src/components/Metadata/__snapshots__/test.js.snap
index 7f02a3f..ca8e43b 100644
--- a/src/components/Metadata/__snapshots__/test.js.snap
+++ b/src/components/Metadata/__snapshots__/test.js.snap
@@ -1,37 +1,39 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Metadata rendering 1`] = `
-
+
-
- Regexper
-
-
+}"
+ >
+
+ Regexper
+
+
+
`;
exports[`Metadata rendering with a title and description 1`] = `
-
+
-
- Regexper - Testing
-
-
-
+}"
+ >
+
+ Regexper - Testing
+
+
+
+
`;
diff --git a/src/components/Metadata/test.js b/src/components/Metadata/test.js
index b7f3cdf..89c4d29 100644
--- a/src/components/Metadata/test.js
+++ b/src/components/Metadata/test.js
@@ -1,5 +1,13 @@
+jest.mock('react-helmet', () => {
+ const helmet = jest.requireActual('react-helmet');
+ return {
+ ...helmet,
+ Helmet: require('__mocks__/component-mock').buildMock(helmet.Helmet)
+ };
+});
+
import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
import { Metadata } from 'components/Metadata';
@@ -9,19 +17,19 @@ const commonProps = {
describe('Metadata', () => {
test('rendering', () => {
- const component = shallow(
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('rendering with a title and description', () => {
- const component = shallow(
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
});
From f11c41b05e70a586d928612a28615cc317a8b706 Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 14:32:11 -0400
Subject: [PATCH 19/28] Updating LocaleSwitcher to use react-testing-library
---
.../LocaleSwitcher/__snapshots__/test.js.snap | 58 ++++++++++---------
src/components/LocaleSwitcher/index.js | 5 +-
src/components/LocaleSwitcher/test.js | 37 +++++++-----
3 files changed, 56 insertions(+), 44 deletions(-)
diff --git a/src/components/LocaleSwitcher/__snapshots__/test.js.snap b/src/components/LocaleSwitcher/__snapshots__/test.js.snap
index b5b32fb..87b5109 100644
--- a/src/components/LocaleSwitcher/__snapshots__/test.js.snap
+++ b/src/components/LocaleSwitcher/__snapshots__/test.js.snap
@@ -1,34 +1,36 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`LocaleSwitcher rendering 1`] = `
-
-
- Language
-
-
-
+
+
-
+
+
- English
-
-
- Other
-
-
-
-
-
+
+ English
+
+
+ Other
+
+
+
+
+
+
`;
diff --git a/src/components/LocaleSwitcher/index.js b/src/components/LocaleSwitcher/index.js
index 07d49de..09679cb 100644
--- a/src/components/LocaleSwitcher/index.js
+++ b/src/components/LocaleSwitcher/index.js
@@ -38,7 +38,10 @@ export class LocaleSwitcher extends React.PureComponent {
return
Language
-
+
{ locales.map(locale => (
{ locale.name }
diff --git a/src/components/LocaleSwitcher/test.js b/src/components/LocaleSwitcher/test.js
index 77ac016..23f409e 100644
--- a/src/components/LocaleSwitcher/test.js
+++ b/src/components/LocaleSwitcher/test.js
@@ -1,5 +1,9 @@
+jest.mock('react-feather/dist/icons/chevrons-down', () =>
+ require('__mocks__/component-mock')(
+ 'react-feather/dist/icons/chevrons-down'));
+
import React from 'react';
-import { shallow } from 'enzyme';
+import { render, fireEvent } from 'react-testing-library';
import i18n from 'i18n';
import { LocaleSwitcher } from 'components/LocaleSwitcher';
@@ -9,44 +13,47 @@ jest.mock('./locale-to-available', () => jest.fn(() => 'en'));
describe('LocaleSwitcher', () => {
test('rendering', () => {
- const component = shallow(
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('changing language', () => {
jest.spyOn(i18n, 'changeLanguage');
- const component = shallow(
+ const { getByTestId } = render(
);
- const selectInput = component.find('select');
- selectInput.value = 'other';
- selectInput.simulate('change', { target: { value: 'other' } });
+ const event = new Event('change', { bubbles: true });
+ const select = getByTestId('language-select');
+ select.value = 'other';
+
+ fireEvent(select, event);
expect(i18n.changeLanguage).toHaveBeenCalledWith('other');
});
test('interface update from language change', () => {
- const component = shallow(
+ const { getByTestId } = render(
);
- expect(component.find('select').prop('value')).toEqual('en');
+ expect(getByTestId('language-select').value).toEqual('en');
i18n.emit('languageChanged', 'other');
- expect(component.find('select').prop('value')).toEqual('other');
+ expect(getByTestId('language-select').value).toEqual('other');
});
test('disconnecting event handler on unmount', () => {
- const component = shallow(
+ const { unmount } = render(
);
- jest.spyOn(component, 'setState');
+ jest.spyOn(i18n, 'off');
- component.unmount();
- i18n.emit('languageChanged', 'other');
- expect(component.setState).not.toHaveBeenCalled();
+ unmount();
+ expect(i18n.off).toHaveBeenCalledWith(
+ 'languageChanged',
+ expect.any(Function));
});
});
From 84fd88f1d0d9c5a6824e7985f42de9111c13964d Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 14:38:44 -0400
Subject: [PATCH 20/28] Updating SVG render to use react-testing-library
---
src/rendering/SVG/__snapshots__/test.js.snap | 88 ++++++++++++--------
src/rendering/SVG/test.js | 6 +-
2 files changed, 58 insertions(+), 36 deletions(-)
diff --git a/src/rendering/SVG/__snapshots__/test.js.snap b/src/rendering/SVG/__snapshots__/test.js.snap
index 7c75ea9..e66d344 100644
--- a/src/rendering/SVG/__snapshots__/test.js.snap
+++ b/src/rendering/SVG/__snapshots__/test.js.snap
@@ -24,38 +24,60 @@ Object {
`;
exports[`SVG rendering 1`] = `
-
-
-
-
-
-
-
-
-
-",
- }
- }
- />
-
+
- Content
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Content
+
+
+
`;
diff --git a/src/rendering/SVG/test.js b/src/rendering/SVG/test.js
index a62c2e2..7378596 100644
--- a/src/rendering/SVG/test.js
+++ b/src/rendering/SVG/test.js
@@ -1,14 +1,14 @@
import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
import SVG, { layout } from 'rendering/SVG';
describe('SVG', () => {
test('rendering', () => {
- const component = shallow(
+ const { asFragment } = render(
Content
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('layout', () => {
From e449eade9d747a728f870f958fe73bdfe579a869 Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 14:44:54 -0400
Subject: [PATCH 21/28] Updating Box rendering to use react-testing-library
---
src/rendering/Box/__snapshots__/test.js.snap | 267 +++++++++----------
src/rendering/Box/test.js | 74 +++--
2 files changed, 167 insertions(+), 174 deletions(-)
diff --git a/src/rendering/Box/__snapshots__/test.js.snap b/src/rendering/Box/__snapshots__/test.js.snap
index b20eee2..09f8dc1 100644
--- a/src/rendering/Box/__snapshots__/test.js.snap
+++ b/src/rendering/Box/__snapshots__/test.js.snap
@@ -156,174 +156,149 @@ Object {
`;
exports[`Box rendering 1`] = `
-
-
-
- Example
-
-
+
+
+
+
+ Example
+
+
+
`;
exports[`Box rendering with a corner radius 1`] = `
-
-
-
- Example
-
-
+
+
+
+
+ Example
+
+
+
`;
exports[`Box rendering with a label 1`] = `
-
-
-
- Test box
-
-
- Example
-
-
+
+
+
+
+ Test box
+
+
+ Example
+
+
+
`;
exports[`Box rendering with props from layout 1`] = `
-
-
-
- Test box
-
-
- Example
-
-
+
+
+
+
+ Test box
+
+
+ Example
+
+
+
`;
exports[`Box themes rendering a "anchor" Box 1`] = `
-
-
-
- Example
-
-
+
+
+
+
+ Example
+
+
+
`;
exports[`Box themes rendering a "capture" Box 1`] = `
-
-
-
- Example
-
-
+
+
+
+
+ Example
+
+
+
`;
exports[`Box themes rendering a "charClass" Box 1`] = `
-
-
-
- Example
-
-
+
+
+
+
+ Example
+
+
+
`;
exports[`Box themes rendering a "escape" Box 1`] = `
-
-
-
- Example
-
-
+
+
+
+
+ Example
+
+
+
`;
exports[`Box themes rendering a "literal" Box 1`] = `
-
-
-
- Example
-
-
+
+
+
+
+ Example
+
+
+
`;
diff --git a/src/rendering/Box/test.js b/src/rendering/Box/test.js
index 2fc884e..f86e82d 100644
--- a/src/rendering/Box/test.js
+++ b/src/rendering/Box/test.js
@@ -1,7 +1,7 @@
jest.mock('rendering/getbbox', () => jest.fn());
import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
import getBBox from 'rendering/getbbox';
@@ -9,24 +9,30 @@ import Box, { layout } from 'rendering/Box';
describe('Box', () => {
test('rendering', () => {
- const component = shallow(
- Example
+ const { asFragment } = render(
+
+ Example
+
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('rendering with a corner radius', () => {
- const component = shallow(
- Example
+ const { asFragment } = render(
+
+ Example
+
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('rendering with a label', () => {
- const component = shallow(
- Example
+ const { asFragment } = render(
+
+ Example
+
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('rendering with props from layout', () => {
@@ -39,46 +45,58 @@ describe('Box', () => {
labelTransform: 'LABEL TRANSFORM',
contentTransform: 'CONTENT TRANSFORM'
};
- const component = shallow(
- Example
+ const { asFragment } = render(
+
+ Example
+
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
describe('themes', () => {
test('rendering a "literal" Box', () => {
- const component = shallow(
- Example
+ const { asFragment } = render(
+
+ Example
+
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('rendering a "escape" Box', () => {
- const component = shallow(
- Example
+ const { asFragment } = render(
+
+ Example
+
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('rendering a "charClass" Box', () => {
- const component = shallow(
- Example
+ const { asFragment } = render(
+
+ Example
+
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('rendering a "capture" Box', () => {
- const component = shallow(
- Example
+ const { asFragment } = render(
+
+ Example
+
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('rendering a "anchor" Box', () => {
- const component = shallow(
- Example
+ const { asFragment } = render(
+
+ Example
+
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
});
From f63e9b2a4762e20210d03a5c5c05b3f0d30174b8 Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 14:54:13 -0400
Subject: [PATCH 22/28] Updating Text rendering to use react-testing-library
---
src/rendering/Text/__snapshots__/test.js.snap | 111 ++++++++----------
src/rendering/Text/test.js | 34 ++++--
2 files changed, 70 insertions(+), 75 deletions(-)
diff --git a/src/rendering/Text/__snapshots__/test.js.snap b/src/rendering/Text/__snapshots__/test.js.snap
index 0543be4..06b30c9 100644
--- a/src/rendering/Text/__snapshots__/test.js.snap
+++ b/src/rendering/Text/__snapshots__/test.js.snap
@@ -18,75 +18,62 @@ Object {
`;
exports[`Text positioning text 1`] = `
-
- Example
-
+
+
+
+ Example
+
+
+
`;
exports[`Text rendering 1`] = `
-
- Example
-
+
+
+
+ Example
+
+
+
`;
exports[`Text rendering quoted text 1`] = `
-
-
- “
-
-
- Example
-
-
- ”
-
-
+
+
+
+
+ “
+
+
+ Example
+
+
+ ”
+
+
+
+
`;
exports[`Text rendering with a theme 1`] = `
-
- Example
-
+
+
+
+ Example
+
+
+
`;
diff --git a/src/rendering/Text/test.js b/src/rendering/Text/test.js
index 068b59e..4dae17e 100644
--- a/src/rendering/Text/test.js
+++ b/src/rendering/Text/test.js
@@ -1,35 +1,43 @@
import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
import Text, { layout } from 'rendering/Text';
describe('Text', () => {
test('rendering', () => {
- const component = shallow(
- Example
+ const { asFragment } = render(
+
+ Example
+
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('positioning text', () => {
- const component = shallow(
- Example
+ const { asFragment } = render(
+
+ Example
+
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('rendering with a theme', () => {
- const component = shallow(
- Example
+ const { asFragment } = render(
+
+ Example
+
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('rendering quoted text', () => {
- const component = shallow(
- Example
+ const { asFragment } = render(
+
+ Example
+
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('layout', () => {
From c8068762b5f77e7878fc40bfbdd44c51a92d94ff Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 14:55:10 -0400
Subject: [PATCH 23/28] Updating Pin rendering to use react-testing-library
---
src/rendering/Pin/__snapshots__/test.js.snap | 20 +++++++++-----------
src/rendering/Pin/test.js | 10 ++++++----
2 files changed, 15 insertions(+), 15 deletions(-)
diff --git a/src/rendering/Pin/__snapshots__/test.js.snap b/src/rendering/Pin/__snapshots__/test.js.snap
index 25a041b..2714fe0 100644
--- a/src/rendering/Pin/__snapshots__/test.js.snap
+++ b/src/rendering/Pin/__snapshots__/test.js.snap
@@ -11,15 +11,13 @@ Object {
`;
exports[`Pin rendering 1`] = `
-
+
+
+
+
+
`;
diff --git a/src/rendering/Pin/test.js b/src/rendering/Pin/test.js
index 326e81f..3d1e2b2 100644
--- a/src/rendering/Pin/test.js
+++ b/src/rendering/Pin/test.js
@@ -1,14 +1,16 @@
import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
import Pin, { layout } from 'rendering/Pin';
describe('Pin', () => {
test('rendering', () => {
- const component = shallow(
-
+ const { asFragment } = render(
+
+
+
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
test('layout', () => {
From 26e0776f1d311e1758889a5193c3d0df61d41b46 Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 14:58:12 -0400
Subject: [PATCH 24/28] Disabling yet-to-be-updated tests
---
src/components/App/test.js | 16 ++++++++--------
src/components/Form/test.js | 10 +++++-----
src/components/FormActions/test.js | 10 +++++-----
src/components/Render/test.js | 6 +++---
4 files changed, 21 insertions(+), 21 deletions(-)
diff --git a/src/components/App/test.js b/src/components/App/test.js
index 982ff1c..73255c9 100644
--- a/src/components/App/test.js
+++ b/src/components/App/test.js
@@ -1,5 +1,5 @@
import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
import { mockT } from 'i18n';
import { App } from 'components/App';
@@ -17,14 +17,14 @@ const syntaxList = [
const commonProps = { syntaxList, t: mockT };
describe('App', () => {
- test('rendering', () => {
+ test.skip('rendering', () => {
const component = shallow(
);
expect(component).toMatchSnapshot();
});
- test('rendering an expression', async () => {
+ test.skip('rendering an expression', async () => {
const component = shallow(
);
@@ -42,7 +42,7 @@ describe('App', () => {
expect(component).toMatchSnapshot();
});
- test('rendering with an invalid syntax', async () => {
+ test.skip('rendering with an invalid syntax', async () => {
jest.spyOn(console, 'error').mockImplementation(() => {});
const component = shallow(
@@ -62,7 +62,7 @@ describe('App', () => {
expect(component).toMatchSnapshot();
});
- test('removing rendered expression', async () => {
+ test.skip('removing rendered expression', async () => {
const component = shallow(
);
@@ -79,7 +79,7 @@ describe('App', () => {
expect(component).toMatchSnapshot();
});
- test('rendering image details', async () => {
+ test.skip('rendering image details', async () => {
const component = shallow(
);
@@ -96,7 +96,7 @@ describe('App', () => {
expect(component).toMatchSnapshot();
});
- test('retrying expression rendering', () => {
+ test.skip('retrying expression rendering', () => {
jest.spyOn(console, 'error').mockImplementation(() => {});
const component = shallow(
@@ -114,7 +114,7 @@ describe('App', () => {
expect(instance.handleRender).toHaveBeenCalled();
});
- test('submitting an expression to render', () => {
+ test.skip('submitting an expression to render', () => {
const component = shallow(
);
diff --git a/src/components/Form/test.js b/src/components/Form/test.js
index 93e1220..a479a63 100644
--- a/src/components/Form/test.js
+++ b/src/components/Form/test.js
@@ -1,5 +1,5 @@
import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
import { mockT } from 'i18n';
import { Form } from 'components/Form';
@@ -11,7 +11,7 @@ const syntaxList = [
const commonProps = { syntaxList, t: mockT };
describe('Form', () => {
- test('rendering', () => {
+ test.skip('rendering', () => {
const component = shallow(
@@ -52,7 +52,7 @@ describe('Form', () => {
});
});
- test('submitting form with Shift+Enter', () => {
+ test.skip('submitting form with Shift+Enter', () => {
const component = shallow(
);
@@ -68,7 +68,7 @@ describe('Form', () => {
expect(form.handleSubmit).toHaveBeenCalled();
});
- test('not submitting with just Enter', () => {
+ test.skip('not submitting with just Enter', () => {
const component = shallow(
);
diff --git a/src/components/FormActions/test.js b/src/components/FormActions/test.js
index bdc461c..cb53f46 100644
--- a/src/components/FormActions/test.js
+++ b/src/components/FormActions/test.js
@@ -1,7 +1,7 @@
jest.mock('./links');
import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
import { mockT } from 'i18n';
import { FormActions } from 'components/FormActions';
@@ -21,21 +21,21 @@ createSvgLink.mockResolvedValue({
});
describe('FormActions', () => {
- test('rendering', () => {
+ test.skip('rendering', () => {
const component = shallow(
);
expect(component).toMatchSnapshot();
});
- test('rendering with a permalink', () => {
+ test.skip('rendering with a permalink', () => {
const component = shallow(
);
expect(component).toMatchSnapshot();
});
- test('rendering download links', async () => {
+ test.skip('rendering download links', async () => {
const imageDetails = {
svg: 'test image',
width: 10,
@@ -52,7 +52,7 @@ describe('FormActions', () => {
expect(component).toMatchSnapshot();
});
- test('rendering download links with data after mounting', async () => {
+ test.skip('rendering download links with data after mounting', async () => {
const component = shallow(
);
diff --git a/src/components/Render/test.js b/src/components/Render/test.js
index fa17195..1f5bacc 100644
--- a/src/components/Render/test.js
+++ b/src/components/Render/test.js
@@ -1,10 +1,10 @@
import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
import Render from 'components/Render';
const testType = (name, item) => {
- test(name, () => {
+ test.skip(name, () => {
const data = { type: 'SVG', children: [item] };
const component = shallow(
@@ -14,7 +14,7 @@ const testType = (name, item) => {
};
describe('Render', () => {
- test('debugging', () => {
+ test.skip('debugging', () => {
const data = {
type: 'SVG',
children: [
From 0473c27e3943874b984ed5f8460229c90bb2966b Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 19:46:58 -0400
Subject: [PATCH 25/28] Updating Render to use react-testing-library
---
.../Render/__snapshots__/test.js.snap | 601 ++++++++++++++----
src/components/Render/test.js | 25 +-
2 files changed, 497 insertions(+), 129 deletions(-)
diff --git a/src/components/Render/__snapshots__/test.js.snap b/src/components/Render/__snapshots__/test.js.snap
index c93ee1c..72014fb 100644
--- a/src/components/Render/__snapshots__/test.js.snap
+++ b/src/components/Render/__snapshots__/test.js.snap
@@ -1,155 +1,510 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Render debugging 1`] = `
-
-
+
-
- Example
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Example
+
+
+
+
+
+
+
+
`;
exports[`Render types Box 1`] = `
-
-
+
-
-
- Example
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Example
+
+
+
+
+
+
`;
exports[`Render types HorizontalLayout 1`] = `
-
-
+
-
-
- Example
-
-
- Another Example
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Example
+
+
+ Another Example
+
+
+
+
+
+
`;
exports[`Render types Loop 1`] = `
-
-
+
-
-
- Example
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Example
+
+
+
+
+
+
`;
exports[`Render types Pin 1`] = `
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
`;
exports[`Render types Text 1`] = `
-
-
+
-
- Example
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Example
+
+
+
+
+
`;
exports[`Render types VerticalLayout 1`] = `
-
-
+
-
-
- Example
-
-
- Another Example
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Example
+
+
+ Another Example
+
+
+
+
+
+
`;
diff --git a/src/components/Render/test.js b/src/components/Render/test.js
index 1f5bacc..9cb4f54 100644
--- a/src/components/Render/test.js
+++ b/src/components/Render/test.js
@@ -1,20 +1,33 @@
+jest.mock('rendering/Box', () =>
+ require('__mocks__/component-mock')('rendering/Box'));
+jest.mock('rendering/HorizontalLayout', () =>
+ require('__mocks__/component-mock')('rendering/HorizontalLayout'));
+jest.mock('rendering/Loop', () =>
+ require('__mocks__/component-mock')('rendering/Loop'));
+jest.mock('rendering/Pin', () =>
+ require('__mocks__/component-mock')('rendering/Pin'));
+jest.mock('rendering/Text', () =>
+ require('__mocks__/component-mock')('rendering/Text'));
+jest.mock('rendering/VerticalLayout', () =>
+ require('__mocks__/component-mock')('rendering/VerticalLayout'));
+
import React from 'react';
import { render } from 'react-testing-library';
import Render from 'components/Render';
const testType = (name, item) => {
- test.skip(name, () => {
+ test(name, () => {
const data = { type: 'SVG', children: [item] };
- const component = shallow(
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
};
describe('Render', () => {
- test.skip('debugging', () => {
+ test('debugging', () => {
const data = {
type: 'SVG',
children: [
@@ -34,10 +47,10 @@ describe('Render', () => {
}
]
};
- const component = shallow(
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
describe('types', () => {
From 07cd0a4799eb612f07573628b8e11157807b460c Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 21:19:46 -0400
Subject: [PATCH 26/28] Updating Form to use react-testing-library
---
.../Form/__snapshots__/test.js.snap | 93 ++++++++++---------
src/components/Form/index.js | 4 +-
src/components/Form/test.js | 78 +++++++---------
3 files changed, 86 insertions(+), 89 deletions(-)
diff --git a/src/components/Form/__snapshots__/test.js.snap b/src/components/Form/__snapshots__/test.js.snap
index 9f8b76b..7c7f8e2 100644
--- a/src/components/Form/__snapshots__/test.js.snap
+++ b/src/components/Form/__snapshots__/test.js.snap
@@ -1,53 +1,54 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Form rendering 1`] = `
-
+
`;
diff --git a/src/components/Form/index.js b/src/components/Form/index.js
index 896d817..99e6b51 100644
--- a/src/components/Form/index.js
+++ b/src/components/Form/index.js
@@ -54,8 +54,9 @@ class Form extends React.PureComponent {
const { expr, syntax } = this.state;
return
-
+
Display
diff --git a/src/components/Form/test.js b/src/components/Form/test.js
index a479a63..6f480dd 100644
--- a/src/components/Form/test.js
+++ b/src/components/Form/test.js
@@ -1,5 +1,9 @@
+jest.mock('react-feather/dist/icons/chevrons-down', () =>
+ require('__mocks__/component-mock')(
+ 'react-feather/dist/icons/chevrons-down'));
+
import React from 'react';
-import { render } from 'react-testing-library';
+import { render, fireEvent } from 'react-testing-library';
import { mockT } from 'i18n';
import { Form } from 'components/Form';
@@ -11,77 +15,67 @@ const syntaxList = [
const commonProps = { syntaxList, t: mockT };
describe('Form', () => {
- test.skip('rendering', () => {
- const component = shallow(
+ test('rendering', () => {
+ const { asFragment } = render(
Actions
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
describe('submitting expression', () => {
- test.skip('submitting form', () => {
+ test('submitting form', () => {
const onSubmit = jest.fn();
- const component = shallow(
+ const { getByTestId } = render(
);
- const exprInput = component.find('[name="expr"]');
- const syntaxInput = component.find('[name="syntax"]');
- exprInput.simulate('change', {
- target: {
- name: 'expr',
- value: 'Test expression'
- }
+ fireEvent.change(getByTestId('expr-input'), {
+ target: { value: 'Test expression' }
});
- syntaxInput.simulate('change', {
- target: {
- name: 'syntax',
- value: 'test'
- }
+ fireEvent.change(getByTestId('syntax-select'), {
+ target: { value: 'other' }
});
- const eventObj = { preventDefault: jest.fn() };
- component.find('form').simulate('submit', eventObj);
+ const event = new Event('submit');
+ jest.spyOn(event, 'preventDefault');
- expect(eventObj.preventDefault).toHaveBeenCalled();
+ fireEvent(getByTestId('form'), event);
+
+ expect(event.preventDefault).toHaveBeenCalled();
expect(onSubmit).toHaveBeenCalledWith({
expr: 'Test expression',
- syntax: 'test'
+ syntax: 'other'
});
});
- test.skip('submitting form with Shift+Enter', () => {
- const component = shallow(
-
+ test('submitting form with Shift+Enter', () => {
+ const onSubmit = jest.fn();
+ const { getByTestId } = render(
+
);
- const form = component.instance();
- const eventObj = {
- preventDefault: Function.prototype,
+
+ fireEvent.keyPress(getByTestId('expr-input'), {
charCode: 13,
shiftKey: true
- };
- jest.spyOn(form, 'handleSubmit');
- component.find('textarea').simulate('keypress', eventObj);
+ });
- expect(form.handleSubmit).toHaveBeenCalled();
+ expect(onSubmit).toHaveBeenCalled();
});
- test.skip('not submitting with just Enter', () => {
- const component = shallow(
-
+ test('not submitting with just Enter', () => {
+ const onSubmit = jest.fn();
+ const { getByTestId } = render(
+
);
- const form = component.instance();
- const eventObj = {
- preventDefault: Function.prototype,
+
+ fireEvent.keyPress(getByTestId('expr-input'), {
charCode: 13,
shiftKey: false
- };
- jest.spyOn(form, 'handleSubmit');
- component.find('textarea').simulate('keypress', eventObj);
+ });
- expect(form.handleSubmit).not.toHaveBeenCalled();
+ expect(onSubmit).not.toHaveBeenCalled();
});
});
});
From d46ce46b933da01a71d59f8c1e7fe471ac63b248 Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 21:31:59 -0400
Subject: [PATCH 27/28] Updating FormActions to use react-testing-library
---
.../FormActions/__snapshots__/test.js.snap | 330 ++++++++++--------
src/components/FormActions/test.js | 62 ++--
2 files changed, 212 insertions(+), 180 deletions(-)
diff --git a/src/components/FormActions/__snapshots__/test.js.snap b/src/components/FormActions/__snapshots__/test.js.snap
index e16f41c..b4bbe71 100644
--- a/src/components/FormActions/__snapshots__/test.js.snap
+++ b/src/components/FormActions/__snapshots__/test.js.snap
@@ -1,172 +1,196 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`FormActions rendering 1`] = `
-
+
+
+
`;
exports[`FormActions rendering download links 1`] = `
-
+
+
+
`;
exports[`FormActions rendering download links with data after mounting 1`] = `
-
+
+
+
`;
exports[`FormActions rendering download links with data after mounting 2`] = `
-
+
+
+
`;
exports[`FormActions rendering download links with data after mounting 3`] = `
-
+
+
+
`;
exports[`FormActions rendering with a permalink 1`] = `
-
+
+
+
`;
diff --git a/src/components/FormActions/test.js b/src/components/FormActions/test.js
index cb53f46..bb986b7 100644
--- a/src/components/FormActions/test.js
+++ b/src/components/FormActions/test.js
@@ -1,4 +1,10 @@
jest.mock('./links');
+jest.mock('react-feather/dist/icons/download', () =>
+ require('__mocks__/component-mock')(
+ 'react-feather/dist/icons/download'));
+jest.mock('react-feather/dist/icons/link', () =>
+ require('__mocks__/component-mock')(
+ 'react-feather/dist/icons/link'));
import React from 'react';
import { render } from 'react-testing-library';
@@ -21,68 +27,70 @@ createSvgLink.mockResolvedValue({
});
describe('FormActions', () => {
- test.skip('rendering', () => {
- const component = shallow(
+ test('rendering', () => {
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
- test.skip('rendering with a permalink', () => {
- const component = shallow(
+ test('rendering with a permalink', () => {
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
- test.skip('rendering download links', async () => {
+ test('rendering download links', async () => {
const imageDetails = {
svg: 'test image',
width: 10,
height: 20
};
- const component = shallow(
+ const { asFragment } = render(
);
// Give a beat for mocked promises to resolve
await new Promise(resolve => setTimeout(resolve));
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
- test.skip('rendering download links with data after mounting', async () => {
- const component = shallow(
+ test('rendering download links with data after mounting', async () => {
+ const { asFragment, rerender } = render(
);
- component.setProps({ permalinkUrl: 'http://example.com' });
+ rerender(
+
+ );
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
- component.setProps({
- imageDetails: {
- svg: 'test image'
- }
- });
+ rerender(
+
+ );
// Give a beat for mocked promises to resolve
await new Promise(resolve => setTimeout(resolve));
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
- component.setProps({
- imageDetails: {
- svg: 'test image',
- width: 10,
- height: 20
- }
- });
+ rerender(
+
+ );
// Give a beat for mocked promises to resolve
await new Promise(resolve => setTimeout(resolve));
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
});
From ead8927b0252102e8091f46f08d44221d2309ba9 Mon Sep 17 00:00:00 2001
From: Jeff Avallone
Date: Sun, 24 Mar 2019 21:48:57 -0400
Subject: [PATCH 28/28] Updating App to use react-testing-library
---
src/components/App/__snapshots__/test.js.snap | 432 ++++++++----------
src/components/App/test.js | 124 ++---
2 files changed, 238 insertions(+), 318 deletions(-)
diff --git a/src/components/App/__snapshots__/test.js.snap b/src/components/App/__snapshots__/test.js.snap
index cd1a630..57e33f4 100644
--- a/src/components/App/__snapshots__/test.js.snap
+++ b/src/components/App/__snapshots__/test.js.snap
@@ -1,293 +1,255 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`App removing rendered expression 1`] = `
-
-
+
-
-
-
+
+
-
+
`;
exports[`App removing rendered expression 2`] = `
-
-
+
-
+
`;
exports[`App rendering 1`] = `
-
-
+
-
+
`;
exports[`App rendering an expression 1`] = `
-
-
+
-
+
`;
exports[`App rendering an expression 2`] = `
-
-
+
-
-
+
+
`;
exports[`App rendering an expression 3`] = `
-
-
+
-
-
-
-
-`;
-
-exports[`App rendering image details 1`] = `
-
-
-
-
-
-
-`;
-
-exports[`App rendering image details 2`] = `
-
-
-
-
-
+
-
+
`;
exports[`App rendering with an invalid syntax 1`] = `
-
-
+
-
+
`;
exports[`App rendering with an invalid syntax 2`] = `
-
-
+
-
-
+
+
`;
exports[`App rendering with an invalid syntax 3`] = `
-
-
+
-
-
+
An error occurred while rendering the regular expression.
-
+
-
+
Retry
-
+
-
-
+
+
`;
diff --git a/src/components/App/test.js b/src/components/App/test.js
index 73255c9..6d66368 100644
--- a/src/components/App/test.js
+++ b/src/components/App/test.js
@@ -1,3 +1,12 @@
+jest.mock('components/Form', () =>
+ require('__mocks__/component-mock')('components/Form'));
+jest.mock('components/FormActions', () =>
+ require('__mocks__/component-mock')('components/FormActions'));
+jest.mock('components/Loader', () =>
+ require('__mocks__/component-mock')('components/Loader'));
+jest.mock('components/Message', () =>
+ require('__mocks__/component-mock')('components/Message'));
+
import React from 'react';
import { render } from 'react-testing-library';
@@ -7,7 +16,7 @@ import { App } from 'components/App';
jest.mock('syntax/js', () => ({
parse: expr => `PARSED(${ expr })`,
layout: parsed => `LAYOUT(${ parsed })`,
- Render: () => ''
+ Render: require('__mocks__/component-mock').buildMock(function Render() {})
}));
const syntaxList = [
@@ -17,116 +26,65 @@ const syntaxList = [
const commonProps = { syntaxList, t: mockT };
describe('App', () => {
- test.skip('rendering', () => {
- const component = shallow(
+ test('rendering', () => {
+ const { asFragment } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
- test.skip('rendering an expression', async () => {
- const component = shallow(
+ test('rendering an expression', async () => {
+ const { asFragment, rerender } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
- component.setProps({
- expr: 'test expression'
- });
+ rerender(
+
+ );
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
// Give a beat for module to load
await new Promise(resolve => setTimeout(resolve));
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
});
- test.skip('rendering with an invalid syntax', async () => {
+ test('rendering with an invalid syntax', async () => {
jest.spyOn(console, 'error').mockImplementation(() => {});
- const component = shallow(
+ const { asFragment, rerender } = render(
);
- expect(component).toMatchSnapshot();
+ expect(asFragment()).toMatchSnapshot();
- component.setProps({
- expr: 'test expression'
- });
-
- expect(component).toMatchSnapshot();
-
- // Give a beat for module to load
- await new Promise(resolve => setTimeout(resolve));
-
- expect(component).toMatchSnapshot();
- });
-
- test.skip('removing rendered expression', async () => {
- const component = shallow(
-
- );
-
- // Give a beat for module to load
- await new Promise(resolve => setTimeout(resolve));
-
- expect(component).toMatchSnapshot();
-
- component.setProps({
- expr: ''
- });
-
- expect(component).toMatchSnapshot();
- });
-
- test.skip('rendering image details', async () => {
- const component = shallow(
-
- );
-
- // Give a beat for module to load
- await new Promise(resolve => setTimeout(resolve));
-
- expect(component).toMatchSnapshot();
-
- component.instance().handleSvg({
- svg: 'test svg content'
- });
-
- expect(component).toMatchSnapshot();
- });
-
- test.skip('retrying expression rendering', () => {
- jest.spyOn(console, 'error').mockImplementation(() => {});
-
- const component = shallow(
+ rerender(
);
- const instance = component.instance();
- const event = { preventDefault: jest.fn() };
+ expect(asFragment()).toMatchSnapshot();
- jest.spyOn(instance, 'handleRender');
+ // Give a beat for module to load
+ await new Promise(resolve => setTimeout(resolve));
- instance.handleRetry(event);
-
- expect(event.preventDefault).toHaveBeenCalled();
- expect(instance.handleRender).toHaveBeenCalled();
+ expect(asFragment()).toMatchSnapshot();
});
- test.skip('submitting an expression to render', () => {
- const component = shallow(
+ test('removing rendered expression', async () => {
+ const { asFragment, rerender } = render(
+
+ );
+
+ // Give a beat for module to load
+ await new Promise(resolve => setTimeout(resolve));
+
+ expect(asFragment()).toMatchSnapshot();
+
+ rerender(
);
- const instance = component.instance();
-
- instance.handleSubmit({ syntax: 'test', expr: '' });
-
- expect(document.location.hash).toEqual('');
-
- instance.handleSubmit({ syntax: 'test', expr: 'test expression' });
-
- expect(document.location.hash).toEqual('#syntax=test&expr=test+expression');
+ expect(asFragment()).toMatchSnapshot();
});
});