jest spyOn not working on index file, cannot redefine property

Question

I have UserContext and a hook useUser exported from src/app/context/user-context.tsx. Additionally I have an index.tsx file in src/app/context which exports all child modules.

If I spyOn src/app/context/user-context it works but changing the import to src/app/context I get:

TypeError: Cannot redefine property: useUser at Function.defineProperty (<anonymous>)

Why is that?

Source code:

// src/app/context/user-context.tsx

export const UserContext = React.createContext({});

export function useUser() {
  return useContext(UserContext);;
}

// src/app/context/index.tsx

export * from "./user-context";

// *.spec.tsx

// This works:
import * as UserContext from "src/app/context/user-context";

// This does not work:
// import * as UserContext from "src/app/context";

it("should render complete navigation when user is logged in", () => {

    jest.spyOn(UserContext, "useUser").mockReturnValue({
        user: mockUser,
        update: (user) => null,
        initialized: true,
    });
})

Answer 1

If you take a look at the js code produced for a re-export it looks like this

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _context = require("context");

Object.keys(_context).forEach(function (key) {
  if (key === "default" || key === "__esModule") return;
  if (key in exports && exports[key] === _context[key]) return;
  Object.defineProperty(exports, key, {
    enumerable: true,
    get: function get() {
      return _context[key];
    }
  });
});

and the error you get is due to the compiler not adding configurable: true in the options for defineProperty, which would allow jest to redefine the export to mock it, from docs

configurable

true if the type of this property descriptor may be changed and if the property may be deleted from the corresponding object. Defaults to false.

I think you could tweak your config somehow to make the compiler add that, but it all depends on the tooling you're using.

A more accessible approach would be using jest.mock instead of jest.spyOn to mock the user-context file rather than trying to redefine an unconfigurable export

it("should render complete navigation when user is logged in", () => {
  jest.mock('./user-context', () => {
    return {
      ...jest.requireActual('./user-context'),
      useUser: jest.fn().mockReturnValue({
        user: {},
        update: (user: any) => null,
        initialized: true
      })
    }
  })
});