@hanzogui/react-native-web-internals 3.0.6 → 4.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/StyleSheet/__tests__/compiler-createReactDOMStyle-test.cjs +62 -37
- package/dist/cjs/StyleSheet/__tests__/compiler-test.cjs +129 -117
- package/dist/cjs/StyleSheet/__tests__/dom-createOrderedCSSStyleSheet-test.cjs +69 -30
- package/dist/cjs/StyleSheet/__tests__/index-test.cjs +127 -95
- package/dist/cjs/StyleSheet/__tests__/preprocess-test.cjs +26 -13
- package/dist/cjs/StyleSheet/__tests__/validate-test.cjs +30 -15
- package/dist/cjs/StyleSheet/compiler/createReactDOMStyle.cjs +141 -68
- package/dist/cjs/StyleSheet/compiler/hash.cjs +12 -10
- package/dist/cjs/StyleSheet/compiler/hyphenateStyleName.cjs +18 -14
- package/dist/cjs/StyleSheet/compiler/index.cjs +234 -173
- package/dist/cjs/StyleSheet/compiler/normalizeColor.cjs +27 -18
- package/dist/cjs/StyleSheet/compiler/normalizeValueWithProperty.cjs +30 -23
- package/dist/cjs/StyleSheet/compiler/resolveShadowValue.cjs +36 -32
- package/dist/cjs/StyleSheet/dom/createCSSStyleSheet.cjs +30 -15
- package/dist/cjs/StyleSheet/dom/createOrderedCSSStyleSheet.cjs +62 -37
- package/dist/cjs/StyleSheet/dom/index.cjs +56 -34
- package/dist/cjs/StyleSheet/index.cjs +25 -18
- package/dist/cjs/StyleSheet/preprocess.cjs +94 -81
- package/dist/cjs/StyleSheet/validate.cjs +67 -44
- package/dist/cjs/TextAncestorContext.cjs +13 -11
- package/dist/cjs/colorProps.cjs +22 -20
- package/dist/cjs/index.cjs +47 -45
- package/dist/cjs/modules/AccessibilityUtil/__tests__/propsToAccessibilityComponent-test.cjs +19 -12
- package/dist/cjs/modules/AccessibilityUtil/__tests__/propsToAriaRole-test.cjs +17 -11
- package/dist/cjs/modules/AccessibilityUtil/index.cjs +15 -13
- package/dist/cjs/modules/AccessibilityUtil/isDisabled.cjs +12 -10
- package/dist/cjs/modules/AccessibilityUtil/propsToAccessibilityComponent.cjs +45 -38
- package/dist/cjs/modules/AccessibilityUtil/propsToAriaRole.cjs +34 -30
- package/dist/cjs/modules/AssetRegistry/index.cjs +12 -10
- package/dist/cjs/modules/ImageLoader/index.cjs +117 -71
- package/dist/cjs/modules/InteractionManager.cjs +155 -99
- package/dist/cjs/modules/Platform/__tests__/index-test.cjs +21 -13
- package/dist/cjs/modules/Platform/index.cjs +12 -10
- package/dist/cjs/modules/TextInputState/index.cjs +28 -13
- package/dist/cjs/modules/UIManager/__tests__/index-test.cjs +77 -56
- package/dist/cjs/modules/UIManager/index.cjs +47 -42
- package/dist/cjs/modules/canUseDOM.cjs +13 -11
- package/dist/cjs/modules/createDOMProps/__tests__/index-test.cjs +75 -54
- package/dist/cjs/modules/createDOMProps/index.cjs +353 -145
- package/dist/cjs/modules/createEventHandle/__tests__/index-test.cjs +238 -160
- package/dist/cjs/modules/createEventHandle/index.cjs +46 -25
- package/dist/cjs/modules/dismissKeyboard/index.cjs +12 -10
- package/dist/cjs/modules/forwardedProps/index.cjs +137 -135
- package/dist/cjs/modules/getBoundingClientRect/index.cjs +18 -11
- package/dist/cjs/modules/invariant.cjs +21 -15
- package/dist/cjs/modules/isSelectionValid/index.cjs +18 -17
- package/dist/cjs/modules/isWebColor/index.cjs +12 -10
- package/dist/cjs/modules/mergeRefs/__tests__/index-test.cjs +21 -15
- package/dist/cjs/modules/mergeRefs/index.cjs +24 -21
- package/dist/cjs/modules/modality/__tests__/index-test.cjs +44 -17
- package/dist/cjs/modules/modality/index.cjs +148 -71
- package/dist/cjs/modules/multiplyStyleLengthValue/__tests__/index-test.cjs +18 -10
- package/dist/cjs/modules/multiplyStyleLengthValue/index.cjs +26 -20
- package/dist/cjs/modules/normalizeColor/index.cjs +22 -17
- package/dist/cjs/modules/pick/index.cjs +19 -11
- package/dist/cjs/modules/processColor/__tests__/index-test.cjs +43 -24
- package/dist/cjs/modules/processColor/index.cjs +32 -24
- package/dist/cjs/modules/requestIdleCallback/index.cjs +28 -26
- package/dist/cjs/modules/setValueForStyles/dangerousStyleValue.cjs +38 -18
- package/dist/cjs/modules/setValueForStyles/index.cjs +25 -14
- package/dist/cjs/modules/unitlessNumbers/index.cjs +68 -64
- package/dist/cjs/modules/useElementLayout/index.cjs +25 -20
- package/dist/cjs/modules/useEvent/__tests__/index-test.cjs +255 -173
- package/dist/cjs/modules/useEvent/index.cjs +40 -28
- package/dist/cjs/modules/useHover/__tests__/index-test.cjs +233 -124
- package/dist/cjs/modules/useHover/index.cjs +105 -62
- package/dist/cjs/modules/useLayoutEffect/index.cjs +26 -24
- package/dist/cjs/modules/useLocale/index.cjs +33 -30
- package/dist/cjs/modules/useLocale/isLocaleRTL.cjs +63 -58
- package/dist/cjs/modules/useMergeRefs/__tests__/index-test.cjs +54 -31
- package/dist/cjs/modules/useMergeRefs/index.cjs +26 -24
- package/dist/cjs/modules/usePlatformMethods/index.cjs +21 -14
- package/dist/cjs/modules/useStable/__tests__/index-test.cjs +60 -30
- package/dist/cjs/modules/useStable/index.cjs +29 -24
- package/dist/cjs/styleTypes.cjs +7 -5
- package/dist/cjs/types.cjs +7 -5
- package/dist/esm/StyleSheet/__tests__/compiler-createReactDOMStyle-test.mjs +53 -30
- package/dist/esm/StyleSheet/__tests__/compiler-createReactDOMStyle-test.mjs.map +1 -1
- package/dist/esm/StyleSheet/__tests__/compiler-test.mjs +129 -117
- package/dist/esm/StyleSheet/__tests__/compiler-test.mjs.map +1 -1
- package/dist/esm/StyleSheet/__tests__/dom-createOrderedCSSStyleSheet-test.mjs +60 -23
- package/dist/esm/StyleSheet/__tests__/dom-createOrderedCSSStyleSheet-test.mjs.map +1 -1
- package/dist/esm/StyleSheet/__tests__/index-test.mjs +118 -88
- package/dist/esm/StyleSheet/__tests__/index-test.mjs.map +1 -1
- package/dist/esm/StyleSheet/__tests__/preprocess-test.mjs +26 -13
- package/dist/esm/StyleSheet/__tests__/preprocess-test.mjs.map +1 -1
- package/dist/esm/StyleSheet/__tests__/validate-test.mjs +30 -15
- package/dist/esm/StyleSheet/__tests__/validate-test.mjs.map +1 -1
- package/dist/esm/StyleSheet/compiler/createReactDOMStyle.mjs +127 -56
- package/dist/esm/StyleSheet/compiler/createReactDOMStyle.mjs.map +1 -1
- package/dist/esm/StyleSheet/compiler/hyphenateStyleName.mjs +6 -4
- package/dist/esm/StyleSheet/compiler/hyphenateStyleName.mjs.map +1 -1
- package/dist/esm/StyleSheet/compiler/index.mjs +218 -159
- package/dist/esm/StyleSheet/compiler/index.mjs.map +1 -1
- package/dist/esm/StyleSheet/compiler/normalizeColor.mjs +13 -6
- package/dist/esm/StyleSheet/compiler/normalizeColor.mjs.map +1 -1
- package/dist/esm/StyleSheet/compiler/normalizeValueWithProperty.mjs +16 -11
- package/dist/esm/StyleSheet/compiler/normalizeValueWithProperty.mjs.map +1 -1
- package/dist/esm/StyleSheet/compiler/resolveShadowValue.mjs +22 -20
- package/dist/esm/StyleSheet/compiler/resolveShadowValue.mjs.map +1 -1
- package/dist/esm/StyleSheet/dom/createCSSStyleSheet.mjs +18 -5
- package/dist/esm/StyleSheet/dom/createCSSStyleSheet.mjs.map +1 -1
- package/dist/esm/StyleSheet/dom/createOrderedCSSStyleSheet.mjs +50 -27
- package/dist/esm/StyleSheet/dom/createOrderedCSSStyleSheet.mjs.map +1 -1
- package/dist/esm/StyleSheet/dom/index.mjs +41 -21
- package/dist/esm/StyleSheet/dom/index.mjs.map +1 -1
- package/dist/esm/StyleSheet/index.mjs +13 -8
- package/dist/esm/StyleSheet/index.mjs.map +1 -1
- package/dist/esm/StyleSheet/preprocess.mjs +80 -69
- package/dist/esm/StyleSheet/preprocess.mjs.map +1 -1
- package/dist/esm/StyleSheet/validate.mjs +55 -34
- package/dist/esm/StyleSheet/validate.mjs.map +1 -1
- package/dist/esm/TextAncestorContext.mjs +1 -1
- package/dist/esm/TextAncestorContext.mjs.map +1 -1
- package/dist/esm/colorProps.mjs +10 -10
- package/dist/esm/modules/AccessibilityUtil/__tests__/propsToAccessibilityComponent-test.mjs +10 -5
- package/dist/esm/modules/AccessibilityUtil/__tests__/propsToAccessibilityComponent-test.mjs.map +1 -1
- package/dist/esm/modules/AccessibilityUtil/__tests__/propsToAriaRole-test.mjs +8 -4
- package/dist/esm/modules/AccessibilityUtil/__tests__/propsToAriaRole-test.mjs.map +1 -1
- package/dist/esm/modules/AccessibilityUtil/propsToAccessibilityComponent.mjs +33 -28
- package/dist/esm/modules/AccessibilityUtil/propsToAccessibilityComponent.mjs.map +1 -1
- package/dist/esm/modules/AccessibilityUtil/propsToAriaRole.mjs +22 -20
- package/dist/esm/modules/AccessibilityUtil/propsToAriaRole.mjs.map +1 -1
- package/dist/esm/modules/ImageLoader/index.mjs +105 -61
- package/dist/esm/modules/ImageLoader/index.mjs.map +1 -1
- package/dist/esm/modules/InteractionManager.mjs +141 -87
- package/dist/esm/modules/InteractionManager.mjs.map +1 -1
- package/dist/esm/modules/Platform/__tests__/index-test.mjs +12 -6
- package/dist/esm/modules/Platform/__tests__/index-test.mjs.map +1 -1
- package/dist/esm/modules/TextInputState/index.mjs +16 -3
- package/dist/esm/modules/TextInputState/index.mjs.map +1 -1
- package/dist/esm/modules/UIManager/__tests__/index-test.mjs +68 -49
- package/dist/esm/modules/UIManager/__tests__/index-test.mjs.map +1 -1
- package/dist/esm/modules/UIManager/index.mjs +35 -32
- package/dist/esm/modules/UIManager/index.mjs.map +1 -1
- package/dist/esm/modules/canUseDOM.mjs +1 -1
- package/dist/esm/modules/canUseDOM.mjs.map +1 -1
- package/dist/esm/modules/createDOMProps/__tests__/index-test.mjs +66 -47
- package/dist/esm/modules/createDOMProps/__tests__/index-test.mjs.map +1 -1
- package/dist/esm/modules/createDOMProps/index.mjs +339 -133
- package/dist/esm/modules/createDOMProps/index.mjs.map +1 -1
- package/dist/esm/modules/createEventHandle/__tests__/index-test.mjs +222 -146
- package/dist/esm/modules/createEventHandle/__tests__/index-test.mjs.map +1 -1
- package/dist/esm/modules/createEventHandle/index.mjs +34 -15
- package/dist/esm/modules/createEventHandle/index.mjs.map +1 -1
- package/dist/esm/modules/forwardedProps/index.mjs +125 -125
- package/dist/esm/modules/forwardedProps/index.mjs.map +1 -1
- package/dist/esm/modules/getBoundingClientRect/index.mjs +6 -1
- package/dist/esm/modules/getBoundingClientRect/index.mjs.map +1 -1
- package/dist/esm/modules/invariant.mjs +9 -5
- package/dist/esm/modules/invariant.mjs.map +1 -1
- package/dist/esm/modules/isSelectionValid/index.mjs +6 -7
- package/dist/esm/modules/isSelectionValid/index.mjs.map +1 -1
- package/dist/esm/modules/mergeRefs/__tests__/index-test.mjs +8 -4
- package/dist/esm/modules/mergeRefs/__tests__/index-test.mjs.map +1 -1
- package/dist/esm/modules/mergeRefs/index.mjs +12 -11
- package/dist/esm/modules/mergeRefs/index.mjs.map +1 -1
- package/dist/esm/modules/modality/__tests__/index-test.mjs +42 -15
- package/dist/esm/modules/modality/__tests__/index-test.mjs.map +1 -1
- package/dist/esm/modules/modality/index.mjs +134 -59
- package/dist/esm/modules/modality/index.mjs.map +1 -1
- package/dist/esm/modules/multiplyStyleLengthValue/__tests__/index-test.mjs +9 -3
- package/dist/esm/modules/multiplyStyleLengthValue/__tests__/index-test.mjs.map +1 -1
- package/dist/esm/modules/multiplyStyleLengthValue/index.mjs +14 -10
- package/dist/esm/modules/multiplyStyleLengthValue/index.mjs.map +1 -1
- package/dist/esm/modules/normalizeColor/index.mjs +8 -5
- package/dist/esm/modules/normalizeColor/index.mjs.map +1 -1
- package/dist/esm/modules/pick/index.mjs +7 -1
- package/dist/esm/modules/pick/index.mjs.map +1 -1
- package/dist/esm/modules/processColor/__tests__/index-test.mjs +34 -17
- package/dist/esm/modules/processColor/__tests__/index-test.mjs.map +1 -1
- package/dist/esm/modules/processColor/index.mjs +8 -2
- package/dist/esm/modules/processColor/index.mjs.map +1 -1
- package/dist/esm/modules/requestIdleCallback/index.mjs +16 -16
- package/dist/esm/modules/requestIdleCallback/index.mjs.map +1 -1
- package/dist/esm/modules/setValueForStyles/dangerousStyleValue.mjs +24 -6
- package/dist/esm/modules/setValueForStyles/dangerousStyleValue.mjs.map +1 -1
- package/dist/esm/modules/setValueForStyles/index.mjs +13 -4
- package/dist/esm/modules/setValueForStyles/index.mjs.map +1 -1
- package/dist/esm/modules/unitlessNumbers/index.mjs +56 -54
- package/dist/esm/modules/unitlessNumbers/index.mjs.map +1 -1
- package/dist/esm/modules/useElementLayout/index.mjs +11 -8
- package/dist/esm/modules/useElementLayout/index.mjs.map +1 -1
- package/dist/esm/modules/useEvent/__tests__/index-test.mjs +240 -160
- package/dist/esm/modules/useEvent/__tests__/index-test.mjs.map +1 -1
- package/dist/esm/modules/useEvent/index.mjs +25 -15
- package/dist/esm/modules/useEvent/index.mjs.map +1 -1
- package/dist/esm/modules/useHover/__tests__/index-test.mjs +217 -110
- package/dist/esm/modules/useHover/__tests__/index-test.mjs.map +1 -1
- package/dist/esm/modules/useHover/index.mjs +90 -49
- package/dist/esm/modules/useHover/index.mjs.map +1 -1
- package/dist/esm/modules/useLocale/index.mjs +6 -5
- package/dist/esm/modules/useLocale/index.mjs.map +1 -1
- package/dist/esm/modules/useLocale/isLocaleRTL.mjs +51 -48
- package/dist/esm/modules/useLocale/isLocaleRTL.mjs.map +1 -1
- package/dist/esm/modules/useMergeRefs/__tests__/index-test.mjs +40 -19
- package/dist/esm/modules/useMergeRefs/__tests__/index-test.mjs.map +1 -1
- package/dist/esm/modules/usePlatformMethods/index.mjs +7 -2
- package/dist/esm/modules/usePlatformMethods/index.mjs.map +1 -1
- package/dist/esm/modules/useStable/__tests__/index-test.mjs +47 -19
- package/dist/esm/modules/useStable/__tests__/index-test.mjs.map +1 -1
- package/dist/esm/modules/useStable/index.mjs +5 -2
- package/dist/esm/modules/useStable/index.mjs.map +1 -1
- package/package.json +8 -8
- package/src/StyleSheet/compiler/normalizeColor.tsx +1 -1
|
@@ -2,13 +2,15 @@ var __create = Object.create;
|
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
4
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
-
var __getProtoOf = Object.getPrototypeOf
|
|
6
|
-
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
7
|
var __copyProps = (to, from, except, desc) => {
|
|
8
|
-
if (from && typeof from
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
8
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
9
|
+
for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
|
|
10
|
+
get: () => from[key],
|
|
11
|
+
enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
|
|
12
|
+
});
|
|
13
|
+
}
|
|
12
14
|
return to;
|
|
13
15
|
};
|
|
14
16
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
@@ -18,14 +20,14 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
|
|
|
18
20
|
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
19
21
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
|
|
20
22
|
value: mod,
|
|
21
|
-
enumerable:
|
|
23
|
+
enumerable: true
|
|
22
24
|
}) : target, mod));
|
|
23
|
-
var import_dom_event_testing_library = require("dom-event-testing-library")
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
25
|
+
var import_dom_event_testing_library = require("dom-event-testing-library");
|
|
26
|
+
var React = __toESM(require("react"), 1);
|
|
27
|
+
var ReactDOM = __toESM(require("react-dom"), 1);
|
|
28
|
+
var import_test_utils = require("react-dom/test-utils");
|
|
29
|
+
var import__ = __toESM(require("../index.cjs"), 1);
|
|
30
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
29
31
|
function createRoot(rootNode) {
|
|
30
32
|
return {
|
|
31
33
|
render(element) {
|
|
@@ -34,20 +36,29 @@ function createRoot(rootNode) {
|
|
|
34
36
|
};
|
|
35
37
|
}
|
|
36
38
|
describe("use-event", () => {
|
|
37
|
-
let root
|
|
39
|
+
let root;
|
|
40
|
+
let rootNode;
|
|
38
41
|
beforeEach(() => {
|
|
39
|
-
rootNode = document.createElement("div")
|
|
40
|
-
|
|
41
|
-
root
|
|
42
|
-
})
|
|
42
|
+
rootNode = document.createElement("div");
|
|
43
|
+
document.body.appendChild(rootNode);
|
|
44
|
+
root = createRoot(rootNode);
|
|
45
|
+
});
|
|
46
|
+
afterEach(() => {
|
|
47
|
+
root.render(null);
|
|
48
|
+
document.body.removeChild(rootNode);
|
|
49
|
+
rootNode = null;
|
|
50
|
+
root = null;
|
|
51
|
+
});
|
|
52
|
+
describe("setListener()", () => {
|
|
43
53
|
test("event dispatched on target", () => {
|
|
44
|
-
const listener = jest.fn()
|
|
45
|
-
|
|
54
|
+
const listener = jest.fn();
|
|
55
|
+
const targetRef = React.createRef();
|
|
46
56
|
function Component() {
|
|
47
57
|
const addClickListener = (0, import__.default)("click");
|
|
48
|
-
|
|
58
|
+
React.useEffect(() => {
|
|
49
59
|
addClickListener(targetRef.current, listener);
|
|
50
|
-
})
|
|
60
|
+
});
|
|
61
|
+
return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
51
62
|
ref: targetRef
|
|
52
63
|
});
|
|
53
64
|
}
|
|
@@ -57,20 +68,24 @@ describe("use-event", () => {
|
|
|
57
68
|
const target = (0, import_dom_event_testing_library.createEventTarget)(targetRef.current);
|
|
58
69
|
(0, import_test_utils.act)(() => {
|
|
59
70
|
target.click();
|
|
60
|
-
})
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
71
|
+
});
|
|
72
|
+
expect(listener).toBeCalledTimes(1);
|
|
73
|
+
});
|
|
74
|
+
test("event dispatched on parent", () => {
|
|
75
|
+
const listener = jest.fn();
|
|
76
|
+
const listenerCapture = jest.fn();
|
|
77
|
+
const targetRef = React.createRef();
|
|
78
|
+
const parentRef = React.createRef();
|
|
66
79
|
function Component() {
|
|
67
|
-
const addClickListener = (0, import__.default)("click")
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
addClickListener(targetRef.current, listener)
|
|
73
|
-
|
|
80
|
+
const addClickListener = (0, import__.default)("click");
|
|
81
|
+
const addClickCaptureListener = (0, import__.default)("click", {
|
|
82
|
+
capture: true
|
|
83
|
+
});
|
|
84
|
+
React.useEffect(() => {
|
|
85
|
+
addClickListener(targetRef.current, listener);
|
|
86
|
+
addClickCaptureListener(targetRef.current, listenerCapture);
|
|
87
|
+
});
|
|
88
|
+
return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
74
89
|
ref: parentRef,
|
|
75
90
|
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
76
91
|
ref: targetRef
|
|
@@ -83,25 +98,30 @@ describe("use-event", () => {
|
|
|
83
98
|
const parent = (0, import_dom_event_testing_library.createEventTarget)(parentRef.current);
|
|
84
99
|
(0, import_test_utils.act)(() => {
|
|
85
100
|
parent.click();
|
|
86
|
-
})
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
101
|
+
});
|
|
102
|
+
expect(listener).toBeCalledTimes(0);
|
|
103
|
+
expect(listenerCapture).toBeCalledTimes(0);
|
|
104
|
+
});
|
|
105
|
+
test("event dispatched on child", () => {
|
|
106
|
+
const log = [];
|
|
107
|
+
const listener = jest.fn(() => {
|
|
108
|
+
log.push("bubble");
|
|
109
|
+
});
|
|
110
|
+
const listenerCapture = jest.fn(() => {
|
|
111
|
+
log.push("capture");
|
|
112
|
+
});
|
|
113
|
+
const targetRef = React.createRef();
|
|
114
|
+
const childRef = React.createRef();
|
|
97
115
|
function Component() {
|
|
98
|
-
const addClickListener = (0, import__.default)("click")
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
addClickListener(targetRef.current, listener)
|
|
104
|
-
|
|
116
|
+
const addClickListener = (0, import__.default)("click");
|
|
117
|
+
const addClickCaptureListener = (0, import__.default)("click", {
|
|
118
|
+
capture: true
|
|
119
|
+
});
|
|
120
|
+
React.useEffect(() => {
|
|
121
|
+
addClickListener(targetRef.current, listener);
|
|
122
|
+
addClickCaptureListener(targetRef.current, listenerCapture);
|
|
123
|
+
});
|
|
124
|
+
return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
105
125
|
ref: targetRef,
|
|
106
126
|
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
107
127
|
ref: childRef
|
|
@@ -114,16 +134,21 @@ describe("use-event", () => {
|
|
|
114
134
|
const child = (0, import_dom_event_testing_library.createEventTarget)(childRef.current);
|
|
115
135
|
(0, import_test_utils.act)(() => {
|
|
116
136
|
child.click();
|
|
117
|
-
})
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
137
|
+
});
|
|
138
|
+
expect(listenerCapture).toBeCalledTimes(1);
|
|
139
|
+
expect(listener).toBeCalledTimes(1);
|
|
140
|
+
expect(log).toEqual(["capture", "bubble"]);
|
|
141
|
+
});
|
|
142
|
+
test("event dispatched on text node", () => {
|
|
143
|
+
const listener = jest.fn();
|
|
144
|
+
const targetRef = React.createRef();
|
|
145
|
+
const childRef = React.createRef();
|
|
122
146
|
function Component() {
|
|
123
147
|
const addClickListener = (0, import__.default)("click");
|
|
124
|
-
|
|
148
|
+
React.useEffect(() => {
|
|
125
149
|
addClickListener(targetRef.current, listener);
|
|
126
|
-
})
|
|
150
|
+
});
|
|
151
|
+
return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
127
152
|
ref: targetRef,
|
|
128
153
|
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
129
154
|
ref: childRef,
|
|
@@ -137,17 +162,20 @@ describe("use-event", () => {
|
|
|
137
162
|
const text = (0, import_dom_event_testing_library.createEventTarget)(childRef.current.firstChild);
|
|
138
163
|
(0, import_test_utils.act)(() => {
|
|
139
164
|
text.click();
|
|
140
|
-
})
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
165
|
+
});
|
|
166
|
+
expect(listener).toBeCalledTimes(1);
|
|
167
|
+
});
|
|
168
|
+
test("listener can be attached to document ", () => {
|
|
169
|
+
const listener = jest.fn();
|
|
170
|
+
const targetRef = React.createRef();
|
|
144
171
|
function Component({
|
|
145
172
|
target: target2
|
|
146
173
|
}) {
|
|
147
174
|
const addClickListener = (0, import__.default)("click");
|
|
148
|
-
|
|
175
|
+
React.useEffect(() => {
|
|
149
176
|
addClickListener(target2, listener);
|
|
150
|
-
})
|
|
177
|
+
});
|
|
178
|
+
return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
151
179
|
ref: targetRef
|
|
152
180
|
});
|
|
153
181
|
}
|
|
@@ -159,17 +187,20 @@ describe("use-event", () => {
|
|
|
159
187
|
const target = (0, import_dom_event_testing_library.createEventTarget)(targetRef.current);
|
|
160
188
|
(0, import_test_utils.act)(() => {
|
|
161
189
|
target.click();
|
|
162
|
-
})
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
190
|
+
});
|
|
191
|
+
expect(listener).toBeCalledTimes(1);
|
|
192
|
+
});
|
|
193
|
+
test("listener can be attached to window ", () => {
|
|
194
|
+
const listener = jest.fn();
|
|
195
|
+
const targetRef = React.createRef();
|
|
166
196
|
function Component({
|
|
167
197
|
target: target2
|
|
168
198
|
}) {
|
|
169
199
|
const addClickListener = (0, import__.default)("click");
|
|
170
|
-
|
|
200
|
+
React.useEffect(() => {
|
|
171
201
|
addClickListener(target2, listener);
|
|
172
|
-
})
|
|
202
|
+
});
|
|
203
|
+
return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
173
204
|
ref: targetRef
|
|
174
205
|
});
|
|
175
206
|
}
|
|
@@ -181,18 +212,21 @@ describe("use-event", () => {
|
|
|
181
212
|
const target = (0, import_dom_event_testing_library.createEventTarget)(targetRef.current);
|
|
182
213
|
(0, import_test_utils.act)(() => {
|
|
183
214
|
target.click();
|
|
184
|
-
})
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
215
|
+
});
|
|
216
|
+
expect(listener).toBeCalledTimes(1);
|
|
217
|
+
});
|
|
218
|
+
test("listener is replaceable", () => {
|
|
219
|
+
const listener = jest.fn();
|
|
220
|
+
const listenerAlt = jest.fn();
|
|
221
|
+
const targetRef = React.createRef();
|
|
189
222
|
function Component({
|
|
190
223
|
onClick
|
|
191
224
|
}) {
|
|
192
225
|
const addClickListener = (0, import__.default)("click");
|
|
193
|
-
|
|
226
|
+
React.useEffect(() => {
|
|
194
227
|
addClickListener(targetRef.current, onClick);
|
|
195
|
-
})
|
|
228
|
+
});
|
|
229
|
+
return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
196
230
|
ref: targetRef
|
|
197
231
|
});
|
|
198
232
|
}
|
|
@@ -204,79 +238,100 @@ describe("use-event", () => {
|
|
|
204
238
|
const target = (0, import_dom_event_testing_library.createEventTarget)(targetRef.current);
|
|
205
239
|
(0, import_test_utils.act)(() => {
|
|
206
240
|
target.click();
|
|
207
|
-
})
|
|
241
|
+
});
|
|
242
|
+
expect(listener).toBeCalledTimes(1);
|
|
243
|
+
(0, import_test_utils.act)(() => {
|
|
208
244
|
root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {
|
|
209
245
|
onClick: listenerAlt
|
|
210
246
|
}));
|
|
211
|
-
})
|
|
247
|
+
});
|
|
248
|
+
(0, import_test_utils.act)(() => {
|
|
212
249
|
target.click();
|
|
213
|
-
})
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
250
|
+
});
|
|
251
|
+
expect(listener).toBeCalledTimes(1);
|
|
252
|
+
expect(listenerAlt).toBeCalledTimes(1);
|
|
253
|
+
});
|
|
254
|
+
test("listener is removed when value is null", () => {
|
|
255
|
+
const listener = jest.fn();
|
|
256
|
+
const targetRef = React.createRef();
|
|
217
257
|
function Component({
|
|
218
258
|
off
|
|
219
259
|
}) {
|
|
220
260
|
const addClickListener = (0, import__.default)("click");
|
|
221
|
-
|
|
261
|
+
React.useEffect(() => {
|
|
222
262
|
addClickListener(targetRef.current, off ? null : listener);
|
|
223
|
-
})
|
|
263
|
+
});
|
|
264
|
+
return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
224
265
|
ref: targetRef
|
|
225
266
|
});
|
|
226
267
|
}
|
|
227
268
|
(0, import_test_utils.act)(() => {
|
|
228
269
|
root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {
|
|
229
|
-
off:
|
|
270
|
+
off: false
|
|
230
271
|
}));
|
|
231
272
|
});
|
|
232
273
|
const target = (0, import_dom_event_testing_library.createEventTarget)(targetRef.current);
|
|
233
274
|
(0, import_test_utils.act)(() => {
|
|
234
275
|
target.click();
|
|
235
|
-
})
|
|
276
|
+
});
|
|
277
|
+
expect(listener).toBeCalledTimes(1);
|
|
278
|
+
(0, import_test_utils.act)(() => {
|
|
236
279
|
root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {
|
|
237
|
-
off:
|
|
280
|
+
off: true
|
|
238
281
|
}));
|
|
239
|
-
})
|
|
282
|
+
});
|
|
283
|
+
listener.mockClear();
|
|
284
|
+
(0, import_test_utils.act)(() => {
|
|
240
285
|
target.click();
|
|
241
|
-
})
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
286
|
+
});
|
|
287
|
+
expect(listener).toBeCalledTimes(0);
|
|
288
|
+
});
|
|
289
|
+
test("custom event dispatched on target", () => {
|
|
290
|
+
const listener = jest.fn();
|
|
291
|
+
const targetRef = React.createRef();
|
|
245
292
|
function Component() {
|
|
246
293
|
const addMagicEventListener = (0, import__.default)("magic-event");
|
|
247
|
-
|
|
294
|
+
React.useEffect(() => {
|
|
248
295
|
addMagicEventListener(targetRef.current, listener);
|
|
249
|
-
})
|
|
296
|
+
});
|
|
297
|
+
return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
250
298
|
ref: targetRef
|
|
251
299
|
});
|
|
252
300
|
}
|
|
253
301
|
(0, import_test_utils.act)(() => {
|
|
254
302
|
root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {}));
|
|
255
|
-
})
|
|
303
|
+
});
|
|
304
|
+
(0, import_test_utils.act)(() => {
|
|
256
305
|
const event = new CustomEvent("magic-event", {
|
|
257
|
-
bubbles:
|
|
306
|
+
bubbles: true
|
|
258
307
|
});
|
|
259
308
|
targetRef.current.dispatchEvent(event);
|
|
260
|
-
})
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
309
|
+
});
|
|
310
|
+
expect(listener).toBeCalledTimes(1);
|
|
311
|
+
});
|
|
312
|
+
test("listeners can be set on multiple targets simultaneously", () => {
|
|
313
|
+
const log = [];
|
|
314
|
+
const targetRef = React.createRef();
|
|
315
|
+
const parentRef = React.createRef();
|
|
316
|
+
const childRef = React.createRef();
|
|
317
|
+
const listener = jest.fn(e => {
|
|
318
|
+
log.push(["bubble", e.currentTarget.id]);
|
|
319
|
+
});
|
|
320
|
+
const listenerCapture = jest.fn(e => {
|
|
321
|
+
log.push(["capture", e.currentTarget.id]);
|
|
322
|
+
});
|
|
272
323
|
function Component() {
|
|
273
|
-
const addClickListener = (0, import__.default)("click")
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
addClickListener(targetRef.current, listener)
|
|
279
|
-
|
|
324
|
+
const addClickListener = (0, import__.default)("click");
|
|
325
|
+
const addClickCaptureListener = (0, import__.default)("click", {
|
|
326
|
+
capture: true
|
|
327
|
+
});
|
|
328
|
+
React.useEffect(() => {
|
|
329
|
+
addClickListener(targetRef.current, listener);
|
|
330
|
+
addClickListener(parentRef.current, listener);
|
|
331
|
+
addClickCaptureListener(targetRef.current, listenerCapture);
|
|
332
|
+
addClickCaptureListener(parentRef.current, listenerCapture);
|
|
333
|
+
});
|
|
334
|
+
return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
280
335
|
id: "parent",
|
|
281
336
|
ref: parentRef,
|
|
282
337
|
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
@@ -294,35 +349,43 @@ describe("use-event", () => {
|
|
|
294
349
|
const child = (0, import_dom_event_testing_library.createEventTarget)(childRef.current);
|
|
295
350
|
(0, import_test_utils.act)(() => {
|
|
296
351
|
child.click();
|
|
297
|
-
})
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
352
|
+
});
|
|
353
|
+
expect(listenerCapture).toBeCalledTimes(2);
|
|
354
|
+
expect(listener).toBeCalledTimes(2);
|
|
355
|
+
expect(log).toEqual([["capture", "parent"], ["capture", "target"], ["bubble", "target"], ["bubble", "parent"]]);
|
|
356
|
+
});
|
|
357
|
+
test("listeners are specific to each event handle", () => {
|
|
358
|
+
const log = [];
|
|
359
|
+
const targetRef = React.createRef();
|
|
360
|
+
const childRef = React.createRef();
|
|
361
|
+
const listener = jest.fn(e => {
|
|
362
|
+
log.push(["bubble", "target"]);
|
|
363
|
+
});
|
|
364
|
+
const listenerAlt = jest.fn(e => {
|
|
365
|
+
log.push(["bubble", "target-alt"]);
|
|
366
|
+
});
|
|
367
|
+
const listenerCapture = jest.fn(e => {
|
|
368
|
+
log.push(["capture", "target"]);
|
|
369
|
+
});
|
|
370
|
+
const listenerCaptureAlt = jest.fn(e => {
|
|
371
|
+
log.push(["capture", "target-alt"]);
|
|
372
|
+
});
|
|
314
373
|
function Component() {
|
|
315
|
-
const addClickListener = (0, import__.default)("click")
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
addClickListener(targetRef.current, listener)
|
|
325
|
-
|
|
374
|
+
const addClickListener = (0, import__.default)("click");
|
|
375
|
+
const addClickAltListener = (0, import__.default)("click");
|
|
376
|
+
const addClickCaptureListener = (0, import__.default)("click", {
|
|
377
|
+
capture: true
|
|
378
|
+
});
|
|
379
|
+
const addClickCaptureAltListener = (0, import__.default)("click", {
|
|
380
|
+
capture: true
|
|
381
|
+
});
|
|
382
|
+
React.useEffect(() => {
|
|
383
|
+
addClickListener(targetRef.current, listener);
|
|
384
|
+
addClickAltListener(targetRef.current, listenerAlt);
|
|
385
|
+
addClickCaptureListener(targetRef.current, listenerCapture);
|
|
386
|
+
addClickCaptureAltListener(targetRef.current, listenerCaptureAlt);
|
|
387
|
+
});
|
|
388
|
+
return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
326
389
|
id: "target",
|
|
327
390
|
ref: targetRef,
|
|
328
391
|
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
@@ -336,38 +399,50 @@ describe("use-event", () => {
|
|
|
336
399
|
const child = (0, import_dom_event_testing_library.createEventTarget)(childRef.current);
|
|
337
400
|
(0, import_test_utils.act)(() => {
|
|
338
401
|
child.click();
|
|
339
|
-
})
|
|
402
|
+
});
|
|
403
|
+
expect(listenerCapture).toBeCalledTimes(1);
|
|
404
|
+
expect(listenerCaptureAlt).toBeCalledTimes(1);
|
|
405
|
+
expect(listener).toBeCalledTimes(1);
|
|
406
|
+
expect(listenerAlt).toBeCalledTimes(1);
|
|
407
|
+
expect(log).toEqual([["capture", "target"], ["capture", "target-alt"], ["bubble", "target"], ["bubble", "target-alt"]]);
|
|
340
408
|
});
|
|
341
|
-
})
|
|
409
|
+
});
|
|
410
|
+
describe("cleanup", () => {
|
|
342
411
|
test("removes all listeners for given event type from targets", () => {
|
|
343
412
|
const clickListener = jest.fn();
|
|
344
413
|
function Component() {
|
|
345
414
|
const addClickListener = (0, import__.default)("click");
|
|
346
|
-
|
|
415
|
+
React.useEffect(() => {
|
|
347
416
|
addClickListener(document, clickListener);
|
|
348
|
-
})
|
|
417
|
+
});
|
|
418
|
+
return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {});
|
|
349
419
|
}
|
|
350
420
|
(0, import_test_utils.act)(() => {
|
|
351
|
-
root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {}))
|
|
421
|
+
root.render(/* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {}));
|
|
422
|
+
root.render(null);
|
|
352
423
|
});
|
|
353
424
|
const target = (0, import_dom_event_testing_library.createEventTarget)(document);
|
|
354
425
|
(0, import_test_utils.act)(() => {
|
|
355
426
|
target.click();
|
|
356
|
-
})
|
|
427
|
+
});
|
|
428
|
+
expect(clickListener).toBeCalledTimes(0);
|
|
357
429
|
});
|
|
358
|
-
})
|
|
430
|
+
});
|
|
431
|
+
describe("stopPropagation and stopImmediatePropagation", () => {
|
|
359
432
|
test("stopPropagation works as expected", () => {
|
|
360
433
|
const childListener = jest.fn(e => {
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
434
|
+
e.stopPropagation();
|
|
435
|
+
});
|
|
436
|
+
const targetListener = jest.fn();
|
|
437
|
+
const targetRef = React.createRef();
|
|
438
|
+
const childRef = React.createRef();
|
|
366
439
|
function Component() {
|
|
367
440
|
const addClickListener = (0, import__.default)("click");
|
|
368
|
-
|
|
369
|
-
addClickListener(childRef.current, childListener)
|
|
370
|
-
|
|
441
|
+
React.useEffect(() => {
|
|
442
|
+
addClickListener(childRef.current, childListener);
|
|
443
|
+
addClickListener(targetRef.current, targetListener);
|
|
444
|
+
});
|
|
445
|
+
return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
371
446
|
ref: targetRef,
|
|
372
447
|
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
373
448
|
ref: childRef
|
|
@@ -380,19 +455,24 @@ describe("use-event", () => {
|
|
|
380
455
|
const child = (0, import_dom_event_testing_library.createEventTarget)(childRef.current);
|
|
381
456
|
(0, import_test_utils.act)(() => {
|
|
382
457
|
child.click();
|
|
383
|
-
})
|
|
384
|
-
|
|
458
|
+
});
|
|
459
|
+
expect(childListener).toBeCalledTimes(1);
|
|
460
|
+
expect(targetListener).toBeCalledTimes(0);
|
|
461
|
+
});
|
|
462
|
+
test("stopImmediatePropagation works as expected", () => {
|
|
385
463
|
const firstListener = jest.fn(e => {
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
464
|
+
e.stopImmediatePropagation();
|
|
465
|
+
});
|
|
466
|
+
const secondListener = jest.fn();
|
|
467
|
+
const targetRef = React.createRef();
|
|
390
468
|
function Component() {
|
|
391
|
-
const addFirstClickListener = (0, import__.default)("click")
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
addFirstClickListener(targetRef.current, firstListener)
|
|
395
|
-
|
|
469
|
+
const addFirstClickListener = (0, import__.default)("click");
|
|
470
|
+
const addSecondClickListener = (0, import__.default)("click");
|
|
471
|
+
React.useEffect(() => {
|
|
472
|
+
addFirstClickListener(targetRef.current, firstListener);
|
|
473
|
+
addSecondClickListener(targetRef.current, secondListener);
|
|
474
|
+
});
|
|
475
|
+
return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
|
|
396
476
|
ref: targetRef
|
|
397
477
|
});
|
|
398
478
|
}
|
|
@@ -402,7 +482,9 @@ describe("use-event", () => {
|
|
|
402
482
|
const target = (0, import_dom_event_testing_library.createEventTarget)(targetRef.current);
|
|
403
483
|
(0, import_test_utils.act)(() => {
|
|
404
484
|
target.click();
|
|
405
|
-
})
|
|
485
|
+
});
|
|
486
|
+
expect(firstListener).toBeCalledTimes(1);
|
|
487
|
+
expect(secondListener).toBeCalledTimes(0);
|
|
406
488
|
});
|
|
407
489
|
});
|
|
408
490
|
});
|