Skip to content

Commit b51848b

Browse files
committed
test(glow): add useGlowEffect hook tests
1 parent e9da96e commit b51848b

1 file changed

Lines changed: 66 additions & 0 deletions

File tree

hooks/useGlowEffect.test.ts

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
import { renderHook } from '@testing-library/react';
2+
import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
3+
import { useGlowEffect } from './useGlowEffect';
4+
5+
class MockResizeObserver {
6+
observe = vi.fn();
7+
unobserve = vi.fn();
8+
disconnect = vi.fn();
9+
}
10+
11+
describe('useGlowEffect', () => {
12+
beforeEach(() => {
13+
vi.stubGlobal('ResizeObserver', MockResizeObserver);
14+
vi.spyOn(window, 'requestAnimationFrame').mockImplementation((callback) => {
15+
callback(0);
16+
return 1;
17+
});
18+
vi.spyOn(window, 'cancelAnimationFrame').mockImplementation(() => {});
19+
});
20+
21+
afterEach(() => {
22+
vi.restoreAllMocks();
23+
vi.unstubAllGlobals();
24+
});
25+
26+
it('returns the public API for the glow effect', () => {
27+
const { result } = renderHook(() => useGlowEffect());
28+
29+
expect(result.current.shellRef).toBeDefined();
30+
expect(result.current.shellVars).toBeDefined();
31+
expect(result.current.handleMouseEnter).toEqual(expect.any(Function));
32+
expect(result.current.handleMouseMove).toEqual(expect.any(Function));
33+
expect(result.current.handleMouseLeave).toEqual(expect.any(Function));
34+
});
35+
36+
it('returns CSS variable keys in shellVars', () => {
37+
const { result } = renderHook(() => useGlowEffect());
38+
39+
expect(result.current.shellVars).toHaveProperty('--mx');
40+
expect(result.current.shellVars).toHaveProperty('--my');
41+
expect(result.current.shellVars).toHaveProperty('--glow-opacity');
42+
expect(result.current.shellVars).toHaveProperty('--border-opacity');
43+
});
44+
45+
it('defaults glow opacity to 0', () => {
46+
const { result } = renderHook(() => useGlowEffect());
47+
48+
expect(result.current.shellVars['--glow-opacity']).toBe('0');
49+
});
50+
51+
it('cancels animation frame on unmount after pointer movement', () => {
52+
const cancelAnimationFrameSpy = vi.spyOn(window, 'cancelAnimationFrame');
53+
54+
const { result, unmount } = renderHook(() => useGlowEffect());
55+
56+
result.current.handleMouseMove({
57+
clientX: 100,
58+
clientY: 50,
59+
currentTarget: document.createElement('div'),
60+
} as unknown as React.MouseEvent<HTMLDivElement>);
61+
62+
unmount();
63+
64+
expect(cancelAnimationFrameSpy).toHaveBeenCalled();
65+
});
66+
});

0 commit comments

Comments
 (0)