commit 045cd4bf9f76846718fdd105829db4f2f3d3e9fe
parent 7c17876c4c6fd41f82586cc88556a63305c07097
Author: Sebastian <sebasjm@gmail.com>
Date: Thu, 11 Feb 2021 14:07:28 -0300
test hooks example
Diffstat:
5 files changed, 99 insertions(+), 8 deletions(-)
diff --git a/package.json b/package.json
@@ -42,6 +42,8 @@
"@storybook/addon-links": "^6.1.16",
"@storybook/preact": "^6.1.16",
"@storybook/preset-scss": "^1.0.3",
+ "@testing-library/preact": "^2.0.1",
+ "@testing-library/preact-hooks": "^1.1.0",
"@types/enzyme": "^3.10.5",
"@types/jest": "^26.0.8",
"@typescript-eslint/eslint-plugin": "^2.25.0",
diff --git a/src/hooks/notifications.ts b/src/hooks/notifications.ts
@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useState } from "preact/hooks";
import { Notification } from '../declaration';
interface Result {
@@ -6,14 +6,14 @@ interface Result {
pushNotification: (n: Notification) => void;
}
-export function useNotifications(): Result {
- const [notifications, setNotifications] = useState<(Notification & {since: Date})[]>([])
+export function useNotifications(timeout = 2000): Result {
+ const [notifications, setNotifications] = useState<(Notification & { since: Date })[]>([])
const pushNotification = (n: Notification): void => {
- const entry = {...n, since: new Date() }
+ const entry = { ...n, since: new Date() }
setNotifications(ns => [...ns, entry])
- setTimeout(()=>{
+ setTimeout(() => {
setNotifications(ns => ns.filter(x => x.since !== entry.since))
- }, 2000)
+ }, timeout)
}
- return {notifications, pushNotification}
+ return { notifications, pushNotification }
}
diff --git a/tests/__mocks__/setupTests.ts b/tests/__mocks__/setupTests.ts
@@ -1,3 +1,4 @@
+import 'regenerator-runtime/runtime'
import { configure } from 'enzyme';
import Adapter from 'enzyme-adapter-preact-pure';
diff --git a/tests/hooks/notification.test.ts b/tests/hooks/notification.test.ts
@@ -0,0 +1,31 @@
+import { renderHook, act} from '@testing-library/preact-hooks';
+import { useNotifications } from '../../src/hooks/notifications';
+
+jest.useFakeTimers()
+
+test('notification should disapear after timeout', () => {
+ jest.spyOn(global, 'setTimeout');
+
+ const timeout = 1000
+ const { result, rerender } = renderHook(() => useNotifications(timeout));
+
+ expect(result.current?.notifications.length).toBe(0);
+
+ act(() => {
+ result.current?.pushNotification({
+ description: 'desc',
+ title: 'title',
+ type: 'INFO'
+ });
+ });
+ expect(result.current?.notifications.length).toBe(1);
+
+ jest.advanceTimersByTime(timeout/2);
+ rerender()
+ expect(result.current?.notifications.length).toBe(1);
+
+ jest.advanceTimersByTime(timeout);
+ rerender()
+ expect(result.current?.notifications.length).toBe(0);
+
+});
diff --git a/yarn.lock b/yarn.lock
@@ -960,6 +960,14 @@
pirates "^4.0.0"
source-map-support "^0.5.16"
+"@babel/runtime-corejs3@^7.10.2":
+ version "7.12.13"
+ resolved "https://registry.yarnpkg.com/@babel/runtime-corejs3/-/runtime-corejs3-7.12.13.tgz#53d09813b7c20d616caf258e9325550ff701c039"
+ integrity sha512-8fSpqYRETHATtNitsCXq8QQbKJP31/KnDl2Wz2Vtui9nKzjss2ysuZtyVsWjBtvkeEFo346gkwjYPab1hvrXkQ==
+ dependencies:
+ core-js-pure "^3.0.0"
+ regenerator-runtime "^0.13.4"
+
"@babel/runtime@^7.0.0", "@babel/runtime@^7.10.2", "@babel/runtime@^7.10.5", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.5", "@babel/runtime@^7.3.1", "@babel/runtime@^7.5.0", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.4":
version "7.12.13"
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.12.13.tgz#0a21452352b02542db0ffb928ac2d3ca7cb6d66d"
@@ -2087,11 +2095,42 @@
dependencies:
defer-to-connect "^1.0.1"
+"@testing-library/dom@^7.16.2":
+ version "7.29.4"
+ resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-7.29.4.tgz#1647c2b478789621ead7a50614ad81ab5ae5b86c"
+ integrity sha512-CtrJRiSYEfbtNGtEsd78mk1n1v2TUbeABlNIcOCJdDfkN5/JTOwQEbbQpoSRxGqzcWPgStMvJ4mNolSuBRv1NA==
+ dependencies:
+ "@babel/code-frame" "^7.10.4"
+ "@babel/runtime" "^7.12.5"
+ "@types/aria-query" "^4.2.0"
+ aria-query "^4.2.2"
+ chalk "^4.1.0"
+ dom-accessibility-api "^0.5.4"
+ lz-string "^1.4.4"
+ pretty-format "^26.6.2"
+
+"@testing-library/preact-hooks@^1.1.0":
+ version "1.1.0"
+ resolved "https://registry.yarnpkg.com/@testing-library/preact-hooks/-/preact-hooks-1.1.0.tgz#f4e197ec77b295ce6c122c560c46b5b03bc4f015"
+ integrity sha512-+JIor+NsOHkK3oIrwMDGKGHXTN0JJi462dBJlj4FNbGaDPTlctE6eu2ranWQirh7/FJMkWfzQCP+tk7jmY8ZrQ==
+
+"@testing-library/preact@^2.0.1":
+ version "2.0.1"
+ resolved "https://registry.yarnpkg.com/@testing-library/preact/-/preact-2.0.1.tgz#c69200b16c4eda58986c8d65e1043ad9cbe409d3"
+ integrity sha512-79kwVOY+3caoLgaPbiPzikjgY0Aya7Fc7TvGtR1upCnz2wrtmPDnN2t9vO7I7vDP2zoA+feSwOH5Q0BFErhaaQ==
+ dependencies:
+ "@testing-library/dom" "^7.16.2"
+
"@types/anymatch@*":
version "1.3.1"
resolved "https://registry.yarnpkg.com/@types/anymatch/-/anymatch-1.3.1.tgz#336badc1beecb9dacc38bea2cf32adf627a8421a"
integrity sha512-/+CRPXpBDpo2RK9C68N3b2cOvO0Cf5B9aPijHsoDQTHivnGSObdOF2BRQOYjojWTDy6nQvMjmqRXIxH55VjxxA==
+"@types/aria-query@^4.2.0":
+ version "4.2.1"
+ resolved "https://registry.yarnpkg.com/@types/aria-query/-/aria-query-4.2.1.tgz#78b5433344e2f92e8b306c06a5622c50c245bf6b"
+ integrity sha512-S6oPal772qJZHoRZLFc/XoZW2gFvwXusYUmXPXkgxJLuEk2vOt7jc4Yo6z/vtI0EBkbPBVrJJ0B+prLIKiWqHg==
+
"@types/babel__core@^7.0.0", "@types/babel__core@^7.1.7":
version "7.1.12"
resolved "https://registry.yarnpkg.com/@types/babel__core/-/babel__core-7.1.12.tgz#4d8e9e51eb265552a7e4f1ff2219ab6133bdfb2d"
@@ -2871,6 +2910,14 @@ argparse@^1.0.7:
dependencies:
sprintf-js "~1.0.2"
+aria-query@^4.2.2:
+ version "4.2.2"
+ resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-4.2.2.tgz#0d2ca6c9aceb56b8977e9fed6aed7e15bbd2f83b"
+ integrity sha512-o/HelwhuKpTj/frsOsbNLNgnNGVIFsVP/SW2BSF14gVl7kAfMOJ6/8wUAUvG1R1NHKrfG+2sHZTu0yauT1qBrA==
+ dependencies:
+ "@babel/runtime" "^7.10.2"
+ "@babel/runtime-corejs3" "^7.10.2"
+
arr-diff@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-4.0.0.tgz#d6461074febfec71e7e15235761a329a5dc7c520"
@@ -4632,7 +4679,7 @@ core-js-compat@^3.8.0:
browserslist "^4.16.1"
semver "7.0.0"
-core-js-pure@^3.0.1:
+core-js-pure@^3.0.0, core-js-pure@^3.0.1:
version "3.8.3"
resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.8.3.tgz#10e9e3b2592ecaede4283e8f3ad7020811587c02"
integrity sha512-V5qQZVAr9K0xu7jXg1M7qTEwuxUgqr7dUOezGaNa7i+Xn9oXAU/d1fzqD9ObuwpVQOaorO5s70ckyi1woP9lVA==
@@ -5352,6 +5399,11 @@ doctrine@^3.0.0:
dependencies:
esutils "^2.0.2"
+dom-accessibility-api@^0.5.4:
+ version "0.5.4"
+ resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.4.tgz#b06d059cdd4a4ad9a79275f9d414a5c126241166"
+ integrity sha512-TvrjBckDy2c6v6RLxPv5QXOnU+SmF9nBII5621Ve5fu6Z/BDrENurBEvlC1f44lKEUVqOpK4w9E5Idc5/EgkLQ==
+
dom-converter@^0.2:
version "0.2.0"
resolved "https://registry.yarnpkg.com/dom-converter/-/dom-converter-0.2.0.tgz#6721a9daee2e293682955b6afe416771627bb768"
@@ -9164,6 +9216,11 @@ lru-cache@^6.0.0:
dependencies:
yallist "^4.0.0"
+lz-string@^1.4.4:
+ version "1.4.4"
+ resolved "https://registry.yarnpkg.com/lz-string/-/lz-string-1.4.4.tgz#c0d8eaf36059f705796e1e344811cf4c498d3a26"
+ integrity sha1-wNjq82BZ9wV5bh40SBHPTEmNOiY=
+
magic-string@^0.25.0, magic-string@^0.25.7:
version "0.25.7"
resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.25.7.tgz#3f497d6fd34c669c6798dcb821f2ef31f5445051"
