Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 295b6ef

Browse files
Update tests for Intro screen
1 parent 3ec99f3 commit 295b6ef

File tree

6 files changed

+181
-2
lines changed

6 files changed

+181
-2
lines changed

‎__tests__/Layout.test.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ describe('Layout', () => {
4444
remaining: [patterns[1]],
4545
current: patterns[0]
4646
},
47+
intro: false,
4748
mode: 'light',
4849
js: 'es5'
4950
});
@@ -86,6 +87,7 @@ describe('Layout', () => {
8687
remaining: [patterns[1]],
8788
current: patterns[0]
8889
},
90+
intro: false,
8991
mode: 'dark',
9092
js: 'es5'
9193
});

‎__tests__/actions/actions.test.js‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { start } from '../../src/actions/start';
12
import { restart } from '../../src/actions/restart';
23
import { submitAnswer } from '../../src/actions/submitAnswer';
34
import { toggle, toggleJS, toggleMode } from '../../src/actions/toggle';
@@ -6,10 +7,17 @@ import {
67
TOGGLE,
78
TOGGLE_JS,
89
TOGGLE_MODE,
10+
START,
911
RESTART
1012
} from '../../src/static/constants/actions';
1113

1214
describe('Action Creators', () => {
15+
it('should dispatch START action', () => {
16+
expect(start('start')).toEqual({
17+
type: START,
18+
payload: 'start'
19+
});
20+
});
1321
it('should dispatch RESTART action', () => {
1422
expect(restart('restart')).toEqual({
1523
type: RESTART,

‎__tests__/pages/Game.test.js‎

Lines changed: 38 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import { themeDark } from '../../src/styles/themes/theme.dark';
99
import styleLight from '../../src/styles/hljs/hljs.light';
1010
import styleDark from '../../src/styles/hljs/hljs.dark';
1111
import Game from '../../src/pages/Game';
12-
import { RESTART } from '../../src/static/constants/actions';
12+
import { START,RESTART } from '../../src/static/constants/actions';
1313

1414
const patterns = [
1515
{
@@ -43,6 +43,7 @@ const store = mockStore({
4343
remaining: [patterns[1]],
4444
current: patterns[0]
4545
},
46+
intro: false,
4647
mode: 'light',
4748
js: 'es5'
4849
});
@@ -115,6 +116,41 @@ describe('Game page - GAME - DARK style', () => {
115116
});
116117
});
117118

119+
describe('Game page - INTRO', () => {
120+
let tree;
121+
const store = mockStore({
122+
patterns: patterns,
123+
progress: {
124+
answers: patterns,
125+
remaining: [],
126+
current: null
127+
},
128+
intro: true,
129+
mode: 'light',
130+
js: 'es5'
131+
});
132+
133+
beforeEach(() => {
134+
tree = mount(
135+
<Provider store={store}>
136+
<ThemeProvider theme={themeLight}>
137+
<Game style={styleLight} />
138+
</ThemeProvider>
139+
</Provider>
140+
);
141+
});
142+
143+
it('renders a <Button /> component', () => {
144+
expect(tree.find('Button')).toMatchSnapshot();
145+
});
146+
147+
it('reacts to button click', () => {
148+
tree.find('button').simulate('click');
149+
const actions = store.getActions();
150+
expect(actions).toMatchObject([{ type: START }]);
151+
});
152+
});
153+
118154
describe('Game page - RESULTS', () => {
119155
let tree;
120156
const patterns = [
@@ -147,6 +183,7 @@ describe('Game page - RESULTS', () => {
147183
remaining: [],
148184
current: null
149185
},
186+
intro: false,
150187
mode: 'light',
151188
js: 'es5'
152189
});

‎__tests__/pages/__snapshots__/Game.test.js.snap‎

Lines changed: 113 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -858,6 +858,119 @@ exports[`Game page - GAME - LIGHT style renders a <ProgressBar /> component 1`]
858858
</ProgressBar>
859859
`;
860860

861+
exports[`Game page - INTRO renders a <Button /> component 1`] = `
862+
.c0 {
863+
background-color: #F2E8F2;
864+
border: 1px solid #EDB8ED;
865+
border-radius: 4px;
866+
cursor: pointer;
867+
font: 400 1rem 'Karla','sans-serif';
868+
height: 48px;
869+
max-width: 240px;
870+
outline: none;
871+
padding: 0 1.5rem;
872+
width: 37.5%;
873+
}
874+
875+
.c0 span {
876+
color: #6F256F;
877+
}
878+
879+
.c0:hover {
880+
background-color: #6F256F;
881+
border-color: #6F256F;
882+
}
883+
884+
.c0:hover span {
885+
color: #FFFFFF;
886+
}
887+
888+
<Button
889+
id="start"
890+
label="Start"
891+
onClick={[Function]}
892+
>
893+
<styled.button
894+
id="start"
895+
onClick={[Function]}
896+
>
897+
<StyledComponent
898+
forwardedComponent={
899+
Object {
900+
"$$typeof": Symbol(react.forward_ref),
901+
"attrs": Array [],
902+
"componentStyle": ComponentStyle {
903+
"componentId": "sc-bdVaJa",
904+
"isStatic": false,
905+
"lastClassName": "c0",
906+
"rules": Array [
907+
"
908+
background-color: ",
909+
[Function],
910+
";
911+
border: 1px solid ",
912+
[Function],
913+
";
914+
border-radius: 4px;
915+
cursor: pointer;
916+
font: 400 1rem 'Karla', 'sans-serif';
917+
height: 48px;
918+
max-width: 240px;
919+
outline: none;
920+
padding: 0 1.5rem;
921+
width: 37.5%;
922+
923+
& span {
924+
color: ",
925+
[Function],
926+
";
927+
}
928+
929+
&:hover {
930+
background-color: ",
931+
[Function],
932+
";
933+
border-color: ",
934+
[Function],
935+
";
936+
937+
& span {
938+
color: ",
939+
[Function],
940+
";
941+
}
942+
}
943+
",
944+
],
945+
},
946+
"displayName": "styled.button",
947+
"foldedComponentIds": Array [],
948+
"render": [Function],
949+
"styledComponentId": "sc-bdVaJa",
950+
"target": "button",
951+
"toString": [Function],
952+
"warnTooManyClasses": [Function],
953+
"withComponent": [Function],
954+
}
955+
}
956+
forwardedRef={null}
957+
id="start"
958+
onClick={[Function]}
959+
>
960+
<button
961+
className="c0"
962+
id="start"
963+
onClick={[Function]}
964+
>
965+
<span>
966+
Start
967+
</span>
968+
</button>
969+
</StyledComponent>
970+
</styled.button>
971+
</Button>
972+
`;
973+
861974
exports[`Game page - RESULTS renders a <Percentage /> component 1`] = `
862975
.c0 {
863976
border: 4px solid red;

‎__tests__/reducers/reducers.test.js‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import {
44
TOGGLE,
55
TOGGLE_JS,
66
TOGGLE_MODE,
7+
START,
78
RESTART
89
} from '../../src/static/constants/actions';
910

@@ -38,6 +39,7 @@ const initialState = {
3839
js: 'es5',
3940
mode: 'dark',
4041
patterns: answers,
42+
intro: true,
4143
progress: {
4244
answers: [],
4345
remaining: answers,
@@ -85,6 +87,17 @@ describe('Reducers', () => {
8587
});
8688
});
8789

90+
it('should toggle INTRO', () => {
91+
const action = {
92+
type: START
93+
};
94+
95+
expect(reducer(initialState, action)).toEqual({
96+
...initialState,
97+
intro: false
98+
});
99+
});
100+
88101
it('should handle SUBMIT', () => {
89102
const action = {
90103
type: SUBMIT,

‎__tests__/selectors/selectors.test.js‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,8 @@ import {
44
getMode,
55
getJS,
66
getCurrent,
7-
getAnswers
7+
getAnswers,
8+
getIntro
89
} from '../../src/selectors';
910

1011
describe('Selectors', () => {
@@ -14,6 +15,7 @@ describe('Selectors', () => {
1415
state = {
1516
mode: 'dark',
1617
js: 'es6',
18+
intro: true,
1719
patterns: [0, 1, 2, 3, 4, 5, 6],
1820
progress: {
1921
answers: [0, 1, 2],
@@ -46,4 +48,8 @@ describe('Selectors', () => {
4648
it('should get the JS version', () => {
4749
expect(getJS(state)).toBe('es6');
4850
});
51+
52+
it('should get the intro value', () => {
53+
expect(getIntro(state)).toBe(true);
54+
});
4955
});

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /