✨ NEW: more integration tests

karma.conf.js

@@ -10,7 +10,7 @@ module.exports = function (config) {
  frameworks: ['jasmine'],
 
  // list of files / patterns to load in the browser
- files: ['specs/**/*Spec.js'],
+ files: ['specs/**/*.spec.js'],
 
  // list of files / patterns to exclude
  exclude: [],

specs/contract/favRestoContract.js

@@ -0,0 +1,50 @@
+const itActsAsFavoriteRestoModel = (favRestoIdb) => {
+ it('should return the resto that has been added', async () => {
+ favRestoIdb.putResto({ id: 1 });
+ favRestoIdb.putResto({ id: 2 });
+
+ expect(await favRestoIdb.getResto(1)).toEqual({ id: 1 });
+ expect(await favRestoIdb.getResto(2)).toEqual({ id: 2 });
+ expect(await favRestoIdb.getResto(3)).toEqual(undefined);
+ });
+
+ it('should refuse a resto from being added if it does not have the correct property', async () => {
+ favRestoIdb.putResto({ aProperty: 'property' });
+
+ expect(await favRestoIdb.getAllResto()).toEqual([]);
+ });
+
+ it('can return all of the resto that have been added', async () => {
+ favRestoIdb.putResto({ id: 1 });
+ favRestoIdb.putResto({ id: 2 });
+
+ expect(await favRestoIdb.getAllResto()).toEqual([{ id: 1 }, { id: 2 }]);
+ });
+
+ it('should remove favorite resto', async () => {
+ favRestoIdb.putResto({ id: 1 });
+ favRestoIdb.putResto({ id: 2 });
+ favRestoIdb.putResto({ id: 3 });
+
+ await favRestoIdb.deleteResto(1);
+
+ expect(await favRestoIdb.getAllResto()).toEqual([{ id: 2 }, { id: 3 }]);
+ });
+
+ it('should handle request to remove a resto even though the resto has not been added', async () => {
+ favRestoIdb.putResto({ id: 1 });
+ favRestoIdb.putResto({ id: 2 });
+ favRestoIdb.putResto({ id: 3 });
+
+ await favRestoIdb.deleteResto(4);
+
+ expect(await favRestoIdb.getAllResto()).toEqual([
+ { id: 1 },
+ { id: 2 },
+ { id: 3 },
+ ]);
+ });
+};
+
+// eslint-disable-next-line import/prefer-default-export
+export { itActsAsFavoriteRestoModel };

specs/favRestaurantArraySpec.js

@@ -0,0 +1,44 @@
+/* eslint-disable no-prototype-builtins */
+/* eslint-disable consistent-return */
+import { itActsAsFavoriteRestoModel } from './contract/favRestoContract';
+
+let favoriteRestos = [];
+
+const FavoriteRestoArray = {
+ getResto(id) {
+ if (!id) {
+ return;
+ }
+
+ return favoriteRestos.find((restaurant) => restaurant.id === id);
+ },
+
+ getAllResto() {
+ return favoriteRestos;
+ },
+
+ putResto(resto) {
+ if (!resto.hasOwnProperty('id')) {
+ return;
+ }
+
+ if (this.getResto(resto.id)) {
+ return;
+ }
+
+ favoriteRestos.push(resto);
+ },
+
+ deleteResto(id) {
+ // cara boros menghapus restaurant dengan meng-copy restaurant yang ada
+ // kecuali restaurant dengan id === id
+ favoriteRestos = favoriteRestos.filter((resto) => resto.id !== id);
+ },
+};
+
+describe('Favorite resto array contract test', () => {
+ // eslint-disable-next-line no-return-assign
+ afterEach(() => (favoriteRestos = []));
+
+ itActsAsFavoriteRestoModel(FavoriteRestoArray);
+});

specs/favRestaurantIdbSpec.js

@@ -0,0 +1,12 @@
+import { itActsAsFavoriteRestoModel } from './contract/favRestoContract';
+import FavRestoIdb from '../src/scripts/data/resto-idb';
+
+describe('Favorite Movie Idb Contract Test Implementation', () => {
+ afterEach(async () => {
+ (await FavRestoIdb.getAllResto()).forEach(async (resto) => {
+ await FavRestoIdb.deleteResto(resto.id);
+ });
+ });
+
+ itActsAsFavoriteRestoModel(FavRestoIdb);
+});

specs/helpers/testFactories.js

@@ -0,0 +1,15 @@
+import LikeButtonPresenter from '../../src/scripts/utils/like-button-presenter';
+import FavRestoIdb from '../../src/scripts/data/resto-idb';
+
+const createLikeButtonPresenterWithResto = async (restaurant) => {
+ await LikeButtonPresenter.init({
+ likeButtonContainer: document.querySelector('#likeButtonContainer'),
+ favRestoIdb: FavRestoIdb,
+ data: {
+ restaurant,
+ },
+ });
+};
+
+// eslint-disable-next-line import/prefer-default-export
+export { createLikeButtonPresenterWithResto };

specs/likeRestaurant.spec.js

@@ -31,27 +31,28 @@ describe('Liking Resto', () => {
 
  document.querySelector('#likeButton').dispatchEvent(new Event('click'));
  const resto = await FavRestoIdb.getResto(1);
-
  expect(resto).toEqual({ id: 1 });
- FavRestoIdb.deleteResto(1);
+
+ await FavRestoIdb.deleteResto(1);
  });
 
  it('should not add a resto again when its already liked', async () => {
  await TestFactories.createLikeButtonPresenterWithResto({ id: 1 });
 
  await FavRestoIdb.putResto({ id: 1 });
  document.querySelector('#likeButton').dispatchEvent(new Event('click'));
- expect(await FavRestoIdb.getAllResto()).toEqual([{ id: 1 }]);
+ const allResto = await FavRestoIdb.getAllResto();
+ expect(allResto).toEqual([{ id: 1 }]);
 
- FavRestoIdb.deleteResto(1);
+ await FavRestoIdb.deleteResto(1);
  });
 
  // menggunakan metode xit, bukan it
  it('should not add a resto when it has no id', async () => {
  await TestFactories.createLikeButtonPresenterWithResto({});
 
  document.querySelector('#likeButton').dispatchEvent(new Event('click'));
-
- expect(await FavRestoIdb.getAllResto()).toEqual([]);
+ const allResto = await FavRestoIdb.getAllResto();
+ expect(allResto).toEqual([]);
  });
 });

specs/unlikeRestaurant.spec.js

@@ -0,0 +1,56 @@
+import FavRestoIdb from '../src/scripts/data/resto-idb';
+import * as TestFactories from './helpers/testFactories';
+
+const addLikeButtonContainer = () => {
+ document.body.innerHTML = '<div id="likeButtonContainer"></div>';
+};
+
+describe('Unliking Resto', () => {
+ beforeEach(async () => {
+ addLikeButtonContainer();
+ await FavRestoIdb.putResto({ id: 1 });
+ });
+
+ afterEach(async () => {
+ await FavRestoIdb.deleteResto(1);
+ });
+
+ it('should display unlike widget when the resto has been liked', async () => {
+ await TestFactories.createLikeButtonPresenterWithResto({ id: 1 });
+
+ expect(
+ document.querySelector('[aria-label="unlike this resto"]'),
+ ).toBeTruthy();
+ });
+
+ it('should not display unlike widget when the resto has been liked', async () => {
+ await TestFactories.createLikeButtonPresenterWithResto({ id: 1 });
+
+ expect(
+ document.querySelector('[aria-label="like this resto"]'),
+ ).toBeFalsy();
+ });
+
+ it('should be able to remove liked resto from the list', async () => {
+ await TestFactories.createLikeButtonPresenterWithResto({ id: 1 });
+
+ document
+ .querySelector('[aria-label="unlike this resto"]')
+ .dispatchEvent(new Event('click'));
+ const allResto = await FavRestoIdb.getAllResto();
+
+ expect(allResto).toEqual([]);
+ });
+
+ it('should not throw error if the unliked resto is not in the list', async () => {
+ await TestFactories.createLikeButtonPresenterWithResto({ id: 1 });
+
+ await FavRestoIdb.deleteResto(1);
+ document
+ .querySelector('[aria-label="unlike this resto"]')
+ .dispatchEvent(new Event('click'));
+ const allResto = await FavRestoIdb.getAllResto();
+
+ expect(allResto).toEqual([]);
+ });
+});

src/scripts/utils/like-button-presenter.js

@@ -1,14 +1,14 @@
-import FavRestoIdb from '../data/resto-idb';
 import {
  createLikeButtonTemplate,
  createLikedButtonTemplate,
 } from '../views/templates/like-button';
 import { initSwalError, initSwalSuccess } from './swal-initiator';
 
 const LikeButtonPresenter = {
- async init({ likeButtonContainer, data }) {
+ async init({ likeButtonContainer, data, favRestoIdb }) {
  this._likeButtonContainer = likeButtonContainer;
  this._restaurant = data.restaurant;
+ this._favRestoIdb = favRestoIdb;
 
  await this._renderButton();
  },
@@ -18,7 +18,7 @@ const LikeButtonPresenter = {
  const { id } = this._restaurant;
 
  // get resto in indexed db
- const restaurant = await FavRestoIdb.getResto(id);
+ const restaurant = await this._favRestoIdb.getResto(id);
 
  if (restaurant) {
  this._renderLikedButtonTemplate();
@@ -40,7 +40,7 @@ const LikeButtonPresenter = {
 
  likeButton.addEventListener('click', async () => {
  // onClick fav the selected resto
- await FavRestoIdb.putResto(this._restaurant);
+ await this._favRestoIdb.putResto(this._restaurant);
  initSwalSuccess('Resto favorited!');
  this._renderButton();
  });
@@ -53,7 +53,7 @@ const LikeButtonPresenter = {
 
  likeButton.addEventListener('click', async () => {
  // onClick unfav the selected resto
- await FavRestoIdb.deleteResto(this._restaurant.id);
+ await this._favRestoIdb.deleteResto(this._restaurant.id);
  initSwalSuccess('Resto unfavorited!');
  this._renderButton();
  });

src/scripts/views/pages/detail.js

@@ -6,7 +6,7 @@ import LikeButtonPresenter from '../../utils/like-button-presenter';
 import PostReview from '../../utils/post-review';
 import { initSwalError } from '../../utils/swal-initiator';
 import { sendDataToWebsocket } from '../../utils/websocket-initiator';
-import FavRestoIdb from '../../data/resto-idb';
+import favRestoIdb from '../../data/resto-idb';
 
 const Detail = {
  async render() {