Skip to content

Commit 6f4a33b

Browse files
committed
create calculator app
- create initial components - create initial css - finished component functions and related tests - add keyboard listeners
1 parent 4e8a1fe commit 6f4a33b

30 files changed

+7743
-2637
lines changed

.gitignore

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,4 +21,5 @@ yarn-debug.log*
2121
yarn-error.log*
2222

2323
# post
24-
post.md
24+
/post
25+
old_post.md

README.md

Lines changed: 27 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,27 @@
1-
# Using AWS Lambda and API Gateway with React
1+
# TDD React
2+
3+
## Local Setup
4+
5+
```sh
6+
$ git clone [email protected]:calebpollman/react-calculator.git
7+
```
8+
9+
```sh
10+
$ cd react-calculator
11+
```
12+
13+
```sh
14+
$ yarn install
15+
```
16+
17+
## Run Locally
18+
19+
```sh
20+
$ yarn start
21+
```
22+
23+
## Run Tests
24+
25+
```sh
26+
$ yarn test
27+
```

package.json

Lines changed: 15 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,27 @@
11
{
2-
"name": "aws-lambda-with-api-gateway-and-react",
2+
"name": "tdd-react-calculator",
33
"version": "0.1.0",
44
"private": true,
55
"dependencies": {
6-
"react": "^16.2.0",
7-
"react-dom": "^16.2.0"
6+
"react": "^16.5.2",
7+
"react-dom": "^16.5.2"
88
},
99
"devDependencies": {
10-
"react-scripts": "1.1.0"
10+
"enzyme": "^3.7.0",
11+
"enzyme-adapter-react-16": "^1.6.0",
12+
"react-scripts": "2.0.5",
13+
"react-test-renderer": "^16.5.2"
1114
},
1215
"scripts": {
1316
"start": "react-scripts start",
1417
"build": "react-scripts build",
1518
"test": "react-scripts test --env=jsdom",
1619
"eject": "react-scripts eject"
17-
}
18-
}
20+
},
21+
"browserslist": [
22+
">0.2%",
23+
"not dead",
24+
"not ie <= 11",
25+
"not op_mini all"
26+
]
27+
}

public/favicon.png

100644100755
19 Bytes
Loading

public/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
66
<meta name="theme-color" content="#000000">
77
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.png">
8-
<link href="https://fonts.googleapis.com/css?family=Orbitron:400,700,900" rel="stylesheet">
8+
<link href="https://fonts.googleapis.com/css?family=Orbitron:400,700" rel="stylesheet">
99
<title>Issa Calculator</title>
1010
</head>
1111
<body>

src/App.js

Lines changed: 0 additions & 15 deletions
This file was deleted.
Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
.App {
1+
.app-container {
22
align-items: center;
33
display: flex;
44
height: 100vh;
55
justify-content: center;
66
width: 100vw;
7-
}
7+
}

src/components/App/App.jsx

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import React from 'react';
2+
import Calculator from '../Calculator/Calculator';
3+
import './App.css';
4+
5+
const App = () => {
6+
return (
7+
<div className="app-container">
8+
<Calculator />
9+
</div>
10+
);
11+
}
12+
13+
export default App;

src/components/App/App.spec.js

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
import React from 'react';
2+
import {shallow} from 'enzyme';
3+
import App from './App';
4+
import Calculator from '../Calculator/Calculator';
5+
6+
describe('App', () => {
7+
let wrapper;
8+
beforeEach(() => {
9+
wrapper = shallow(<App />);
10+
});
11+
12+
it('should render correctly', () => {
13+
expect(wrapper).toMatchSnapshot();
14+
});
15+
16+
it('should render a <div />', () => {
17+
expect(wrapper.find('div').length).toEqual(1);
18+
});
19+
20+
it('should render the Calculator Component', () => {
21+
expect(wrapper.containsMatchingElement(<Calculator />)).toEqual(true);
22+
});
23+
});
Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`App should render correctly 1`] = `
4+
ShallowWrapper {
5+
Symbol(enzyme.__root__): [Circular],
6+
Symbol(enzyme.__unrendered__): <App />,
7+
Symbol(enzyme.__renderer__): Object {
8+
"batchedUpdates": [Function],
9+
"getNode": [Function],
10+
"render": [Function],
11+
"simulateError": [Function],
12+
"simulateEvent": [Function],
13+
"unmount": [Function],
14+
},
15+
Symbol(enzyme.__node__): Object {
16+
"instance": null,
17+
"key": undefined,
18+
"nodeType": "host",
19+
"props": Object {
20+
"children": <Calculator />,
21+
"className": "app-container",
22+
},
23+
"ref": null,
24+
"rendered": Object {
25+
"instance": null,
26+
"key": undefined,
27+
"nodeType": "class",
28+
"props": Object {},
29+
"ref": null,
30+
"rendered": null,
31+
"type": [Function],
32+
},
33+
"type": "div",
34+
},
35+
Symbol(enzyme.__nodes__): Array [
36+
Object {
37+
"instance": null,
38+
"key": undefined,
39+
"nodeType": "host",
40+
"props": Object {
41+
"children": <Calculator />,
42+
"className": "app-container",
43+
},
44+
"ref": null,
45+
"rendered": Object {
46+
"instance": null,
47+
"key": undefined,
48+
"nodeType": "class",
49+
"props": Object {},
50+
"ref": null,
51+
"rendered": null,
52+
"type": [Function],
53+
},
54+
"type": "div",
55+
},
56+
],
57+
Symbol(enzyme.__options__): Object {
58+
"adapter": ReactSixteenAdapter {
59+
"options": Object {
60+
"enableComponentDidUpdateOnSetState": true,
61+
"lifecycles": Object {
62+
"componentDidUpdate": Object {
63+
"onSetState": true,
64+
},
65+
"getDerivedStateFromProps": true,
66+
"getSnapshotBeforeUpdate": true,
67+
"setState": Object {
68+
"skipsComponentDidUpdateOnNullish": true,
69+
},
70+
},
71+
},
72+
},
73+
},
74+
}
75+
`;

0 commit comments

Comments
 (0)