Fixed filterPokemonByType problem by creating separate function and write unit tests

develop
Jason Zhu 2023-04-12 23:23:52 +10:00
parent fd21848a85
commit 92f7111943
4 changed files with 21616 additions and 4 deletions

View File

@ -4,6 +4,18 @@ import Filters from './Filters';
import Loading from 'components/Loading'; import Loading from 'components/Loading';
import { useAppSelector } from 'app/hooks'; import { useAppSelector } from 'app/hooks';
import { PokemonResponseData } from './types/api';
export const filterPokemonByType = (
pokemonList: PokemonResponseData[],
selectedType: string,
) => {
return pokemonList.filter(
pokemon =>
selectedType === 'All Types' ||
pokemon.types.some(type => type.type.name === selectedType),
);
};
const Pokedex = () => { const Pokedex = () => {
const isLoadingPokemons = useAppSelector( const isLoadingPokemons = useAppSelector(
@ -14,10 +26,7 @@ const Pokedex = () => {
const pokemonList = useAppSelector(state => state.pokedex.pokemonList); const pokemonList = useAppSelector(state => state.pokedex.pokemonList);
const filteredPokemonList = pokemonList.filter(pokemon => { const filteredPokemonList = filterPokemonByType(pokemonList, selectedType);
selectedType === 'All Types' ||
pokemon.types.some(type => type.type.name === selectedType);
});
return ( return (
<> <>

View File

@ -0,0 +1,44 @@
import { filterPokemonByType } from 'features/Pokedex/Pokedex';
import { PokemonResponseData } from 'features/Pokedex/types/api';
import pokemon1 from 'features/Pokedex/__test__/pokemon1.json';
import pokemon2 from 'features/Pokedex/__test__/pokemon2.json';
import { AppDispatch, AppStore } from 'app/store';
import { configureStore, Store } from '@reduxjs/toolkit';
import { pokedexSlice } from 'features/Pokedex/pokedexSlice';
import { pokedexApi } from 'features/Pokedex/pokedexApi';
import { listenerMiddleware } from 'app/listenerMiddleware';
let store: AppStore;
let dispatch: AppDispatch;
describe('filterPokemonByType works correctly', () => {
beforeEach(() => {
store = configureStore({
reducer: {
pokedex: pokedexSlice.reducer,
[pokedexApi.reducerPath]: pokedexApi.reducer,
},
middleware: getDefaultMiddleware =>
getDefaultMiddleware().concat(
pokedexApi.middleware,
listenerMiddleware.middleware,
),
});
});
const pokemonList: PokemonResponseData[] = [pokemon1, pokemon2];
it('should return all Pokemon if the selected type is "All Types"', () => {
const selectedType = 'All Types';
const filteredList = filterPokemonByType(pokemonList, selectedType);
expect(filteredList).toEqual(pokemonList);
});
it('should return only Pokemon of the selected type', () => {
const selectedType = 'fire';
const filteredList = filterPokemonByType(pokemonList, selectedType);
const allPokemonAreOfTypeFire = filteredList.every(pokemon =>
pokemon.types.some(type => type.type.name === selectedType),
);
expect(allPokemonAreOfTypeFire).toBe(true);
});
});

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff