Add useActiveNode test

src/hooks/use-active-node.test.js

@@ -0,0 +1,84 @@
+import React, { useState } from 'react';
+import '@testing-library/jest-dom';
+import {
+  render,
+  fireEvent,
+  createEvent,
+  screen,
+  act,
+} from '@testing-library/react';
+import {
+  FocusRoot,
+  FocusNode,
+  useFocusStoreDangerously,
+  useActiveNode,
+} from '../index';
+
+describe('useActiveNode', () => {
+  it('returns the expected node', (done) => {
+    let focusStore;
+    let activeNode;
+
+    function TestComponent() {
+      focusStore = useFocusStoreDangerously();
+      activeNode = useActiveNode();
+
+      return (
+        <>
+          <FocusNode focusId="nodeA" data-testid="nodeA" />
+          <FocusNode focusId="nodeB" data-testid="nodeB" />
+        </>
+      );
+    }
+
+    render(
+      <FocusRoot pointerEvents>
+        <TestComponent />
+      </FocusRoot>
+    );
+
+    let focusState = focusStore.getState();
+    expect(focusState.focusedNodeId).toEqual('nodeA');
+    expect(focusState.focusHierarchy).toEqual(['root', 'nodeA']);
+    expect(activeNode).toEqual(null);
+
+    fireEvent.keyDown(window, {
+      code: 'ArrowRight',
+      key: 'ArrowRight',
+    });
+
+    focusState = focusStore.getState();
+    expect(focusState.focusedNodeId).toEqual('nodeB');
+    expect(focusState.focusHierarchy).toEqual(['root', 'nodeB']);
+
+    fireEvent.mouseMove(window);
+
+    requestAnimationFrame(() => {
+      const nodeA = screen.getByTestId('nodeA');
+      const nodeB = screen.getByTestId('nodeB');
+
+      fireEvent.mouseOver(nodeB);
+
+      const clickEventB = createEvent.click(nodeB, { button: 0 });
+      fireEvent(nodeB, clickEventB);
+
+      focusState = focusStore.getState();
+      expect(activeNode).toBe(focusState.nodes.nodeB);
+
+      fireEvent.mouseOver(nodeA);
+
+      focusState = focusStore.getState();
+      expect(focusState.focusedNodeId).toEqual('nodeA');
+      expect(focusState.focusHierarchy).toEqual(['root', 'nodeA']);
+      expect(activeNode).toBe(focusState.nodes.nodeB);
+
+      const clickEventA = createEvent.click(nodeA, { button: 0 });
+      fireEvent(nodeA, clickEventA);
+
+      focusState = focusStore.getState();
+      expect(activeNode).toBe(focusState.nodes.nodeA);
+
+      done();
+    });
+  });
+});

src/hooks/use-focus-events.test.js

@@ -299,7 +299,6 @@ describe('useFocusEvents', () => {
         expect(nodeBOnActive.mock.calls.length).toBe(1);
         expect(nodeBOnInactive.mock.calls.length).toBe(0);
 
-        // Okay
         fireEvent.mouseOver(nodeA);
 
         focusState = focusStore.getState();

src/hooks/use-focus-node.test.js

@@ -56,4 +56,27 @@ describe('useFocusNode', () => {
 
     expect(focusNode).toBe(focusStore.getState().nodes.nodeA);
   });
+
+  it('returns null if the node does not exist', () => {
+    let focusNode;
+
+    function TestComponent() {
+      focusNode = useFocusNode('nodeABC');
+
+      return (
+        <>
+          <FocusNode focusId="nodeA" data-testid="nodeA" />
+          <FocusNode focusId="nodeB" data-testid="nodeB" />
+        </>
+      );
+    }
+
+    render(
+      <FocusRoot>
+        <TestComponent />
+      </FocusRoot>
+    );
+
+    expect(focusNode).toEqual(null);
+  });
 });