Skip to content

Commit

Permalink
Merge 3e990b9 into 92d42f6
Browse files Browse the repository at this point in the history
  • Loading branch information
Easybuoy committed Nov 10, 2019
2 parents 92d42f6 + 3e990b9 commit abe74e2
Show file tree
Hide file tree
Showing 26 changed files with 1,854 additions and 182 deletions.
10 changes: 9 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@
"coveralls": "^3.0.7",
"enzyme": "^3.10.0",
"enzyme-adapter-react-16": "^1.15.1",
"gsap": "^2.1.3",
"react": "^16.11.0",
"react-dom": "^16.11.0",
"react-preloading-component": "0.0.5",
Expand All @@ -16,6 +15,7 @@
"react-scripts": "3.2.0",
"react-toastify": "^5.4.0",
"redux": "^4.0.4",
"redux-mock-store": "^1.5.3",
"redux-thunk": "^2.3.0",
"styled-components": "^4.4.1"
},
Expand All @@ -30,6 +30,13 @@
"jest": {
"snapshotSerializers": [
"enzyme-to-json/serializer"
],
"coveragePathIgnorePatterns": [
"__mocks__",
"src/serviceWorker.js",
"src/index.js",
"src/store.js",
"src/App.jsx"
]
},
"testMatch": [
Expand All @@ -53,6 +60,7 @@
},
"devDependencies": {
"enzyme-to-json": "^3.4.3",
"moxios": "^0.4.0",
"sinon": "^7.5.0"
}
}
10 changes: 0 additions & 10 deletions src/App.tests.js

This file was deleted.

130 changes: 130 additions & 0 deletions src/__mocks__/mock.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,130 @@
export default {
getMovieMock: {
title: 'The Empire Strikes Back',
episode_id: 5,
opening_crawl:
'It is a dark time for the\r\nRebellion. Although the Death\r\nStar has been destroyed,\r\nImperial troops have driven the\r\nRebel forces from their hidden\r\nbase and pursued them across\r\nthe galaxy.\r\n\r\nEvading the dreaded Imperial\r\nStarfleet, a group of freedom\r\nfighters led by Luke Skywalker\r\nhas established a new secret\r\nbase on the remote ice world\r\nof Hoth.\r\n\r\nThe evil lord Darth Vader,\r\nobsessed with finding young\r\nSkywalker, has dispatched\r\nthousands of remote probes into\r\nthe far reaches of space....',
director: 'Irvin Kershner',
producer: 'Gary Kurtz, Rick McCallum',
release_date: '1980-05-17',
characters: [
'https://swapi.co/api/people/1/',
'https://swapi.co/api/people/2/',
'https://swapi.co/api/people/3/',
'https://swapi.co/api/people/4/',
'https://swapi.co/api/people/5/',
'https://swapi.co/api/people/10/',
'https://swapi.co/api/people/13/',
'https://swapi.co/api/people/14/',
'https://swapi.co/api/people/18/',
'https://swapi.co/api/people/20/',
'https://swapi.co/api/people/21/',
'https://swapi.co/api/people/22/',
'https://swapi.co/api/people/23/',
'https://swapi.co/api/people/24/',
'https://swapi.co/api/people/25/',
'https://swapi.co/api/people/26/'
],
planets: [
'https://swapi.co/api/planets/4/',
'https://swapi.co/api/planets/5/',
'https://swapi.co/api/planets/6/',
'https://swapi.co/api/planets/27/'
],
starships: [
'https://swapi.co/api/starships/15/',
'https://swapi.co/api/starships/10/',
'https://swapi.co/api/starships/11/',
'https://swapi.co/api/starships/12/',
'https://swapi.co/api/starships/21/',
'https://swapi.co/api/starships/22/',
'https://swapi.co/api/starships/23/',
'https://swapi.co/api/starships/3/',
'https://swapi.co/api/starships/17/'
],
vehicles: [
'https://swapi.co/api/vehicles/8/',
'https://swapi.co/api/vehicles/14/',
'https://swapi.co/api/vehicles/16/',
'https://swapi.co/api/vehicles/18/',
'https://swapi.co/api/vehicles/19/',
'https://swapi.co/api/vehicles/20/'
],
species: [
'https://swapi.co/api/species/6/',
'https://swapi.co/api/species/7/',
'https://swapi.co/api/species/3/',
'https://swapi.co/api/species/2/',
'https://swapi.co/api/species/1/'
],
created: '2014-12-12T11:26:24.656000Z',
edited: '2017-04-19T10:57:29.544256Z',
url: 'https://swapi.co/api/films/2/'
},
getMoviesMock: [
{
title: 'The Empire Strikes Back',
episode_id: 5,
opening_crawl:
'It is a dark time for the\r\nRebellion. Although the Death\r\nStar has been destroyed,\r\nImperial troops have driven the\r\nRebel forces from their hidden\r\nbase and pursued them across\r\nthe galaxy.\r\n\r\nEvading the dreaded Imperial\r\nStarfleet, a group of freedom\r\nfighters led by Luke Skywalker\r\nhas established a new secret\r\nbase on the remote ice world\r\nof Hoth.\r\n\r\nThe evil lord Darth Vader,\r\nobsessed with finding young\r\nSkywalker, has dispatched\r\nthousands of remote probes into\r\nthe far reaches of space....',
director: 'Irvin Kershner',
producer: 'Gary Kurtz, Rick McCallum',
release_date: '1980-05-17',
characters: [
'https://swapi.co/api/people/1/',
'https://swapi.co/api/people/2/',
'https://swapi.co/api/people/3/',
'https://swapi.co/api/people/4/',
'https://swapi.co/api/people/5/',
'https://swapi.co/api/people/10/',
'https://swapi.co/api/people/13/',
'https://swapi.co/api/people/14/',
'https://swapi.co/api/people/18/',
'https://swapi.co/api/people/20/',
'https://swapi.co/api/people/21/',
'https://swapi.co/api/people/22/',
'https://swapi.co/api/people/23/',
'https://swapi.co/api/people/24/',
'https://swapi.co/api/people/25/',
'https://swapi.co/api/people/26/'
],
planets: [
'https://swapi.co/api/planets/4/',
'https://swapi.co/api/planets/5/',
'https://swapi.co/api/planets/6/',
'https://swapi.co/api/planets/27/'
],
starships: [
'https://swapi.co/api/starships/15/',
'https://swapi.co/api/starships/10/',
'https://swapi.co/api/starships/11/',
'https://swapi.co/api/starships/12/',
'https://swapi.co/api/starships/21/',
'https://swapi.co/api/starships/22/',
'https://swapi.co/api/starships/23/',
'https://swapi.co/api/starships/3/',
'https://swapi.co/api/starships/17/'
],
vehicles: [
'https://swapi.co/api/vehicles/8/',
'https://swapi.co/api/vehicles/14/',
'https://swapi.co/api/vehicles/16/',
'https://swapi.co/api/vehicles/18/',
'https://swapi.co/api/vehicles/19/',
'https://swapi.co/api/vehicles/20/'
],
species: [
'https://swapi.co/api/species/6/',
'https://swapi.co/api/species/7/',
'https://swapi.co/api/species/3/',
'https://swapi.co/api/species/2/',
'https://swapi.co/api/species/1/'
],
created: '2014-12-12T11:26:24.656000Z',
edited: '2017-04-19T10:57:29.544256Z',
url: 'https://swapi.co/api/films/2/'
}
],
getNetworkErrorMock: { message: 'Network Error' },
getCharactersMock: [{name: 'Eze', gender: 'male', height: "300"}]
};
34 changes: 34 additions & 0 deletions src/actions/__snapshots__/actions.test.js.snap
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Actions dispatches LOADING when getCharacter request is successful 1`] = `
Array [
Object {
"type": "LOADING",
},
]
`;

exports[`Actions dispatches LOADING when getCharacter request is successful 2`] = `
Array [
Object {
"payload": Array [],
"type": "SELECT_MOVIE",
},
]
`;

exports[`Actions dispatches LOADING when getMovies request is successful 1`] = `
Array [
Object {
"type": "LOADING",
},
]
`;

exports[`Actions dispatches LOADING when getmovie request is successful 1`] = `
Array [
Object {
"type": "LOADING",
},
]
`;
98 changes: 98 additions & 0 deletions src/actions/actions.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,98 @@
import configureStore from 'redux-mock-store';
import moxios from 'moxios';
import thunk from 'redux-thunk';

import { getMovies, getMovie, getCharacter, selectMovie } from './index';
import { LOADING, SELECT_MOVIE } from './types';
import mock from '../__mocks__/mock';

describe('Actions', () => {
const mockStore = configureStore([thunk]);
const store = mockStore({});

beforeEach(() => {
moxios.install();
store.clearActions();
});
afterEach(() => {
moxios.uninstall();
});

it(`dispatches LOADING when getMovies request is successful`, done => {
moxios.wait(() => {
const request = moxios.requests.mostRecent();
request.respondWith({
status: 200,
response: { data: mock.setCurrentUserMock }
});
});
const expectedActions = [
{
type: LOADING
}
];

store.dispatch(getMovies());
expect(store.getActions()).toEqual(expectedActions);
expect(store.getActions()).toMatchSnapshot();
done();
});

it(`dispatches LOADING when getmovie request is successful`, done => {
moxios.wait(() => {
const request = moxios.requests.mostRecent();
request.respondWith({
status: 200,
response: { data: mock.setCurrentUserMock }
});
});
const expectedActions = [
{
type: LOADING
}
];
store.dispatch(getMovie('google.com'));
expect(store.getActions()).toEqual(expectedActions);
expect(store.getActions()).toMatchSnapshot();
done();
});

it(`dispatches LOADING when getCharacter request is successful`, done => {
moxios.wait(() => {
const request = moxios.requests.mostRecent();
request.respondWith({
status: 200,
response: { data: mock.setCurrentUserMock }
});
});
const expectedActions = [
{
type: LOADING
}
];
store.dispatch(getCharacter([]));
expect(store.getActions()).toEqual(expectedActions);
expect(store.getActions()).toMatchSnapshot();
done();
});

it(`dispatches LOADING when getCharacter request is successful`, done => {
moxios.wait(() => {
const request = moxios.requests.mostRecent();
request.respondWith({
status: 200,
response: { data: mock.setCurrentUserMock }
});
});
const expectedActions = [
{
type: SELECT_MOVIE,
payload: []
}
];
store.dispatch(selectMovie([]));
expect(store.getActions()).toEqual(expectedActions);
expect(store.getActions()).toMatchSnapshot();
done();
});
});
16 changes: 7 additions & 9 deletions src/components/Characters/Character.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -28,10 +28,10 @@ export const sortArrow = order => {
}
};

const Character = ({ movie, characters, setCharacters }) => {
export const Character = ({ movie, characters, setCharacters }) => {
const [heightOrder, setHeightOrder] = useState(undefined);
const [nameOrder, setNameOrder] = useState(undefined);
const [genderValue] = useState('Select Gender');
const [genderValue] = useState('Filter');
const [stateCharacters, setStateCharacters] = useState([]);

useEffect(() => {
Expand All @@ -41,7 +41,6 @@ const Character = ({ movie, characters, setCharacters }) => {
}
}, 3000);
return () => clearTimeout(timer);
// setStateCharacters(characters);
// eslint-disable-next-line react-hooks/exhaustive-deps
});

Expand Down Expand Up @@ -91,7 +90,7 @@ const Character = ({ movie, characters, setCharacters }) => {
<tr>
<th
onDoubleClick={() => sortNameField(characters)}
className="toggle"
className="toggle name"
>
Name {sortArrow(nameOrder)}
</th>
Expand All @@ -104,15 +103,15 @@ const Character = ({ movie, characters, setCharacters }) => {
}
>
<option defaultValue="Select Gender" disabled>
Select Gender
Filter
</option>
<option value="M">M</option>
<option value="F">F</option>
</select>
</th>
<th
onDoubleClick={() => sortHeightField(characters)}
className="toggle"
className="toggle height"
>
Height {sortArrow(heightOrder)}
</th>
Expand Down Expand Up @@ -145,9 +144,8 @@ const Character = ({ movie, characters, setCharacters }) => {
};

Character.propTypes = {
loading: PropTypes.object.isRequired,
error: PropTypes.object.isRequired,
characters: PropTypes.array.isRequired
characters: PropTypes.array.isRequired,
setCharacters: PropTypes.func.isRequired
};

const mapStateToProps = state => ({
Expand Down
Loading

0 comments on commit abe74e2

Please sign in to comment.