Implemented test for getTypeList, getRegionList endpoints

src/features/Pokedex/Pokedex.tsx

@@ -7,7 +7,7 @@ import Loading from 'components/Loading';
 import charizard from 'features/Pokedex/Pokemon/assets/stories/charizard.svg';
 
 const Pokedex = () => {
-  const { data, error, isLoading } = useGetPokemonListQuery(100);
+  const { data, error, isLoading } = useGetPokemonListQuery();
 
   return (
     <>

src/features/Pokedex/__test__/pokedexApi.test.ts

@@ -1,4 +1,9 @@
-import { pokedexApi } from 'features/Pokedex/pokedexApi';
+import {
+  pokedexApi,
+  PokemonListResponse,
+  RegionListResponse,
+  TypeListResponse,
+} from 'features/Pokedex/pokedexApi';
 import { pokedexSlice } from 'features/Pokedex/pokedexSlice';
 import { configureStore } from '@reduxjs/toolkit';
 import region1 from 'features/Pokedex/__test__/responses/region1.json';
@@ -78,5 +83,23 @@ describe('pokedexApi', () => {
       ).data;
       expect(region1Data).toEqual(region1);
     });
+
+    test('visit https://pokeapi.co/api/v2/region should return correct data in list', async () => {
+      await store.dispatch(pokedexApi.endpoints.getRegionList.initiate());
+
+      const regionListData = pokedexApi.endpoints.getRegionList.select()(
+        store.getState(),
+      ).data as RegionListResponse;
+      expect(regionListData?.results).toHaveLength(regionListData.count);
+    });
+
+    test('visit https://pokeapi.co/api/v2/type should return correct data in list', async () => {
+      await store.dispatch(pokedexApi.endpoints.getTypeList.initiate());
+
+      const typeListData = pokedexApi.endpoints.getTypeList.select()(
+        store.getState(),
+      ).data as TypeListResponse;
+      expect(typeListData?.results).toHaveLength(typeListData.count + 1);
+    });
   });
 });

src/features/Pokedex/__test__/responses/pokemonList.json

@@ -0,0 +1,27 @@
+{
+  "count": 1281,
+  "next": "https://pokeapi.co/api/v2/pokemon?offset=20&limit=20",
+  "previous": null,
+  "results": [
+    { "name": "bulbasaur", "url": "https://pokeapi.co/api/v2/pokemon/1/" },
+    { "name": "ivysaur", "url": "https://pokeapi.co/api/v2/pokemon/2/" },
+    { "name": "venusaur", "url": "https://pokeapi.co/api/v2/pokemon/3/" },
+    { "name": "charmander", "url": "https://pokeapi.co/api/v2/pokemon/4/" },
+    { "name": "charmeleon", "url": "https://pokeapi.co/api/v2/pokemon/5/" },
+    { "name": "charizard", "url": "https://pokeapi.co/api/v2/pokemon/6/" },
+    { "name": "squirtle", "url": "https://pokeapi.co/api/v2/pokemon/7/" },
+    { "name": "wartortle", "url": "https://pokeapi.co/api/v2/pokemon/8/" },
+    { "name": "blastoise", "url": "https://pokeapi.co/api/v2/pokemon/9/" },
+    { "name": "caterpie", "url": "https://pokeapi.co/api/v2/pokemon/10/" },
+    { "name": "metapod", "url": "https://pokeapi.co/api/v2/pokemon/11/" },
+    { "name": "butterfree", "url": "https://pokeapi.co/api/v2/pokemon/12/" },
+    { "name": "weedle", "url": "https://pokeapi.co/api/v2/pokemon/13/" },
+    { "name": "kakuna", "url": "https://pokeapi.co/api/v2/pokemon/14/" },
+    { "name": "beedrill", "url": "https://pokeapi.co/api/v2/pokemon/15/" },
+    { "name": "pidgey", "url": "https://pokeapi.co/api/v2/pokemon/16/" },
+    { "name": "pidgeotto", "url": "https://pokeapi.co/api/v2/pokemon/17/" },
+    { "name": "pidgeot", "url": "https://pokeapi.co/api/v2/pokemon/18/" },
+    { "name": "rattata", "url": "https://pokeapi.co/api/v2/pokemon/19/" },
+    { "name": "raticate", "url": "https://pokeapi.co/api/v2/pokemon/20/" }
+  ]
+}

src/features/Pokedex/__test__/responses/regionList.json

@@ -0,0 +1,17 @@
+{
+  "count": 10,
+  "next": null,
+  "previous": null,
+  "results": [
+    { "name": "kanto", "url": "https://pokeapi.co/api/v2/region/1/" },
+    { "name": "johto", "url": "https://pokeapi.co/api/v2/region/2/" },
+    { "name": "hoenn", "url": "https://pokeapi.co/api/v2/region/3/" },
+    { "name": "sinnoh", "url": "https://pokeapi.co/api/v2/region/4/" },
+    { "name": "unova", "url": "https://pokeapi.co/api/v2/region/5/" },
+    { "name": "kalos", "url": "https://pokeapi.co/api/v2/region/6/" },
+    { "name": "alola", "url": "https://pokeapi.co/api/v2/region/7/" },
+    { "name": "galar", "url": "https://pokeapi.co/api/v2/region/8/" },
+    { "name": "hisui", "url": "https://pokeapi.co/api/v2/region/9/" },
+    { "name": "paldea", "url": "https://pokeapi.co/api/v2/region/10/" }
+  ]
+}

src/features/Pokedex/__test__/responses/typeList.json

@@ -0,0 +1,27 @@
+{
+  "count": 20,
+  "next": null,
+  "previous": null,
+  "results": [
+    { "name": "normal", "url": "https://pokeapi.co/api/v2/type/1/" },
+    { "name": "fighting", "url": "https://pokeapi.co/api/v2/type/2/" },
+    { "name": "flying", "url": "https://pokeapi.co/api/v2/type/3/" },
+    { "name": "poison", "url": "https://pokeapi.co/api/v2/type/4/" },
+    { "name": "ground", "url": "https://pokeapi.co/api/v2/type/5/" },
+    { "name": "rock", "url": "https://pokeapi.co/api/v2/type/6/" },
+    { "name": "bug", "url": "https://pokeapi.co/api/v2/type/7/" },
+    { "name": "ghost", "url": "https://pokeapi.co/api/v2/type/8/" },
+    { "name": "steel", "url": "https://pokeapi.co/api/v2/type/9/" },
+    { "name": "fire", "url": "https://pokeapi.co/api/v2/type/10/" },
+    { "name": "water", "url": "https://pokeapi.co/api/v2/type/11/" },
+    { "name": "grass", "url": "https://pokeapi.co/api/v2/type/12/" },
+    { "name": "electric", "url": "https://pokeapi.co/api/v2/type/13/" },
+    { "name": "psychic", "url": "https://pokeapi.co/api/v2/type/14/" },
+    { "name": "ice", "url": "https://pokeapi.co/api/v2/type/15/" },
+    { "name": "dragon", "url": "https://pokeapi.co/api/v2/type/16/" },
+    { "name": "dark", "url": "https://pokeapi.co/api/v2/type/17/" },
+    { "name": "fairy", "url": "https://pokeapi.co/api/v2/type/18/" },
+    { "name": "unknown", "url": "https://pokeapi.co/api/v2/type/10001/" },
+    { "name": "shadow", "url": "https://pokeapi.co/api/v2/type/10002/" }
+  ]
+}

src/features/Pokedex/pokedexApi.ts

@@ -1,5 +1,13 @@
-import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';
+import {
+  createApi,
+  FetchArgs,
+  fetchBaseQuery,
+} from '@reduxjs/toolkit/query/react';
 import type { PokemonProps as Pokemon } from './Pokemon';
+import {
+  paginationCustomBaseQuery,
+  pokeApiFullListFetchArgs,
+} from './paginationBaseQuery';
 
 export interface Region {
   name: string;
@@ -11,33 +19,48 @@ export interface Type {
   url: string;
 }
 
-interface RegionResponse {
+export interface PokemonListResponse {
+  count: number;
+  results: Pokemon[];
+}
+
+export interface RegionListResponse {
   count: number;
-  next: string | null;
-  previous: string | null;
   results: Region[];
 }
 
-interface TypeResponse {
+export interface TypeListResponse {
   count: number;
-  next: string | null;
-  previous: string | null;
   results: Type[];
 }
 
+const pokeApiBaseQuery = async (
+  args: pokeApiFullListFetchArgs,
+  api: any,
+  extra: any,
+) => {
+  const baseUrl = 'https://pokeapi.co/api/v2/';
+
+  if (args.fetchAllPages) {
+    return paginationCustomBaseQuery(args, api, extra, baseUrl);
+  } else {
+    return fetchBaseQuery({ baseUrl })(args, api, extra);
+  }
+};
+
 export const pokedexApi = createApi({
   reducerPath: 'pokedexApi',
-  baseQuery: fetchBaseQuery({ baseUrl: 'https://pokeapi.co/api/v2/' }),
+  baseQuery: pokeApiBaseQuery,
   endpoints: builder => ({
-    getPokemonList: builder.query<Pokemon[], number>({
+    getPokemonList: builder.query<PokemonListResponse, void>({
-      query: limit => `pokemon?limit=${limit}`,
+      query: () => ({ url: `pokemon`, fetchAllPages: true }),
     }),
-    getRegionList: builder.query<RegionResponse, void>({
+    getRegionList: builder.query<RegionListResponse, void>({
-      query: () => 'region',
+      query: () => ({ url: 'region', fetchAllPages: true }),
     }),
-    getTypeList: builder.query<TypeResponse, void>({
+    getTypeList: builder.query<TypeListResponse, void>({
-      query: () => 'type',
+      query: () => ({ url: 'type', fetchAllPages: true }),
-      transformResponse: (response: RegionResponse) => {
+      transformResponse: (response: RegionListResponse) => {
         return {
           ...response,
           results: [{ name: 'All Types', url: '' }, ...response.results],
@@ -45,10 +68,13 @@ export const pokedexApi = createApi({
       },
     }),
     getPokemon: builder.query<Pokemon, number | string>({
-      query: IdOrName => `pokemon/${IdOrName}`,
+      query: IdOrName => ({ url: `pokemon/${IdOrName}` }),
     }),
     getRegion: builder.query<Region, number | string>({
-      query: IdOrName => `region/${IdOrName}`,
+      query: IdOrName => ({ url: `region/${IdOrName}` }),
+    }),
+    getType: builder.query<Type, number | string>({
+      query: IdOrName => ({ url: `type/${IdOrName}` }),
     }),
   }),
 });
@@ -57,4 +83,7 @@ export const {
   useGetPokemonListQuery,
   useGetRegionListQuery,
   useGetTypeListQuery,
+  useGetPokemonQuery,
+  useGetRegionQuery,
+  useGetTypeQuery,
 } = pokedexApi;

src/mocks/handlers.ts

@@ -1,6 +1,8 @@
 import { rest } from 'msw';
 
-import region1 from '../features/Pokedex/__test__/responses/region1.json';
+import region1 from 'features/Pokedex/__test__/responses/region1.json';
+import regionList from 'features/Pokedex/__test__/responses/regionList.json';
+import typeList from 'features/Pokedex/__test__/responses/typeList.json';
 
 export const handlers = [
   // mock https://pokeapi.co/api/v2/region/1
@@ -12,4 +14,12 @@ export const handlers = [
   rest.get('https://pokeapi.co/api/v2/region/testregion', (req, res, ctx) => {
     return res(ctx.json(region1));
   }),
+
+  rest.get('https//pokeapi.co/api/v2/region', (req, res, ctx) => {
+    return res(ctx.json(regionList));
+  }),
+
+  rest.get('https//pokeapi.co/api/v2/type', (req, res, ctx) => {
+    return res(ctx.json(typeList));
+  }),
 ];