玩笑因 TypeError 失败： (0 , _user.default) 不是函数

Question

我正在尝试测试App.jsx

import getUserInfo from './services/user';

const App = () => {

  const [isLoading, setIsLoading] = useState(true);
  const [user, setUser] = useState({
    firstName: 'First Name',
    lastName: 'Last Name',
  });

  useEffect(() => {
    getUserInfo()
      .then(({ Authorization: { FName, LName } }) => {
        setUser({
          firstName: FName,
          lastName: LName,
        });
        setIsLoading(false);
      })
      .catch((error) => {
        console.error(error);
        setIsLoading(false);
      });

  }, []);

  if (isLoading) {
    return (<h1>Loading!</h1>)
  } else {
    return (<h1>Finished Loading!</h1>)

export default App

还有user.js

export default const getUserInfo = async () => {
  return fetch(/getInfo, {});
};

还有App.test.jsx

import React from 'react'
import { render} from '@testing-library/react';
import App from '../src/App';
import getUserInfo from '../src/services/user'

jest.mock('../src/services/user', () => ({
  getUserInfo: () => Promise.resolve(
    {
      "Authorization": {
        "FName": "Test Name",
        "LName": "Test Last Name"
      }
    }
  )
}))

describe('<Loader/>', () => {
  it('renders', () => {
    render(<App />);
  })
})

但这个测试不起作用。 它返回：

    TypeError: (0 , _user.default) is not a function

      36 |
      37 |   useEffect(() => {
    > 38 |     getUserInfo()
         |     ^
      39 |       .then(({ Authorization: { FName, LName, userid } }) => {
      40 |         setUser({
      41 |           firstName: FName,

      at src/App.jsx:38:5
      at invokePassiveEffectCreate (node_modules/react-dom/cjs/react-dom.development.js:23487:20)
      at HTMLUnknownElement.callCallback (node_modules/react-dom/cjs/react-dom.development.js:3945:14)
      at HTMLUnknownElement.callTheUserObjectsOperation (node_modules/jsdom/lib/jsdom/living/generated/EventListener.js:26:30)
      at innerInvokeEventListeners (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:338:25)
      at invokeEventListeners (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:274:3)
      at HTMLUnknownElementImpl._dispatch (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:221:9)
      at HTMLUnknownElementImpl.dispatchEvent (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:94:17)
      at HTMLUnknownElement.dispatchEvent (node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:231:34)
      at Object.invokeGuardedCallbackDev (node_modules/react-dom/cjs/react-dom.development.js:3994:16)
      at invokeGuardedCallback (node_modules/react-dom/cjs/react-dom.development.js:4056:31)
      at flushPassiveEffectsImpl (node_modules/react-dom/cjs/react-dom.development.js:23574:9)
      at unstable_runWithPriority (node_modules/scheduler/cjs/scheduler.development.js:468:12)
      at runWithPriority$1 (node_modules/react-dom/cjs/react-dom.development.js:11276:10)
      at flushPassiveEffects (node_modules/react-dom/cjs/react-dom.development.js:23447:14)
      at Object.<anonymous>.flushWork (node_modules/react-dom/cjs/react-dom-test-utils.development.js:992:10)
      at act (node_modules/react-dom/cjs/react-dom-test-utils.development.js:1107:9)
      at render (node_modules/@testing-library/react/dist/pure.js:97:26)
      at Object.<anonymous> (tests/App.test.jsx:22:5)

  console.error
    Error: Uncaught [TypeError: (0 , _user.default) is not a function]
        at reportException (/Users/wvn179/Documents/Kirby/my-app/node_modules/jsdom/lib/jsdom/living/helpers/runtime-script-errors.js:66:24)
        at innerInvokeEventListeners (/Users/wvn179/Documents/Kirby/my-app/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:341:9)
        at invokeEventListeners (/Users/wvn179/Documents/Kirby/my-app/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:274:3)
        at HTMLUnknownElementImpl._dispatch (/Users/wvn179/Documents/Kirby/my-app/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:221:9)
        at HTMLUnknownElementImpl.dispatchEvent (/Users/wvn179/Documents/Kirby/my-app/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:94:17)
        at HTMLUnknownElement.dispatchEvent (/Users/wvn179/Documents/Kirby/my-app/node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:231:34)
        at Object.invokeGuardedCallbackDev (/Users/wvn179/Documents/Kirby/my-app/node_modules/react-dom/cjs/react-dom.development.js:3994:16)
        at invokeGuardedCallback (/Users/wvn179/Documents/Kirby/my-app/node_modules/react-dom/cjs/react-dom.development.js:4056:31)
        at flushPassiveEffectsImpl (/Users/wvn179/Documents/Kirby/my-app/node_modules/react-dom/cjs/react-dom.development.js:23574:9)
        at unstable_runWithPriority (/Users/wvn179/Documents/Kirby/my-app/node_modules/scheduler/cjs/scheduler.development.js:468:12) TypeError: (0 , _user.default) is not a function
        at /Users/wvn179/Documents/Kirby/my-app/src/App.jsx:38:5
        at invokePassiveEffectCreate (/Users/wvn179/Documents/Kirby/my-app/node_modules/react-dom/cjs/react-dom.development.js:23487:20)
        at HTMLUnknownElement.callCallback (/Users/wvn179/Documents/Kirby/my-app/node_modules/react-dom/cjs/react-dom.development.js:3945:14)
        at HTMLUnknownElement.callTheUserObjectsOperation (/Users/wvn179/Documents/Kirby/my-app/node_modules/jsdom/lib/jsdom/living/generated/EventListener.js:26:30)
        at innerInvokeEventListeners (/Users/wvn179/Documents/Kirby/my-app/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:338:25)
        at invokeEventListeners (/Users/wvn179/Documents/Kirby/my-app/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:274:3)
        at HTMLUnknownElementImpl._dispatch (/Users/wvn179/Documents/Kirby/my-app/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:221:9)
        at HTMLUnknownElementImpl.dispatchEvent (/Users/wvn179/Documents/Kirby/my-app/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:94:17)
        at HTMLUnknownElement.dispatchEvent (/Users/wvn179/Documents/Kirby/my-app/node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:231:34)
        at Object.invokeGuardedCallbackDev (/Users/wvn179/Documents/Kirby/my-app/node_modules/react-dom/cjs/react-dom.development.js:3994:16)
        at invokeGuardedCallback (/Users/wvn179/Documents/Kirby/my-app/node_modules/react-dom/cjs/react-dom.development.js:4056:31)
        at flushPassiveEffectsImpl (/Users/wvn179/Documents/Kirby/my-app/node_modules/react-dom/cjs/react-dom.development.js:23574:9)
        at unstable_runWithPriority (/Users/wvn179/Documents/Kirby/my-app/node_modules/scheduler/cjs/scheduler.development.js:468:12)
        at runWithPriority$1 (/Users/wvn179/Documents/Kirby/my-app/node_modules/react-dom/cjs/react-dom.development.js:11276:10)
        at flushPassiveEffects (/Users/wvn179/Documents/Kirby/my-app/node_modules/react-dom/cjs/react-dom.development.js:23447:14)
        at Object.<anonymous>.flushWork (/Users/wvn179/Documents/Kirby/my-app/node_modules/react-dom/cjs/react-dom-test-utils.development.js:992:10)
        at act (/Users/wvn179/Documents/Kirby/my-app/node_modules/react-dom/cjs/react-dom-test-utils.development.js:1107:9)
        at render (/Users/wvn179/Documents/Kirby/my-app/node_modules/@testing-library/react/dist/pure.js:97:26)
        at Object.<anonymous> (/Users/wvn179/Documents/Kirby/my-app/tests/App.test.jsx:22:5)
        at Object.asyncJestTest (/Users/wvn179/Documents/Kirby/my-app/node_modules/jest-jasmine2/build/jasmineAsyncInstall.js:106:37)
        at /Users/wvn179/Documents/Kirby/my-app/node_modules/jest-jasmine2/build/queueRunner.js:45:12
        at new Promise (<anonymous>)
        at mapper (/Users/wvn179/Documents/Kirby/my-app/node_modules/jest-jasmine2/build/queueRunner.js:28:19)
        at /Users/wvn179/Documents/Kirby/my-app/node_modules/jest-jasmine2/build/queueRunner.js:75:41
        at processTicksAndRejections (internal/process/task_queues.js:94:5)

      at VirtualConsole.<anonymous> (node_modules/jsdom/lib/jsdom/virtual-console.js:29:45)
      at reportException (node_modules/jsdom/lib/jsdom/living/helpers/runtime-script-errors.js:70:28)
      at innerInvokeEventListeners (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:341:9)
      at invokeEventListeners (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:274:3)
      at HTMLUnknownElementImpl._dispatch (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:221:9)
      at HTMLUnknownElementImpl.dispatchEvent (node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:94:17)

  console.error
    The above error occurred in the <App> component:
    
        at App (/Users/wvn179/Documents/Kirby/my-app/src/App.jsx:30:37)
    
    Consider adding an error boundary to your tree to customize error handling behavior.
    Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries.

      at logCapturedError (node_modules/react-dom/cjs/react-dom.development.js:20085:23)
      at update.callback (node_modules/react-dom/cjs/react-dom.development.js:20118:5)
      at callCallback (node_modules/react-dom/cjs/react-dom.development.js:12318:12)
      at commitUpdateQueue (node_modules/react-dom/cjs/react-dom.development.js:12339:9)
      at commitLifeCycles (node_modules/react-dom/cjs/react-dom.development.js:20736:11)
      at commitLayoutEffects (node_modules/react-dom/cjs/react-dom.development.js:23426:7)
      at HTMLUnknownElement.callCallback (node_modules/react-dom/cjs/react-dom.development.js:3945:14)

为什么会出现TypeError: (0 , _user.default) is not a function？导入是正确的，它确实是一个函数。我尝试过以其他方式模拟 getUserInfo() ，但它仍然失败。这里有什么问题？我认为它与useEffect 有关，因为在删除时，测试有效并且<App/> 呈现。

Answer 1

您正在模拟 ../src/services/user 内的命名导出，而不是默认导出尝试：

jest.mock('../src/services/user', () => Promise.resolve(
  {
    "Authorization": {
      FName": "Test Name",
     "LName": "Test Last Name"
    }
  }
))