jeast spy인덱스 파일에서 작동하지 않으므로 속성을 재정의할 수 없습니다.

jeast spy인덱스 파일에서 작동하지 않으므로 속성을 재정의할 수 없습니다.

있습니다UserContext그리고 갈고리useUser에서 내보낸src/app/context/user-context.tsx또한 index.tsx 파일도 있습니다.src/app/context모든 자모듈을 내보냅니다.

감시하는 경우src/app/context/user-context동작하지만 Import를 로 변경합니다.src/app/context이해:

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

왜 그런 것일까요?

소스 코드:

// 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,
    });
})

사용방법에 동의할 수 없습니다.jest.mock()대신spyOn()(여기)가 좋은 해결책입니다.이 방법에서는 스펙 파일 상단에 있는 모든 기능을 한 번 시뮬레이션해야 합니다.

그러나 일부 테스트 케이스는 다른 설정이 필요하거나 실제 상태를 유지할 수 있습니다.

어쨌든 계속 쓰고 싶다spyOn().

더 나은 방법은 스펙 파일 상단에 다음 행을 추가하는 것입니다(가져오기 직후와 이전).describe()).

import * as Foo from 'path/to/file'; 

jest.mock('path/to/file', () => {
  return {
    __esModule: true,    //    <----- this __esModule: true is important
    ...jest.requireActual('path/to/file')
  };
});

...

//just do a normal spyOn() as you did before somewhere in your test:
jest.spyOn(Foo, 'fn');

추신: 원라이너일 수도 있습니다.

jest.mock('path/to/file', () => ({ __esModule: true, ...jest.requireActual('path/to/file') }));

추신'path/to/file'적어도 지금 이 순간에는 안 먹혔어그래서 슬프게도 당신은 실제 경로를 3번 반복해야 합니다.

저장

재수출을 위해 생성된 js 코드를 보면 다음과 같습니다.

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];
    }
  });
});

컴파일러가 추가하지 않았기 때문에 발생하는 오류입니다.configurable: true의 선택사항으로definePropertydocs로부터의 export를 조롱하기 위해 joke를 재정의할 수 있습니다.

설정 가능한

true는 이 속성 설명자의 유형을 변경할 수 있고 해당 속성이 해당 개체에서 삭제될 수 있는 경우입니다.기본값은 입니다.

컴파일러가 추가하도록 설정을 조정할 수 있다고 생각합니다만, 사용하는 툴에 따라 다릅니다.

보다 접근하기 쉬운 접근법은jest.mock대신jest.spyOn설정 불가능한 내보내기를 재정의하지 않고 사용자 지정 파일을 조롱합니다.

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
      })
    }
  })
});

그UserContext에서 재취득할 때app/context/index.tsx3.9 이전 버전에서 재export 처리 방법에 대한 Typescript의 버그이기 때문에 이 문제가 발생합니다.

이 문제는 버전 3.9에서 수정되었으므로 프로젝트의 유형 스크립트를 이 버전 이상으로 업그레이드하십시오.

이 문제는 여기에서 보고되었으며 수정에 대한 코멘트를 통해 해결되었습니다.

다음은 버전을 업그레이드하지 않은 경우의 회피책입니다.

에 오브젝트가 있습니다.index.tsxImport된 메서드로 속성이 포함된 파일을 만든 다음 개체를 내보냅니다.

안에서.src/app/context/index.tsx

import { useUser } from './context/user-context.tsx'

const context = {
  useUser,
  otherFunctionsIfAny
}

export default context;

아니면 이것도 효과가 있을 거야

import * as useUser from './context/user-context.tsx';

export { useUser };

export default useUser;

그럼 그들을 감시하고

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,
    });
});

참조

주의할 점:- 이전 버전에서는 재내보내기 문제 외에 라이브바인딩도 지원되지 않았습니다.즉, 내보내기 모듈이 변경되었을 때 Import 모듈이 내보내기 측에서 변경되었음을 확인할 수 없었습니다.

예:

Test.js

let num = 10;

function add() {
    ++num;  // Value is mutated
}

exports.num = num;
exports.add = add;

index.displaces를 표시합니다.

비슷한 문제이지만 Import 경로로 인해 발생합니다.

이 오류 메시지(JavaScript)의 이유는 다음 TypeError: 속성을 재정의할 수 없습니다. Function.defineProperty()

에는 다시 게 요.index.tsx에 useSteps「 」 「 」 、 「 」

폴더 구조는 다음과 같습니다.

hooks/useSteps/
              index.tsx
              useSteps/useSteps.tsx

식이었어요.import * as step from './hooks/useSteps';

이 이어야 한다import * as step from './hooks/useSteps/useSteps';

언급URL : https://stackoverflow.com/questions/67872622/jest-spyon-not-working-on-index-file-cannot-redefine-property