Skip to content

Commit 582b133

Browse files
aquinojardimaquinojardim
committed
added calculator to manual tests
1 parent a660a3f commit 582b133

34 files changed

+30577
-0
lines changed

‎tests/manual-tests/CalculatorClasses/package-lock.json

Lines changed: 14669 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎tests/manual-tests/CalculatorClasses/package.json

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
{
2+
"name": "calculator",
3+
"version": "0.1.0",
4+
"license": "MIT",
5+
"homepage": "http://ahfarmer.github.io/calculator",
6+
"devDependencies": {
7+
"chai": "^4.2.0",
8+
"gh-pages": "^2.0.1",
9+
"prettier": "^1.17.1",
10+
"react-scripts": "^3.0.1"
11+
},
12+
"dependencies": {
13+
"big.js": "^5.2.2",
14+
"github-fork-ribbon-css": "^0.2.1",
15+
"react": "^16.8.6",
16+
"react-dom": "^16.8.6",
17+
"reactime": "^2.10.0"
18+
},
19+
"scripts": {
20+
"start": "react-scripts start",
21+
"build": "react-scripts build",
22+
"test": "react-scripts test --env=jsdom",
23+
"eject": "react-scripts eject",
24+
"deploy": "gh-pages -d build"
25+
},
26+
"prettier": {
27+
"trailingComma": "all"
28+
},
29+
"browserslist": {
30+
"production": [
31+
">0.2%",
32+
"not dead",
33+
"not op_mini all"
34+
],
35+
"development": [
36+
"last 1 chrome version",
37+
"last 1 firefox version",
38+
"last 1 safari version"
39+
]
40+
}
41+
}

‎tests/manual-tests/CalculatorClasses/src/component/App.css

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
.component-app {
2+
display: flex;
3+
flex-direction: column;
4+
flex-wrap: wrap;
5+
height: 100%;
6+
}

‎tests/manual-tests/CalculatorClasses/src/component/App.js

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
import React from "react";
2+
import Display from "./Display";
3+
import ButtonPanel from "./ButtonPanel";
4+
import calculate from "../logic/calculate";
5+
import "./App.css";
6+
7+
export default class App extends React.Component {
8+
state = {
9+
total: null,
10+
next: null,
11+
operation: null,
12+
};
13+
14+
handleClick = buttonName => {
15+
this.setState(calculate(this.state, buttonName));
16+
};
17+
18+
render() {
19+
return (
20+
<div className="component-app">
21+
<Display value={this.state.next || this.state.total || "0"} />
22+
<ButtonPanel clickHandler={this.handleClick} />
23+
</div>
24+
);
25+
}
26+
}

‎tests/manual-tests/CalculatorClasses/src/component/App.test.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import React from "react";
2+
import ReactDOM from "react-dom";
3+
import App from "./App";
4+
5+
it("renders without crashing", () => {
6+
const div = document.createElement("div");
7+
ReactDOM.render(<App />, div);
8+
});

‎tests/manual-tests/CalculatorClasses/src/component/Button.css

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
.component-button {
2+
display: inline-flex;
3+
width: 25%;
4+
flex: 1 0 auto;
5+
}
6+
7+
.component-button.wide {
8+
width: 50%;
9+
}
10+
11+
.component-button button {
12+
background: rgba(224,224,224,1);
13+
border: 0;
14+
border-radius: 10%;
15+
font-size: 1.5rem;
16+
margin: 0 1px 0 0;
17+
flex: 1 0 auto;
18+
padding: 0;
19+
}
20+
21+
.component-button:last-child button {
22+
margin-right: 0;
23+
}
24+
25+
.component-button.orange button {
26+
background: rgb(73, 119, 133);
27+
border-radius: 10%;
28+
color: white;
29+
}

‎tests/manual-tests/CalculatorClasses/src/component/Button.js

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
import React from "react";
2+
import PropTypes from "prop-types";
3+
import "./Button.css";
4+
5+
export default class Button extends React.Component {
6+
static propTypes = {
7+
name: PropTypes.string,
8+
orange: PropTypes.bool,
9+
wide: PropTypes.bool,
10+
clickHandler: PropTypes.func,
11+
};
12+
13+
handleClick = () => {
14+
this.props.clickHandler(this.props.name);
15+
};
16+
17+
render() {
18+
const className = [
19+
"component-button",
20+
this.props.orange ? "orange" : "",
21+
this.props.wide ? "wide" : "",
22+
];
23+
24+
return (
25+
<div className={className.join(" ").trim()}>
26+
<button onClick={this.handleClick}>{this.props.name}</button>
27+
</div>
28+
);
29+
}
30+
}

‎tests/manual-tests/CalculatorClasses/src/component/ButtonPanel.css

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
.component-button-panel {
2+
background-color: black;
3+
display: flex;
4+
flex-direction: row;
5+
flex-wrap: wrap;
6+
flex: 1 0 auto;
7+
}
8+
9+
.component-button-panel > div {
10+
width: 100%;
11+
margin-bottom: 1px;
12+
flex: 1 0 auto;
13+
display: flex;
14+
}

‎tests/manual-tests/CalculatorClasses/src/component/ButtonPanel.js

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
import Button from "./Button";
2+
import React from "react";
3+
import PropTypes from "prop-types";
4+
5+
import "./ButtonPanel.css";
6+
7+
export default class ButtonPanel extends React.Component {
8+
static propTypes = {
9+
clickHandler: PropTypes.func,
10+
};
11+
12+
handleClick = buttonName => {
13+
this.props.clickHandler(buttonName);
14+
};
15+
16+
render() {
17+
return (
18+
<div className="component-button-panel">
19+
<div>
20+
<Button name="AC" clickHandler={this.handleClick} />
21+
<Button name="+/-" clickHandler={this.handleClick} />
22+
<Button name="%" clickHandler={this.handleClick} />
23+
<Button name="÷" clickHandler={this.handleClick} orange />
24+
</div>
25+
<div>
26+
<Button name="7" clickHandler={this.handleClick} />
27+
<Button name="8" clickHandler={this.handleClick} />
28+
<Button name="9" clickHandler={this.handleClick} />
29+
<Button name="x" clickHandler={this.handleClick} orange />
30+
</div>
31+
<div>
32+
<Button name="4" clickHandler={this.handleClick} />
33+
<Button name="5" clickHandler={this.handleClick} />
34+
<Button name="6" clickHandler={this.handleClick} />
35+
<Button name="-" clickHandler={this.handleClick} orange />
36+
</div>
37+
<div>
38+
<Button name="1" clickHandler={this.handleClick} />
39+
<Button name="2" clickHandler={this.handleClick} />
40+
<Button name="3" clickHandler={this.handleClick} />
41+
<Button name="+" clickHandler={this.handleClick} orange />
42+
</div>
43+
<div>
44+
<Button name="0" clickHandler={this.handleClick} wide />
45+
<Button name="." clickHandler={this.handleClick} />
46+
<Button name="=" clickHandler={this.handleClick} orange />
47+
</div>
48+
</div>
49+
);
50+
}
51+
}

‎tests/manual-tests/CalculatorClasses/src/component/Display.css

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
.component-display {
2+
background: black;
3+
color: white;
4+
text-align: right;
5+
font-weight: 200;
6+
flex: 0 0 auto;
7+
width: 100%;
8+
}
9+
10+
.component-display > div {
11+
font-size: 2.5rem;
12+
padding: 0.2rem 0.7rem 0.1rem 0.5rem;
13+
}

0 commit comments

Comments
 (0)