diff --git a/libs/feature/search/src/lib/favorites/favorite-star/favorite-star.component.spec.ts b/libs/feature/search/src/lib/favorites/favorite-star/favorite-star.component.spec.ts index d5898aebb3..9429cfd2b7 100644 --- a/libs/feature/search/src/lib/favorites/favorite-star/favorite-star.component.spec.ts +++ b/libs/feature/search/src/lib/favorites/favorite-star/favorite-star.component.spec.ts @@ -31,7 +31,7 @@ describe('FavoriteStarComponent', () => { let fixture: ComponentFixture let authService: AuthService let favoritesService: FavoritesService - let favoriteCountEl: HTMLElement + let favoriteCountHTMLEl: HTMLElement let starToggle: StarToggleComponent beforeEach(async () => { @@ -65,7 +65,6 @@ describe('FavoriteStarComponent', () => { favoritesService = TestBed.inject(FavoritesService) fixture = TestBed.createComponent(FavoriteStarComponent) component = fixture.componentInstance - component.record = { ...RECORDS_SUMMARY_FIXTURE[0], favoriteCount: 42 } fixture.detectChanges() starToggle = fixture.debugElement.query( By.directive(StarToggleComponent) @@ -76,166 +75,167 @@ describe('FavoriteStarComponent', () => { expect(component).toBeTruthy() }) - describe('when a record has a favorite count', () => { - beforeEach(() => { - favoriteCountEl = fixture.debugElement.query( - By.css('.favorite-count') - ).nativeElement + describe('Favorite count', () => { + describe('when a record has a favorite count', () => { + beforeEach(() => { + component.record = { ...RECORDS_SUMMARY_FIXTURE[0], favoriteCount: 42 } + fixture.detectChanges() + }) + it('shows the amount of favorites on the record', () => { + favoriteCountHTMLEl = fixture.debugElement.query( + By.css('.favorite-count') + ).nativeElement + expect(favoriteCountHTMLEl).toBeTruthy() + expect(favoriteCountHTMLEl.textContent).toEqual( + component.record.favoriteCount.toString() + ) + }) }) - it('shows the amount of favorites on the record', () => { - expect(favoriteCountEl).toBeTruthy() - expect(favoriteCountEl.textContent).toEqual( - component.record.favoriteCount.toString() - ) + describe('when a record does not have a favorite count', () => { + beforeEach(() => { + component.record = { ...RECORDS_SUMMARY_FIXTURE[0] } + fixture.detectChanges() + }) + it('does not show the amount of favorites on the record', () => { + const favoriteCountEl = fixture.debugElement.query( + By.css('.favorite-count') + ) + expect(favoriteCountEl).toBeFalsy() + }) }) }) - describe('when a record does not have a favorite count', () => { + describe('Favorite component availability', () => { + describe('when authenticated', () => { + it('star toggle is enabled', () => { + expect(starToggle.disabled).toBe(false) + }) + it('does not create tippy tooltip', () => { + expect(tippy).not.toHaveBeenCalled() + }) + }) + describe('when not authenticated', () => { + beforeEach(() => { + ;(authService as any).isAnonymous$.next(true) + fixture.detectChanges() + }) + it('star toggle is disabled', () => { + expect(starToggle.disabled).toBe(true) + }) + it('creates tippy tooltip', () => { + expect(tippy).toHaveBeenCalledWith( + expect.any(Object), + expect.objectContaining({ + content: 'You can log in here', + allowHTML: true, + interactive: true, + zIndex: 40, + maxWidth: 250, + }) + ) + }) + }) + }) + describe('On favorite click', () => { beforeEach(() => { - component.record = { ...RECORDS_SUMMARY_FIXTURE[0] } - delete component.record.favoriteCount + component.record = { ...RECORDS_SUMMARY_FIXTURE[0], favoriteCount: 42 } fixture.detectChanges() }) - it('does not show the amount of favorites on the record', () => { - expect(fixture.debugElement.query(By.css('.favorite-count'))).toBeFalsy() + describe('When the record is already in favorites', () => { + beforeEach(() => { + starToggle.newValue.emit(false) + fixture.detectChanges() + }) + it('removes record from favorites', () => { + expect(favoritesService.removeFromFavorites).toHaveBeenCalledWith([ + component.record.uuid, + ]) + expect(favoritesService.addToFavorites).not.toHaveBeenCalled() + }) + }) + describe('When the record is not in favorites', () => { + beforeEach(() => { + starToggle.newValue.emit(true) + fixture.detectChanges() + }) + it('adds record to favorites', () => { + expect(favoritesService.addToFavorites).toHaveBeenCalledWith([ + component.record.uuid, + ]) + expect(favoritesService.removeFromFavorites).not.toHaveBeenCalled() + }) }) }) - describe('when authenticated', () => { - it('star toggle is enabled', () => { - expect(starToggle.disabled).toBe(false) + + describe('On favorites array update', () => { + beforeEach(() => { + component.record = { ...RECORDS_SUMMARY_FIXTURE[0], favoriteCount: 42 } + fixture.detectChanges() + favoriteCountHTMLEl = fixture.debugElement.query( + By.css('.favorite-count') + ).nativeElement }) - it('does not create tippy tooltip', () => { - expect(tippy).not.toHaveBeenCalled() + describe('When my record is part of the updates', () => { + beforeEach(() => { + ;(favoritesService as any).myFavoritesUuid$.next([ + component.record.uuid, + ]) + fixture.detectChanges() + }) + it('increase record favorite count by one', () => { + expect(favoriteCountHTMLEl.textContent).toEqual( + (component.record.favoriteCount + 1).toString() + ) + }) }) - - describe('on toggle state change', () => { + describe('When my record is not part of the updates', () => { beforeEach(() => { - favoriteCountEl = fixture.debugElement.query( - By.css('.favorite-count') - ).nativeElement + ;(favoritesService as any).myFavoritesUuid$.next(['aaa', 'bbb']) + fixture.detectChanges() }) - describe('When I click on the star', () => { - // TEST THAT FUNCTIONS ARE CALLED - describe('When the record is already in favorites', () => { - beforeEach(() => { - ;(favoritesService as any).myFavoritesUuid$.next([ - component.record.uuid, - ]) - starToggle.newValue.emit(false) - fixture.detectChanges() - }) - it('removes record from favorites', () => { - expect(favoritesService.removeFromFavorites).toHaveBeenCalledWith([ - component.record.uuid, - ]) - expect(favoritesService.addToFavorites).not.toHaveBeenCalled() - }) - }) - describe('When the record is not in favorites', () => { - beforeEach(() => { - ;(favoritesService as any).myFavoritesUuid$.next([ - component.record.uuid, - ]) - starToggle.newValue.emit(true) - fixture.detectChanges() - }) - it('adds record to favorites', () => { - expect(favoritesService.addToFavorites).toHaveBeenCalledWith([ - component.record.uuid, - ]) - expect(favoritesService.removeFromFavorites).not.toHaveBeenCalled() - }) - }) - }) - describe('When myFavoritesUuid has been updated', () => { - beforeEach(() => { - ;(favoritesService as any).myFavoritesUuid$.next([ - component.record.uuid, - ]) - fixture.detectChanges() - }) - // TEST THAT THE AMOUNT IS CORRECT - describe('When my record has been updated', () => { - beforeEach(() => { - ;(favoritesService as any).myFavoritesUuid$.next([ - component.record.uuid, - ]) - fixture.detectChanges() - }) - it('increase record favorite count by one', () => { - expect(favoriteCountEl.textContent).toEqual( - (component.record.favoriteCount + 1).toString() - ) - }) - }) - describe('When my record has not been updated', () => { - beforeEach(() => { - ;(favoritesService as any).myFavoritesUuid$.next(['aaa']) - fixture.detectChanges() - }) - it('increase record favorite count by one', () => { - expect(favoriteCountEl.textContent).toEqual( - component.record.favoriteCount.toString() - ) - }) - }) + it('increase record favorite count by one', () => { + expect(favoriteCountHTMLEl.textContent).toEqual( + component.record.favoriteCount.toString() + ) }) + }) + }) - describe('two subsequent changes', () => { - beforeEach(() => { - ;(favoritesService as any).myFavoritesUuid$.next(['aaa']) - starToggle.newValue.emit(false) - starToggle.newValue.emit(true) - fixture.detectChanges() - }) - it('removes and adds record to favorites', () => { - expect(favoritesService.removeFromFavorites).toHaveBeenCalledWith([ - component.record.uuid, - ]) - expect(favoritesService.addToFavorites).toHaveBeenCalledWith([ - component.record.uuid, - ]) - }) - it('record favorite count stays the same', () => { - expect(favoriteCountEl.textContent).toEqual( - component.record.favoriteCount.toString() - ) - }) - }) - describe('if favorite modification fails', () => { - beforeEach(() => { - favoritesService.addToFavorites = () => throwError('blargz') - starToggle.newValue.emit(true) - fixture.detectChanges() - }) - it('does not change record favorite count', () => { - expect(favoriteCountEl.textContent).toEqual( - component.record.favoriteCount.toString() - ) - }) - }) + describe('two subsequent changes', () => { + beforeEach(() => { + component.record = { ...RECORDS_SUMMARY_FIXTURE[0], favoriteCount: 42 } + ;(favoritesService as any).myFavoritesUuid$.next(['aaa']) + starToggle.newValue.emit(false) + starToggle.newValue.emit(true) + fixture.detectChanges() + }) + it('removes and adds record to favorites', () => { + expect(favoritesService.removeFromFavorites).toHaveBeenCalledWith([ + component.record.uuid, + ]) + expect(favoritesService.addToFavorites).toHaveBeenCalledWith([ + component.record.uuid, + ]) + }) + it('record favorite count stays the same', () => { + expect(favoriteCountHTMLEl.textContent).toEqual( + component.record.favoriteCount.toString() + ) }) }) - describe('when not authenticated', () => { + describe('if favorite modification fails', () => { beforeEach(() => { - ;(authService as any).isAnonymous$.next(true) + component.record = { ...RECORDS_SUMMARY_FIXTURE[0], favoriteCount: 42 } + favoritesService.addToFavorites = () => throwError('blargz') + starToggle.newValue.emit(true) fixture.detectChanges() }) - it('star toggle is disabled', () => { - expect(starToggle.disabled).toBe(true) - }) - it('creates tippy tooltip', () => { - expect(tippy).toHaveBeenCalledWith( - expect.any(Object), - expect.objectContaining({ - content: 'You can log in here', - allowHTML: true, - interactive: true, - zIndex: 40, - maxWidth: 250, - }) + it('does not change record favorite count', () => { + expect(favoriteCountHTMLEl.textContent).toEqual( + component.record.favoriteCount.toString() ) }) }) + describe('unsubscribe', () => { let unsubscribeSpy beforeEach(() => {