ive written hundreds of react components but foolishly I always put off testing. i guess i see it as necessary evil but i would like to start loving it. I have this react componenent:
class Basket extends React.Component {
render() {
return (
<BasketContainer>
<BasketProducts>
<h1>Basket</h1>
{this.props.basket.items.map((item) => (
<BasketProduct>
<BasketProductImage>
<Image image={item.product.image} />
</BasketProductImage>
<PriceAndRemove>
<BasketProductPrice>
<span className="price">£{item.quantity * item.product.price}</span>
</BasketProductPrice>
<BasketProductRemove>
<button onClick={() => this.props.removeFromBasket(item.product)}>X</button>
</BasketProductRemove>
</PriceAndRemove>
<BasketProductName>
<p className="name">{item.product.name}</p>
</BasketProductName>
<BasketProductQuantity>
<span className="quantity">Qty {item.quantity}</span>
<span><button onClick={() => this.props.increaseQuantity(item)} className="quantity">+</button></span>
<span><button onClick={() => this.props.decreaseQuantity(item)} className="quantity">-</button></span>
</BasketProductQuantity>
</BasketProduct>), this)}
<button onClick={() => this.props.clearBasket()}>Clear Basket</button>
</BasketProducts>
<Total>
<h1> Total </h1>
<span className="label">Sub-total </span>
<span className="amount">£{this.props.basket.total}</span>
<button>Checkout</button>
</Total>
</BasketContainer>
);
}
}
written using styled components, can anyone give me some guidelines on where I can start testing ?
i.e. what is a good test/what isn't? do I test button clicks? etc etc
im planning on using enzyme but i just want some idea and basically what are things necessary to test and what is OTT testing and unneeded, thanks
Aucun commentaire:
Enregistrer un commentaire