C3: Require() kann nicht mit Jest verwendet werden

Ich erhalte auch diesen Fehler, ich bin mir nicht sicher, ob es sich um ein Problem mit c3 oder jsdom handelt.

Erstellen Sie ein leeres npm-Projekt. Versuchen Sie dann Folgendes:

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

Ausgabe:

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

Ich hatte diesen Fehler vorher nicht.
Wahrscheinlich damit verbunden https://github.com/tmpvar/jsdom/pull/1445

Glauben Sie, wir können die SVGPathElement-Eigenschaft einfach nachahmen?

Ich denke, es ist offensichtlich ein Problem mit der unvollständigen SVG-Implementierung von jsdom (was ich ihnen nicht vorwerfe; diese Scheiße klingt nach Scheiße).

Was wäre jedoch ein guter Workaround? Ich möchte in der Lage sein, ein Projekt mit C3 als Abhängigkeit mit jsdom/jest zu testen, aber das ist ein ziemlich großer Blocker. Ich muss die C3-Funktionalität eigentlich nicht testen, also könnte ich sie wohl ausblenden...

Glauben Sie, wir können die SVGPathElement-Eigenschaft einfach nachahmen?

Das wäre eine mögliche Lösung.

Ich benutze nicht einmal c3, aber wahrscheinlich andere Pakete meines Projekts.
Meine Tests haben gut funktioniert, bis ich eine Reihe von Abhängigkeiten aktualisiert habe. Ich versuche immer noch herauszufinden, welche Abhängigkeit c3 verwendet.
PS: jsdom ist in meinen Testdateien vorhanden.

Fand es! Das Zurückrollen von keen-js auf v3.4.1 "löste" das Problem. Die neueste Version ist 4.0.0.

Falls jemand das gleiche Problem hat wie ich, hat Keen beschlossen, sein Hauptpaket in 3 separate Pakete aufzuteilen: https://github.com/keen/keen-js/releases/tag/v4.0.0

Das Problem ist, dass keen-dataviz.js c3.js verwendet. Ich verwende keine Diagramme, daher besteht die Lösung für meinen Fall darin, keen-tracking zu installieren und keen-js zu entfernen.

Ich stehe vor dem gleichen Problem mit jest und versuche, einen Snapshot einer Komponente zu erstellen , die

    TypeError: Cannot read property 'prototype' of undefined

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

nur einige Unterschiede bei der Zeilennummer, wahrscheinlich einige Build-bezogene (ich verwende c3-Version: 0.4.18)

Update: window.SVGPathElement.prototype.createSVGPathSegClosePath = function () ist auch hier die Zeile

ps: funktioniert einwandfrei im browser, nur bei scherz passiert dieser fehler

Hier gilt das gleiche. Ich glaube, dieser beantwortet warum: https://github.com/tmpvar/jsdom/issues/1423

@brandonros
Wenn Sie in Ihren Testfällen keine c3-Funktionalität benötigen, denke ich, dass es in Ordnung ist, SVGPathElement durch ein Dummy-Objekt zu ersetzen.

Ich konnte c3.js in der Node-Umgebung anfordern, indem ich window.SVGPathElement wie folgt blende:

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

@fernandes Ich

Hallo @esonmez , ich hatte nicht...

Da ich recherchiert habe, dass jsdom das SVG-Zeug nicht implementiert, kann ich c3 nicht für Tests verwenden (das jdsom verwendet).

@fernandes Verstanden . Ich habe noch ein bisschen damit herumgespielt und konnte die Snapshot-Tests ausführen, indem ich c3 verspottete:

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

und dann im Jest-Konfigurationsteil meines package.json :

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

hahaha das ist interessant, danke für den Tipp, werde ich bei meinem Projekt umsetzen, danke!

Ich war aufgeregt, dies mit dem Vorschlag von @esonmez zu lösen, aber da das Projekt, an dem ich arbeite, create-react-app nutzt, bin ich wieder stecken geblieben:

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.

Frustrierend, um es gelinde auszudrücken. Auf jeden Fall konnte ich es in unserer jest-Setup-Datei genau wie @kt3k verspotten:

global.SVGPathElement = function () {}

Und das funktionierte wie ein Zauber. Danke für die Hilfe alle!

Bei Fragen zum Zusammenspiel zwischen C3.js und anderen Bibliotheken (react, vuejs, ..) nutzen Sie bitte die Google Group unter https://groups.google.com/forum/#!forum/c3js.

Dankeschön!