programing

Jest URL.create ObjectURL이 함수가 아닙니다.

shortcode 2023. 3. 5. 21:37
반응형

Jest URL.create ObjectURL이 함수가 아닙니다.

reactJs 어플리케이션을 개발 중입니다.내 지원서를 테스트하기 위해 농담을 사용하고 있다.BLOB를 다운로드하는 기능을 테스트하고 싶습니다.

그러나 유감스럽게도 다음과 같은 오류가 발생했습니다.

URL.createObjectURL이 함수가 아닙니다.

테스트 기능:

describe('download', () => {
    const documentIntial = { content: 'aaa' };
    it('msSaveOrOpenBlob should not have been called when navigao is undefined', () => {
      window.navigator.msSaveOrOpenBlob = null;
      download(documentIntial);
      expect(window.navigator.msSaveOrOpenBlob).toHaveBeenCalledTimes(0);
    });
  });

테스트할 기능:

export const download = document => {
  const blob = new Blob([base64ToArrayBuffer(document.content)], {
    type: 'application/pdf',
  });
  if (window.navigator && window.navigator.msSaveOrOpenBlob) {
    window.navigator.msSaveOrOpenBlob(blob);
    return;
  }

  const fileURL = URL.createObjectURL(blob);
  window.open(fileURL);
};

이것은 셋업하는 것만큼이나 간단해 보입니다.URL'글로벌 인 제스트'에서요뭐랄까

describe('download', () => {
  const documentIntial = { content: 'aaa' };
  global.URL.createObjectURL = jest.fn();
  it('msSaveOrOpenBlob should not have been called when navigao is undefined', () => {
    global.URL.createObjectURL = jest.fn(() => 'details');
window.navigator.msSaveOrOpenBlob = jest.fn(() => 'details');
download(documentIntial);
expect(window.navigator.msSaveOrOpenBlob).toHaveBeenCalledTimes(1);
  });
});

그러면 테스트 결과를 얻을 수 있습니다.이 테스트 결과를 사용하여global.URL.createObjectURL가 호출되었습니다.참고로, 다음과 같은 문제가 발생할 수 있습니다.window.open나는 만약 이것이 사실이라면 그것 또한 조롱할 것을 제안하고 싶다.

부터window.URL.createObjectURL(아직) jest-dom에서는 사용할 수 없습니다.이것에 모의 실장을 지정할 필요가 있습니다.

각 테스트 후 모의 구현을 재설정하는 것을 잊지 마십시오.

describe("your test suite", () => {
  window.URL.createObjectURL = jest.fn();

  afterEach(() => {
    window.URL.createObjectURL.mockReset();
  });

  it("your test case", () => {
    expect(true).toBeTruthy();
  });
});

jsdom, jeast에 의해 사용되는 WHATWG DOM의 JavaScript 구현은 아직 이 메서드를 구현하지 않았습니다.

문제에 대한 미해결 티켓github 페이지에서 확인할 수 있습니다.이 페이지에는 몇 가지 회피책이 코멘트로 기재되어 있습니다.하지만 만약 네가 그 블럽이 필요하다면실제로 작동하려면 이 FR이 해결되기를 기다려야 합니다.

문제의 코멘트에서 제안된 회피책은 농담으로 다음과 같습니다.

function noOp () { }
if (typeof window.URL.createObjectURL === 'undefined') { 
  Object.defineProperty(window.URL, 'createObjectURL', { value: noOp})
}

이것을 셋업 Test.js에 기입하기만 하면 됩니다.

window.URL.createObjectURL = function() {};

패키지 jsdom-worker는 이 메서드를 제공하고 웹 워커를 지원합니다.다음과 같은 것이 도움이 되었습니다.

npm install -D jsdom-worker

그럼 패키지로.json, 편집 또는 추가jest키:

{
  ...
  "jest": {
    "setupFiles": [
      "jsdom-worker"
    ]
  }
}

기능을 비웃을 뿐global.URL.createObjectURLImport 중에 일부 모듈에서 함수를 사용하여 Jest URL.createObject 오류가 표시되었기 때문에 작동하지 않았습니다.가져오는 동안 URL이 함수가 아닙니다.

대신 파일 작성에 도움이 되었습니다.mockJsdom.js

Object.defineProperty(URL, 'createObjectURL', {
  writable: true,
  value: jest.fn()
})

그런 다음 테스트를 포함하는 파일의 첫 번째 Import로 이 파일을 Import합니다.

import './mockJsdom'
import { MyObjects} from '../../src/lib/mylib'

test('my test', () => {
  // test code
}

검색처: https://jestjs.io/docs/manual-mocks#mocking-methods-which-are-not-implemented-in-jsdom

언급URL : https://stackoverflow.com/questions/52968969/jest-url-createobjecturl-is-not-a-function

반응형