diff --git a/src/components/vending-machine.jsx b/src/components/vending-machine.jsx
index 58e5925..f48b179 100644
--- a/src/components/vending-machine.jsx
+++ b/src/components/vending-machine.jsx
@@ -28,7 +28,13 @@ export default React.createClass({
style: coinContainerStyle} } = coinContainer;
return (
-
Display: {defaultMessage}
+
+ Display: {defaultMessage}
+ Balance: ${balance}
+ Selected Product: {selectedProduct}
+ CoinReturn: ${coinReturn}
+ Vend: {vend}
+
{validCoins.map((vc,i) =>{
return ),
{type: root_type,
@@ -142,8 +142,8 @@ const renderer = ReactTestUtils.createRenderer(),
{type : coinContainerType } = coinContainer,
{type : displayContainerType,
className : displayContainerClassName,
- stle : displayContainerStyle,
- props : {children: {props: {children: insert_coin}}}} = displayContainer;
+ stle : displayContainerStyle} = displayContainer,
+ [insertCoin, balance, selectedProduct, vend] = displayContainer.props.children;
const {
rootContainer :{props:{css_class:expected_root_css_class, style: expected_root_style }},
@@ -175,9 +175,63 @@ describe.only('Vending Machine Kata component is rendered:', () => {
expect(displayContainerType).to.eql('section');
expect(displayContainer.props.style).to.eql(expected_display_style);
expect(displayContainer.props.className).to.eql(expected_display_css_class);
- expect(insert_coin).to.eql(['Display: ',expectedProps.displayContainer.defaultMessage]);
+ expect(insertCoin.type).to.eql('h4');
+ expect(insertCoin.props.children).to.eql(['Display: ',expectedProps.displayContainer.defaultMessage]);
+ expect(balance.type).to.eql('div');
+ expect(balance.props.children).to.eql([ 'Balance: $', '0.00' ]);
+ expect(selectedProduct.type).to.eql('div');
+ expect(selectedProduct.props.children).to.eql([ 'Selected Product: ', 'NONE' ]);
+ expect(vend.type).to.eql('div');
+ expect(vend.props.children).to.eql([ 'CoinReturn: $', '0.00' ]);
+
});
- it('should update disply when valid coin is inserted.',()=>{});
+ it('should update disply when valid coin is inserted.',()=>{
+ let props ={
+ rootContainer: { props : { css_class: 'container-container',
+ style: {margin:'auto', width:'90%',backgroundColor:'gray'} }, },
+ displayContainer: {
+ props : { css_class: 'display-container', style: {float:'left', width:'45%', padding: '15px'} },
+ defaultMessage:'INSERT COIN',
+ balance: '0.20',
+ selectedProduct: 'NONE',
+ coinReturn:'0.00',
+ vend: 'EMPTY'
+ },
+ productsContainer:{ props : { css_class: 'products-div', },
+ products: [{'name': 'cola' , 'price': '1.00'},
+ {'name': 'chips', 'price': '1.50'},
+ {'name': 'candy', 'price': '0.65'}]
+ },
+ coinContainer:{
+ props : { css_class: 'coins-container', style: {float:'left', width:'45%', padding: '15px'} },
+ validCoins: [
+ {'name' : 'Quater',
+ 'value' : '25',
+ 'weight' : '5.670',
+ 'diameter' : '24.26'},
+ {'name' : 'Dime',
+ 'value' : '10',
+ 'weight' : '2.268',
+ 'diameter' : '17.91'},
+ {'name' : 'Nickel',
+ 'value' : '5',
+ 'weight' : '5.000',
+ 'diameter' : '21.21'}
+ ],
+ invalidCoins: [
+ {'name' : 'Pennies',
+ 'value' : '.01',
+ 'weight' : '2.500',
+ 'diameter' : '19.05'},
+ ]
+ },
+ clickHandler: function(){}
+ };
+ tree = renderer.render();
+ expect(tree.props.children[0].props.children[1].props.children).to.eql([ 'Balance: $', '0.20' ]);
+ //console.log(tree.props.children[0].props.children[1].props.children);
+ });
+
it('should place rejected coins in coin return',()=>{});
it('TODO',()=>{});
});