C3: Jest와 함께 사용하려면 require()를 사용할 수 없습니다.

또한 이 오류가 발생합니다. c3 또는 jsdom에 문제가 있는지 확실하지 않습니다.

빈 npm 프로젝트를 만듭니다. 그런 다음 다음을 시도하십시오.

npm i -S c3 jsom
node -e "var JSDOM = require('jsdom').JSDOM; global.window = new JSDOM().window; require('c3');"

산출:

/home/herinson/example/node_modules/c3/c3.js:2720
        window.SVGPathElement.prototype.createSVGPathSegClosePath = function () {
                             ^

TypeError: Cannot read property 'prototype' of undefined
    at /home/herinson/example/node_modules/c3/c3.js:2720:30
    at /home/herinson/example/node_modules/c3/c3.js:3263:3
    at CLASS.target (/home/herinson/example/node_modules/c3/c3.js:2:82)
    at Object.<anonymous> (/home/herinson/example/node_modules/c3/c3.js:5:2)
    at Module._compile (module.js:573:30)
    at Object.Module._extensions..js (module.js:584:10)
    at Module.load (module.js:507:32)
    at tryModuleLoad (module.js:470:12)
    at Function.Module._load (module.js:462:3)
    at Module.require (module.js:517:17)

이전에는 이 오류가 발생하지 않았습니다.
아마도 이것과 관련이 있을 것입니다 https://github.com/tmpvar/jsdom/pull/1445

SVGPathElement 속성을 조롱할 수 있다고 생각하십니까?

나는 분명히 jsdom의 불완전한 SVG 구현에 문제가 있다고 생각합니다.

그러나 좋은 해결 방법은 무엇입니까? jsdom/jest에 종속성으로 C3가 있는 프로젝트를 단위 테스트할 수 있기를 원하지만 이것은 꽤 큰 차단기입니다. 실제로 C3 기능 중 어떤 것도 단위 테스트할 필요가 없으므로 스텁을 제거할 수 있을 것 같습니다...

SVGPathElement 속성을 조롱할 수 있다고 생각하십니까?

그것이 가능한 해결책이 될 것입니다.

나는 c3를 사용하고 있지도 않지만 아마도 내 프로젝트의 다른 패키지는 사용하고 있을 것입니다.
내 테스트는 많은 종속성을 업데이트할 때까지 제대로 작동했습니다. 나는 여전히 c3를 사용하는 종속성을 파악하려고 노력하고 있습니다.
추신: jsdom은 내 테스트 파일에 있습니다.

그것을 발견! 날카로운-js를 v3.4.1로 롤백하면 문제가 "해결"되었습니다. 최신 버전은 4.0.0입니다.

나와 같은 문제가 있는 사람의 경우 Keen은 기본 패키지를 3개의 개별 패키지로 나누기로 결정했습니다. https://github.com/keen/keen-js/releases/tag/v4.0.0

문제는 sharp-dataviz.js가 c3.js를 사용한다는 것입니다. 나는 차트를 사용하지 않기 때문에 나의 경우 해결책은 예리한 추적을 설치하고 예리한 js를 제거하는 것입니다.

jest 를 사용하여 동일한 문제에 직면하고 있으며

    TypeError: Cannot read property 'prototype' of undefined

      at node_modules/c3/c3.js:2806:30
      at node_modules/c3/c3.js:3349:3

행 번호의 약간의 차이점, 아마도 일부 빌드 관련(저는 c3 버전을 사용하고 있습니다: 0.4.18)

업데이트: window.SVGPathElement.prototype.createSVGPathSegClosePath = function () 는 여기에도 있습니다.

추신: 브라우저에서 완벽하게 작동합니다. 농담으로 이 오류가 발생합니다.

여기도 마찬가지입니다. 나는 이것이 https://github.com/tmpvar/jsdom/issues/1423에 대한 답이라고 믿습니다.

@brandonros
jest 테스트 케이스에서 c3 기능이 필요하지 않다면 SVGPathElement를 더미 객체로 교체하는 것이 괜찮다고 생각합니다.

아래와 같이 window.SVGPathElement를 더미화하여 노드 환경에서 c3.js를 요구할 수 있었습니다.

var JSDOM = require('jsdom').JSDOM;
global.window = new JSDOM().window;
window.SVGPathElement = function () {};
console.log(require('c3')); // => no error!

@fernandes 저도 비슷한 문제에 직면해 있습니다. 해결 방법을 찾았습니까?

안녕 @esonmez , 나는 ...

jsdom이 SVG를 구현하지 않는다는 것을 조사했기 때문에 테스트(jdsom을 사용하는)에서 c3를 사용할 수 없습니다. 가능한 한 c3 구성 요소를 분리하고 이 테스트를 중단했습니다.

@fernandes 알겠습니다. 조금 더 가지고 놀았고 c3을 조롱하여 스냅샷 테스트를 실행할 수 있었습니다.

// __mocks__/c3.js
module.exports = () => 'c3';

그런 다음 내 package.json 의 Jest 구성 부분에서 :

"moduleNameMapper": {
  "c3": "<rootDir>/__mocks__/c3.js",
}

하하하 흥미롭네요. 팁을 공유해 주셔서 감사합니다. 프로젝트에 적용할 예정입니다. 감사합니다!

@esonmez 의 제안을 사용하여 이 문제를 해결하게 되어

Out of the box, Create React App only supports overriding these Jest options:

  • collectCoverageFrom
  • coverageReporters
  • coverageThreshold
  • snapshotSerializers.

These options in your package.json Jest configuration are not currently supported by Create React App:

  • moduleNameMapper

If you wish to override other Jest options, you need to eject from the default setup. You can do so by running npm run eject but remember that this is a one-way operation. You may also file an issue with Create React App to discuss supporting more options out of the box.

한마디로 실망스럽습니다. 어쨌든 우리의 jest 설정 파일에서 @kt3k 가 했던 것처럼 조롱할 수 있었습니다.

global.SVGPathElement = function () {}

그리고 그것은 매력처럼 작동했습니다. 모두 도와주셔서 감사합니다!

C3.js와 다른 라이브러리(react, vuejs, ..) 간의 상호 작용과 관련된 질문은 https://groups.google.com/forum/#!forum/c3js 에서 Google 그룹을 사용

감사합니다!