@netdata/netdata-ui/dist/es6/components/input/use-focused-state.test.js

netdata UI kit

import { renderHook, act } from "testUtilities";
import { useFocusedState } from "./use-focused-state";
describe("useFocusedState", function () {
  it("returns initial focused state as false by default", function () {
    var _renderHook = renderHook(function () {
        return useFocusedState({});
      }),
      result = _renderHook.result;
    var _result$current = result.current,
      focused = _result$current[0];
    expect(focused).toBe(false);
  });
  it("returns custom default state", function () {
    var _renderHook2 = renderHook(function () {
        return useFocusedState({
          defaultState: true
        });
      }),
      result = _renderHook2.result;
    var _result$current2 = result.current,
      focused = _result$current2[0];
    expect(focused).toBe(true);
  });
  it("updates focused state on focus", function () {
    var _renderHook3 = renderHook(function () {
        return useFocusedState({});
      }),
      result = _renderHook3.result;
    var _result$current3 = result.current,
      handleFocus = _result$current3[1];
    act(function () {
      handleFocus({
        type: "focus"
      });
    });
    expect(result.current[0]).toBe(true);
  });
  it("updates focused state on blur", function () {
    var _renderHook4 = renderHook(function () {
        return useFocusedState({
          defaultState: true
        });
      }),
      result = _renderHook4.result;
    var _result$current4 = result.current,
      handleBlur = _result$current4[2];
    act(function () {
      handleBlur({
        type: "blur"
      });
    });
    expect(result.current[0]).toBe(false);
  });
  it("calls onFocus callback when provided", function () {
    var onFocus = jest.fn();
    var _renderHook5 = renderHook(function () {
        return useFocusedState({
          onFocus: onFocus
        });
      }),
      result = _renderHook5.result;
    var _result$current5 = result.current,
      handleFocus = _result$current5[1];
    var mockEvent = {
      type: "focus"
    };
    act(function () {
      handleFocus(mockEvent);
    });
    expect(onFocus).toHaveBeenCalledWith(mockEvent);
  });
  it("calls onBlur callback when provided", function () {
    var onBlur = jest.fn();
    var _renderHook6 = renderHook(function () {
        return useFocusedState({
          onBlur: onBlur
        });
      }),
      result = _renderHook6.result;
    var _result$current6 = result.current,
      handleBlur = _result$current6[2];
    var mockEvent = {
      type: "blur"
    };
    act(function () {
      handleBlur(mockEvent);
    });
    expect(onBlur).toHaveBeenCalledWith(mockEvent);
  });
  it("does not trigger focus when already focused", function () {
    var onFocus = jest.fn();
    var _renderHook7 = renderHook(function () {
        return useFocusedState({
          onFocus: onFocus,
          defaultState: true
        });
      }),
      result = _renderHook7.result;
    var _result$current7 = result.current,
      handleFocus = _result$current7[1];
    act(function () {
      handleFocus({
        type: "focus"
      });
    });
    expect(result.current[0]).toBe(true);
    expect(onFocus).toHaveBeenCalledTimes(1);
  });
  it("maintains stable function references", function () {
    var _renderHook8 = renderHook(function () {
        return useFocusedState({});
      }),
      result = _renderHook8.result,
      rerender = _renderHook8.rerender;
    var _result$current8 = result.current,
      initialHandleFocus = _result$current8[1],
      initialHandleBlur = _result$current8[2];
    rerender();
    var _result$current9 = result.current,
      newHandleFocus = _result$current9[1],
      newHandleBlur = _result$current9[2];
    expect(newHandleFocus).toBe(initialHandleFocus);
    expect(newHandleBlur).toBe(initialHandleBlur);
  });
  it("updates callbacks when dependencies change", function () {
    var onFocus = jest.fn();
    var _renderHook9 = renderHook(function (_ref) {
        var onFocus = _ref.onFocus;
        return useFocusedState({
          onFocus: onFocus
        });
      }, {
        initialProps: {
          onFocus: onFocus
        }
      }),
      result = _renderHook9.result,
      rerender = _renderHook9.rerender;
    var newOnFocus = jest.fn();
    rerender({
      onFocus: newOnFocus
    });
    var _result$current10 = result.current,
      handleFocus = _result$current10[1];
    act(function () {
      handleFocus({
        type: "focus"
      });
    });
    expect(onFocus).not.toHaveBeenCalled();
    expect(newOnFocus).toHaveBeenCalledTimes(1);
  });
});