C3: Não é possível exigir () para usar com Jest

Criado em 7 ago. 2017  ·  13Comentários  ·  Fonte: c3js/c3

TypeError: Cannot read property 'prototype' of undefined

      at ../../../../node_modules/c3/c3.js:2720:30
      at ../../../../node_modules/c3/c3.js:3263:3
      at Object.<anonymous>.CLASS.target (../../../../node_modules/c3/c3.js:2:82)
      at Object.<anonymous> (../../../../node_modules/c3/c3.js:5:2)

qual é

        window.SVGPathElement.prototype.createSVGPathSegClosePath = function () {

Não tenho certeza de onde relatar isso. Jest, jsdom, aqui?

Comentários muito úteis

@fernandes Entendi. Eu brinquei com isso um pouco mais e consegui executar os testes de instantâneo simulando c3:

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

e, em seguida, na parte de configuração do Jest do meu package.json :

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

Todos 13 comentários

Também estou recebendo este erro, não tenho certeza se é um problema com c3 ou jsdom.

Crie um projeto npm vazio. Então, tente isto:

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

Saída:

/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)

Eu não estava recebendo esse erro antes.
Provavelmente relacionado a este https://github.com/tmpvar/jsdom/pull/1445

Você acha que podemos apenas simular a propriedade SVGPathElement?

Acho que é obviamente um problema com a implementação SVG incompleta do jsdom (pela qual não os culpo; essa merda parece uma merda)

No entanto, qual seria uma boa solução alternativa? Eu quero ser capaz de testar a unidade de um projeto que tem C3 como uma dependência com jsdom / jest, mas este é um grande bloqueador. Na verdade, não preciso testar a unidade de nenhuma das funcionalidades do C3, então acho que posso arrancar ...

Você acha que podemos apenas simular a propriedade SVGPathElement?

Essa seria uma solução possível.

Eu nem estou usando c3, mas provavelmente outros pacotes do meu projeto estão.
Meus testes estavam funcionando bem até que eu atualizei um monte de dependências. Ainda estou tentando descobrir qual dependência está usando c3.
PS: jsdom está presente em meus arquivos de teste.

Encontrei! Reverter o keen-js para a v3.4.1 "resolveu" o problema. A última versão é 4.0.0.

No caso de alguém com o mesmo problema que o meu, Keen decidiu dividir seu pacote principal em 3 pacotes separados: https://github.com/keen/keen-js/releases/tag/v4.0.0

O problema é que keen-dataviz.js usa c3.js. Não estou usando gráficos, portanto, no meu caso, a solução é instalar o keen-tracking e remover o keen-js.

Estou enfrentando o mesmo problema usando jest e tentando fazer um instantâneo de um componente que usa react-c3js

    TypeError: Cannot read property 'prototype' of undefined

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

apenas algumas diferenças no número da linha, provavelmente alguma relacionada à construção (estou usando a versão c3: 0.4.18)

atualização: window.SVGPathElement.prototype.createSVGPathSegClosePath = function () é a linha aqui também

ps: funciona perfeitamente no navegador, só de brincadeira acontece esse erro

Mesmo aqui. Eu acredito que este responde por quê: https://github.com/tmpvar/jsdom/issues/1423

@brandonros
Se você não precisa da funcionalidade c3 em seus casos de teste de brincadeira, acho que não há problema em substituir SVGPathElement por objeto fictício.

Consegui exigir c3.js no ambiente de nó simulando window.SVGPathElement como a seguir:

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

@fernandes Estou enfrentando um problema semelhante. Você conseguiu encontrar uma solução alternativa?

oi @esonmez , eu não tinha ...

como eu pesquisei jsdom não implementa o material SVG nele, é por isso que não posso usar c3 em testes (que usa jdsom), eu apenas isolei o componente c3 o máximo que pude e eliminei este teste heheh

@fernandes Entendi. Eu brinquei com isso um pouco mais e consegui executar os testes de instantâneo simulando c3:

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

e, em seguida, na parte de configuração do Jest do meu package.json :

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

hahaha que interessante, obrigado por compartilhar a dica, vou implementar no meu projeto, obrigado!

Fiquei animado para resolver isso usando a sugestão de @esonmez , mas como o projeto em que estou trabalhando aproveita o criar-reagir-app, fiquei preso novamente:

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.

Frustrante para dizer o mínimo. Em qualquer caso, em nosso arquivo de configuração de brincadeira, fui capaz de simular como fez @ kt3k :

global.SVGPathElement = function () {}

E funcionou como um encanto. Obrigado pela ajuda a todos!

Para questões envolvendo a interação entre C3.js e qualquer outra biblioteca (react, vuejs, ..), use o Grupo do Google em https://groups.google.com/forum/#!forum/c3js.

Obrigado!

Esta página foi útil?
0 / 5 - 0 avaliações

Questões relacionadas

Shugardude picture Shugardude  ·  4Comentários

DieterSpringer picture DieterSpringer  ·  4Comentários

laurentdebricon picture laurentdebricon  ·  3Comentários

unlight picture unlight  ·  3Comentários

Zerim picture Zerim  ·  3Comentários