Ich habe eine sehr einfache React-Mischung, die jQuery verwendet, um ein Ereignis auszulösen
%Vor%Dies wird mit browserify als Teil einer neuen Gruppe von Komponenten in die Hauptseite importiert. Da die Haupt-Site, die diese Komponenten enthält, immer jQuery enthält, möchte ich jQuery nicht mit browserify erfordern, da es dupliziert wird.
Dies ist kein Problem in Bezug auf das Verhalten - es verursacht jedoch Probleme beim Ausführen von JEST zum Komponententest der Komponenten mit diesem Mix, der den Fehler auslöst.
%Vor%Ich weiß, dass ich das beheben kann, indem ich jQuery durch browserify einschließe, aber das lädt zwei Kopien auf meine Seite.
Gibt es irgendeine Möglichkeit im Scherz, meiner reagierenden Komponente zu sagen, dass jQuery bereits im Fenster existiert und sich nicht darum kümmern muss?
Ich habe ein ähnliches Problem, aber ich denke, wo ich bisher dein Problem gelöst habe. Sie müssen in den react-Dateien require verwenden, um jQuery unter $
zu definieren %Vor%Sie müssen dann Scherz sagen, um jQuery nicht zu verspotten
%Vor%Dann sollten Ihre Jest-Unit-Tests bestanden werden (vorausgesetzt, sie überprüfen nicht, was jQuery macht - hier fallen meine Tests um).
Sie müssen browserify auch mitteilen, dass jQuery extern ist, dann werden alle Ihre Verweise auf $ definiert, die jquery-Bibliothek wird zum Testen geladen, ist aber nicht in Ihrem browserify-Bundle enthalten. (Verwenden Sie browserify-shim )
Ich gehe mit:
if (process.env.NODE_ENV === 'test') window.$ = require('jquery');
Ich hoffe, das hilft jemandem!
UPDATE:
Ich habe in allen React-Dateien, die jQuery verwenden, mit import $ from 'jquery' begonnen. Das entfernt die Abhängigkeit von window. $ Ist der Typ von jQuery, den ich erwarte (Ich habe Probleme mit anderen Bibliotheken bekommen, die mit window. $ Zusammenhängen. Zuerst war ich besorgt über den Import von jQuery überall, weil ich befürchtete, dass dies meine erhöhen würde Bündelgröße. Aber die Art und Weise wie Bündelung funktioniert, all diese Importe werden auf ein Singleton verweisen, so dass die Bündelgröße nicht zunimmt.
Ich bin nicht daran interessiert, die jQuery-Funktionalität in meinen Komponenten zu testen. Außerdem habe ich jQuery nicht in mein Paket aufgenommen, da es überall auf der Website, auf der sich meine App befindet, verwendet wird. So habe ich zum Beispiel folgendes gemacht:
%Vor%.
%Vor% Ich weiß, dass meine Komponente nicht geladen wird, ohne die Funktion $ aufzurufen. Also ich verspotte diese Funktion mit jest.fn in einem beforeAll() . Jetzt weiß ich auch, dass meine jQuery-Funktion in meiner eigentlichen Komponente verkettet ist. Also weiß ich, dass ich auch die .on() von jQuery berücksichtigen muss, also stelle sicher, dass ich ein Objekt mit einer on -Funktion zurücksende. Es gibt keine weitere Verkettung, also kann ich damit aufhören.
Wenn ich einen komplexeren Satz verketteter Funktionen hätte, könnte ich so etwas tun:
%Vor%Tags und Links jquery reactjs jestjs reactjs-testutils