Failing test for Cookie Component

[dcritchlow]

We need to pick a cookie image we want to use and display it in the html

There is a failing test now that will go green when this is done. Tests can be run by running yarn test in a git bash window

1. Open Cookie.js file in Components folder
2. In between the <div> </div> elements add an <img> component
3. The <img /> element will need three attributes a. The first attribute is src="images/cookie.png" b. You will need to find an image of a cookie and save it in the folder Cookie-Clicker/public/images with the filename cookie.png. Make sure it is a png file.
4. The next to attributes are width="" and height="" a. You can choose any values you like for width and height e.g. 100px
5. When you are done the img element should look like this <img src="images/cookie.png" width="100px" height="100px" /> with your own width and height values you like 😄

Testing in a browser window

Right now we will need 3 git bash windows One window you will type yarn dev into One window you will type yarn webpack into The last window you will type yarn test With those running you will see the failing test in one of them and the other two will let you visit http://localhost:8888/ to see your cookie picture in the browser

[brodycritchlow]

I dont see the Cookie.js folder do i have to make one and do this? There is a failing test now that will go green when this is done. Tests can be run by running yarn test in a git bash window

Open Cookie.js file in Components folder In between the

elements add an component The element will need three attributes a. The first attribute is src="images/cookie.png" b. You will need to find an image of a cookie and save it in the folder Cookie-Clicker/public/images with the filename cookie.png. Make sure it is a png file. The next to attributes are width="" and height="" a. You can choose any values you like for width and height e.g. 100px When you are done the img element should look like this

with your own width and height values you like 😄 Testing in a browser window Right now we will need 3 git bash windows One window you will type yarn dev into One window you will type yarn webpack into The last window you will type yarn test With those running you will see the failing test in one of them and the other two will let you visit http://localhost:8888/ to see your cookie picture in the browser