javascript - How to mock document.location.href in react jest unit test

Question

I have a simple redux action creator that sets the document.location.href = "/signin"

My action creator looks like this

export const signout = () => (dispatch) => {
    localStorage.removeItem("userInfo");
    localStorage.removeItem("cartItems");
    localStorage.removeItem("shippingAddress");
    dispatch({ type: USER_SIGNOUT });
    document.location.href = "/signin";
};

When I run my unit test for the signout action creator I'm seeing the following error:

console.error
  Error: Not implemented: navigation (except hash changes)
      at module.exports (/Users/jun1/Projects/web-client/node_modules/jsdom/lib/jsdom/browser/not-implemented.js:9:17)
      at navigateFetch (/Users/jun1/Projects/web-client/node_modules/jsdom/lib/jsdom/living/window/navigation.js:76:3)
      at exports.navigate (/Users/jun1/Projects/web-client/node_modules/jsdom/lib/jsdom/living/window/navigation.js:54:3)
      at LocationImpl._locationObjectNavigate (/Users/jun1/Projects/web-client/node_modules/jsdom/lib/jsdom/living/window/Location-impl.js:31:5)
      at LocationImpl._locationObjectSetterNavigate (/Users/jun1/Projects/web-client/node_modules/jsdom/lib/jsdom/living/window/Location-impl.js:25:17)
      at LocationImpl.set href [as href] (/Users/jun1/Projects/web-client/node_modules/jsdom/lib/jsdom/living/window/Location-impl.js:47:10)
      at Location.set href [as href] (/Users/jun1/Projects/web-client/node_modules/jsdom/lib/jsdom/living/generated/Location.js:121:37)
      at /Users/jun1/Projects/web-client/src/redux/actions/userActions.js:65:3
      at Object.dispatch (/Users/jun1/Projects/web-client/node_modules/redux-thunk/lib/index.js:11:18)
      at Object.<anonymous> (/Users/jun1/Projects/web-client/src/redux/actions/__test__/userActions.test.js:146:17) undefined

  at VirtualConsole.<anonymous> (node_modules/jsdom/lib/jsdom/virtual-console.js:29:45)
  at module.exports (node_modules/jsdom/lib/jsdom/browser/not-implemented.js:12:26)
  at navigateFetch (node_modules/jsdom/lib/jsdom/living/window/navigation.js:76:3)
  at exports.navigate (node_modules/jsdom/lib/jsdom/living/window/navigation.js:54:3)
  at LocationImpl._locationObjectNavigate (node_modules/jsdom/lib/jsdom/living/window/Location-impl.js:31:5)
  at LocationImpl._locationObjectSetterNavigate (node_modules/jsdom/lib/jsdom/living/window/Location-impl.js:25:17)
  at LocationImpl.set href [as href] (node_modules/jsdom/lib/jsdom/living/window/Location-impl.js:47:10)

My unit test looks like this:

describe("User sign out", () => {
  it("should sign user out", async (done) => {
    await store.dispatch(signout());

    const actions = store.getActions();
    expect(actions.length).toBe(1);
    expect(actions[0]).toMatchObject({ type: USER_SIGNOUT });

    expect(localStorage.removeItem).toHaveBeenCalledTimes(3);
    expect(document.location.href).toEqual("/signin");
    done();
  });

How can I get my test to pass and make the assertion expect(document.location.href).toEqual("/signin"); to pass and also make sure the above exception is not thrown

Answer 1

等待大神答复