Something went wrong. Try again.
[READ-ONLY] Mirror of https://github.com/wojtekmaj/react-hooks. A collection of React Hooks.
hooks react react-hooks
Something went wrong. Try again.
2.7 kB · 105 lines
TypeScript
at main
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';import { renderHook } from 'vitest-browser-react';import { act } from 'react';
import useMutationObserverRef from './useMutationObserverRef.js';
import type { Mock } from 'vitest';
const itIfWindowDefined = it.runIf(typeof window !== 'undefined');
async function waitForAsync() { await new Promise((resolve) => { setTimeout(resolve, 0); });}
describe('useMutationObserverRef()', () => { const config = { childList: true, };
let observerCallback: MutationCallback; let observer: MutationObserver; let observe: Mock; let disconnect: Mock;
beforeEach(() => { if (typeof window !== 'undefined') { observe = vi.fn(); disconnect = vi.fn();
function MockMutationObserver(callback: MutationCallback) { observerCallback = callback; observer = { observe, disconnect, takeRecords: () => [], };
return observer; }
Object.defineProperty(window, 'MutationObserver', { configurable: true, enumerable: true, get: () => MockMutationObserver, });
vi.spyOn(window, 'MutationObserver'); } });
afterEach(() => { vi.clearAllMocks(); });
it('returns a ref callback and null initially', async () => { const { result } = await renderHook(() => useMutationObserverRef(config));
expect(result.current[0]).toBeInstanceOf(Function); expect(result.current[1]).toBe(null); });
itIfWindowDefined('observes the referenced element and returns its latest records', async () => { const element = document.createElement('div'); const { result } = await renderHook(() => useMutationObserverRef(config));
act(() => { result.current[0](element); });
await waitForAsync();
expect(window.MutationObserver).toHaveBeenCalledTimes(1); expect(window.MutationObserver).toHaveBeenCalledWith(expect.any(Function)); expect(observe).toHaveBeenCalledTimes(1); expect(observe).toHaveBeenCalledWith(element, config);
const childNodes = element.childNodes; const record = { addedNodes: childNodes, attributeName: null, attributeNamespace: null, nextSibling: null, oldValue: null, previousSibling: null, removedNodes: childNodes, target: element, type: 'childList', } satisfies MutationRecord; const records = [record];
act(() => { observerCallback(records, observer); });
expect(result.current[1]).toBe(records);
act(() => { result.current[0](null); });
expect(result.current[1]).toBe(null); });});