Jest - destructure property-CodePudding

export const AppLayout: React.FunctionComponent = React.memo(({ children }) => {
  // Application main layout component name
  AppLayout.displayName = getComponentName('App-Layout');
  
  const { isAuthenticated } = useAuth();
  const { sendRequest } = useApiService();

  React.useEffect(() => {
    const fetchData = async () => {
      try {
        ...
      } catch (err) {
        console.error(err);
      }
    };
    isAuthenticated() && fetchData();
  }, []);

 describe('App General component', () => {
   const useAuth = jest.fn();
   const useApiService = jest.fn();

   const isAuthenticated = true;

   const props = {};

   const renderComponent = () => render(
     <AppLayout/>
   );

   it('should render without errors', () => {
     renderComponent();
   });

 /**
   * Validate current user exist in session
   * @returns {boolean}
   */
  const isAuthenticated = React.useCallback((): boolean => {
    return Boolean(user);
  }, [user]);

How can I set isAuthenticated to true so I can avoid the error

TypeError: Cannot destructure property 'isAuthenticated' of

CodePudding user response：

const mockUseAuthIsAuthenticated = jest.fn(() => false);
const mockUseAuth = jest.fn(() => ({
  isAuthenticated: mockUseAuthIsAuthenticated,
});

jest.mock("../hooks/useAuth", mockUseAuth);

describe('My test case', () => {
  it(`should return authenticated=TRUE`, () => {
    // Given
    mockUseAuthIsAuthenticated.mockImplementationOnce(
      () => true
    );

    // When
    // assuming `render` comes from the react testing-library
    render(<ComponentThatCallsTheHook />);

    // Then
    expect(mockUseAuthIsAuthenticated).toHaveBeenCalledOnce();
    // ... more expectations
  });
});

CodePudding user response：

You should mock the useAuth hook like this:

jest.mock("yourUseAuthPath", () => ({
  useAuth: () => ({
   isAuthenticated: () => true
  }),
}));

describe('App General component', () => {
...
}

n.b. You should replace the yourUseAuthPath with the correct path where you get the useAuth from. Example:

import { useAuth } from "yourUseAuthPath";

Some official docs here: https://jestjs.io/docs/mock-functions#mocking-partials