diff --git a/src/components/RestaurantList.js b/src/components/RestaurantList.js
index 7aa954f..578580c 100644
--- a/src/components/RestaurantList.js
+++ b/src/components/RestaurantList.js
@@ -1,11 +1,17 @@
import { useEffect } from "react";
-export default function RestaurantList({ loadRestaurants })
+export default function RestaurantList({ loadRestaurants, restaurants })
{
- useEffect(() => { loadRestaurants(); }, [loadRestaurants]);
- return
- (
-
-
RestaurantList
- )
-}
\ No newline at end of file
+ useEffect(() =>
+ {
+ loadRestaurants();
+ }, [loadRestaurants]);
+ return (
+
+ {restaurants.map(restaurant =>
+ (
+ - {restaurant.name}
+ ))}
+
+ );
+};
\ No newline at end of file
diff --git a/src/components/RestaurantList.spec.js b/src/components/RestaurantList.spec.js
index c3c29df..ac23b19 100644
--- a/src/components/RestaurantList.spec.js
+++ b/src/components/RestaurantList.spec.js
@@ -1,4 +1,4 @@
-import { render } from '@testing-library/react';
+import { render, screen } from '@testing-library/react';
import RestaurantList from './RestaurantList';
describe('RestaurantList', () =>
@@ -6,7 +6,20 @@ describe('RestaurantList', () =>
it('loads restaurants on first render', () =>
{
const loadRestaurants = jest.fn().mockName('loadRestaurnats');
- render();
+ const restaurants = [];
+ render();
expect(loadRestaurants).toHaveBeenCalled();
});
+ it('displays the restaurants', () =>
+ {
+ const noop = () => {}; //"no operation"
+ const restaurants =
+ [
+ {id: 1, name: 'Sushi Place'},
+ {id: 2, name: 'Pizza Place'}
+ ];
+ render();
+ expect(screen.getByText('Sushi Place')).toBeInTheDocument();
+ expect(screen.getByText('Pizza Place')).toBeInTheDocument();
+ })
});
\ No newline at end of file