From ecfddf149533ef9a499d97fb7e0027a841b08acb Mon Sep 17 00:00:00 2001 From: Lukas Elmer Date: Mon, 24 Jul 2023 13:37:39 +0200 Subject: [PATCH 1/2] Switch from global to globalThis globalThis has become a standard which is supported by all major platforms (as of 2023): https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/globalThis --- src/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/index.js b/src/index.js index 9707e97..32ec53a 100644 --- a/src/index.js +++ b/src/index.js @@ -4,7 +4,7 @@ import { useRef, useEffect } from 'react'; const useEventListener = ( eventName, handler, - element = global, + element = globalThis, options = {} ) => { const savedHandler = useRef(); From d0c115099f7d22201a02b169f8c521f6594b733e Mon Sep 17 00:00:00 2001 From: Lukas Elmer Date: Mon, 24 Jul 2023 13:43:01 +0200 Subject: [PATCH 2/2] Adjust documentation and tests --- README.md | 2 +- __tests__/index.test.js | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index 221988d..445b633 100644 --- a/README.md +++ b/README.md @@ -41,7 +41,7 @@ Here are the parameters that you can use. (\* = optional) | :---------- | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `eventName` | The event name (string). Here is a list of [common events](https://developer.mozilla.org/en-US/docs/Web/Events). | | `handler` | A function that will be called whenever `eventName` fires on `element`. | -| `element`\* | An optional element to listen on. Defaults to `global` (i.e., `window`). | +| `element`\* | An optional element to listen on. Defaults to `globalThis` (i.e., `window`). | | `options`\* | An object `{ capture?: boolean, passive?: boolean, once?: boolean }` to be passed to `addEventListener`. For advanced use cases. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener) for details. | ### Return diff --git a/__tests__/index.test.js b/__tests__/index.test.js index ce75de6..18e1ae5 100644 --- a/__tests__/index.test.js +++ b/__tests__/index.test.js @@ -41,9 +41,9 @@ describe('useEventListener', () => { addEventListenerSpy.mockRestore(); }); - test.skip('`element` is optional (defaults to `window`/`global`)', () => { + test.skip('`element` is optional (defaults to `window`/`globalThis`)', () => { const handler = jest.fn(); - const addEventListenerSpy = jest.spyOn(global, 'addEventListener'); + const addEventListenerSpy = jest.spyOn(globalThis, 'addEventListener'); renderHook(() => useEventListener('foo', handler)); @@ -54,7 +54,7 @@ describe('useEventListener', () => { test.skip('does not add event listener to `window` if `element` is `null`', () => { const handler = jest.fn(); - const addEventListenerSpy = jest.spyOn(global, 'addEventListener'); + const addEventListenerSpy = jest.spyOn(globalThis, 'addEventListener'); renderHook(() => useEventListener('foo', handler, null));