Gibt es eine saubere Möglichkeit, ein Kind Element zu verspotten, wenn Unit-Tests ein Element, mit Mocha und Freunde?Mock Kind Komponente in React
Zum Beispiel, sagen, dass ich so etwas wie diese:
<Parent>
<Child aProp={ this.props.clickChild() }/>
</Parent>
ich mag es verspotten, so kann ich manuell aProp auslösen und dann sagen, dass es die clickChild genannt, dass ich es übergeben.
Nach vielen Nachforschungen sieht es so aus, als ob dies nicht wirklich möglich ist. Wenn Sie sie in einem sehr spezifischen Format ausführen, können Sie bestimmte spöttische Dinge verwenden, aber Sie müssen mehrere Dinge tun, die in Ihrem "echten" Code nicht Standard sind. Ich bin kein Fan davon, Code für Tests zu modifizieren.
Eine Alternative, auf die ich mich festgelegt habe, ist für bestimmte Fälle, ich würde nur das Element nach einem mount() finden, die Eigenschaft abrufen, die den Rückruf bereitstellt, und dann das direkt auslösen und tun, was ich brauche. Kein perfektes universelles Szenario, aber es funktioniert.
Nehmen Sie dieses Beispiel-Code:
// Parent.js
export default class Parent extends React.Component {
doSomething() {
this.props.doSomethingTriggered();
}
render() {
return <div>
<Child onClick={ this.doSomething.bind() }/>
</div>;
}
}
I-Enzym verwenden, um die Komponente zu montieren, dann lösen die onClick Eigenschaft Child und Spion auf dem Rückruf ich es gab es richtig genannt, um sicherzustellen, wurde.
Nicht ganz spöttisch, aber lassen Sie mich einen guten Teil des abhängigen Codes in bestimmten Szenarien umgehen.
Wenn Sie versuchen, Parent in Ihrer Spezifikationsdatei darzustellen, wird bereits Child erstellt. Scry für das Kind und Benutzer-Trigger zum Aufrufen von "aProp" –
Mein Punkt ist, ich möchte verhindern, dass es den echten Kind verwenden und überschreiben, was es tut. Dieses Beispiel ist zu einfach, aber ich denke an Szenarien, in denen Child komplexer wäre und ich diese Komplexität umgehen möchte. – samanime
Klingt, als ob Sie nach Abhängigkeitsinjektion suchen. – Bergi