Fix ItemComponent no expectation tests

- renamed `showBackButton` to `showBackButton$` because it's an observable
- `showBackButton$` only emits `true` when the back button should be shown, it does not emit `false` when it should be hidden, it just did nothing
This commit is contained in:
Alexandre Vryghem
2023-07-01 13:23:02 +02:00
parent 063c54e93f
commit 7ef3a914f9
10 changed files with 18 additions and 18 deletions

View File

@@ -1,4 +1,4 @@
<ds-themed-results-back-button *ngIf="showBackButton | async" [back]="back"></ds-themed-results-back-button> <ds-themed-results-back-button *ngIf="showBackButton$ | async" [back]="back"></ds-themed-results-back-button>
<div class="d-flex flex-row"> <div class="d-flex flex-row">
<ds-themed-item-page-title-field [item]="object" class="mr-auto"> <ds-themed-item-page-title-field [item]="object" class="mr-auto">
</ds-themed-item-page-title-field> </ds-themed-item-page-title-field>

View File

@@ -1,4 +1,4 @@
<ds-themed-results-back-button *ngIf="showBackButton | async" [back]="back"></ds-themed-results-back-button> <ds-themed-results-back-button *ngIf="showBackButton$ | async" [back]="back"></ds-themed-results-back-button>
<div class="d-flex flex-row"> <div class="d-flex flex-row">
<ds-themed-item-page-title-field [item]="object" class="mr-auto"> <ds-themed-item-page-title-field [item]="object" class="mr-auto">
</ds-themed-item-page-title-field> </ds-themed-item-page-title-field>

View File

@@ -1,4 +1,4 @@
<ds-themed-results-back-button *ngIf="showBackButton | async" [back]="back"></ds-themed-results-back-button> <ds-themed-results-back-button *ngIf="showBackButton$ | async" [back]="back"></ds-themed-results-back-button>
<div class="d-flex flex-row"> <div class="d-flex flex-row">
<ds-themed-item-page-title-field [item]="object" class="mr-auto"> <ds-themed-item-page-title-field [item]="object" class="mr-auto">
</ds-themed-item-page-title-field> </ds-themed-item-page-title-field>

View File

@@ -1,4 +1,4 @@
<ds-themed-results-back-button *ngIf="showBackButton | async" [back]="back"></ds-themed-results-back-button> <ds-themed-results-back-button *ngIf="showBackButton$ | async" [back]="back"></ds-themed-results-back-button>
<div class="d-flex flex-row"> <div class="d-flex flex-row">
<ds-themed-item-page-title-field [item]="object" class="mr-auto"> <ds-themed-item-page-title-field [item]="object" class="mr-auto">
</ds-themed-item-page-title-field> </ds-themed-item-page-title-field>

View File

@@ -1,4 +1,4 @@
<ds-themed-results-back-button *ngIf="showBackButton | async" [back]="back"></ds-themed-results-back-button> <ds-themed-results-back-button *ngIf="showBackButton$ | async" [back]="back"></ds-themed-results-back-button>
<div class="d-flex flex-row"> <div class="d-flex flex-row">
<ds-themed-item-page-title-field class="mr-auto" [item]="object"> <ds-themed-item-page-title-field class="mr-auto" [item]="object">
</ds-themed-item-page-title-field> </ds-themed-item-page-title-field>

View File

@@ -1,4 +1,4 @@
<ds-themed-results-back-button *ngIf="showBackButton | async" [back]="back"></ds-themed-results-back-button> <ds-themed-results-back-button *ngIf="showBackButton$ | async" [back]="back"></ds-themed-results-back-button>
<div class="d-flex flex-row"> <div class="d-flex flex-row">
<ds-themed-item-page-title-field [item]="object" class="mr-auto"> <ds-themed-item-page-title-field [item]="object" class="mr-auto">
</ds-themed-item-page-title-field> </ds-themed-item-page-title-field>

View File

@@ -1,4 +1,4 @@
<ds-themed-results-back-button *ngIf="showBackButton | async" [back]="back"></ds-themed-results-back-button> <ds-themed-results-back-button *ngIf="showBackButton$ | async" [back]="back"></ds-themed-results-back-button>
<div class="row" *ngIf="iiifEnabled"> <div class="row" *ngIf="iiifEnabled">
<div class="col-12"> <div class="col-12">
<ds-mirador-viewer id="iiif-viewer" <ds-mirador-viewer id="iiif-viewer"

View File

@@ -469,30 +469,31 @@ describe('ItemComponent', () => {
fixture.detectChanges(); fixture.detectChanges();
})); }));
it('should hide back button',() => { it('should hide back button', () => {
spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf('/item')); spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf('/item'));
comp.showBackButton.subscribe((val) => { comp.ngOnInit();
comp.showBackButton$.subscribe((val) => {
expect(val).toBeFalse(); expect(val).toBeFalse();
}); });
}); });
it('should show back button for search', () => { it('should show back button for search', () => {
spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf(searchUrl)); spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf(searchUrl));
comp.ngOnInit(); comp.ngOnInit();
comp.showBackButton.subscribe((val) => { comp.showBackButton$.subscribe((val) => {
expect(val).toBeTrue(); expect(val).toBeTrue();
}); });
}); });
it('should show back button for browse', () => { it('should show back button for browse', () => {
spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf(browseUrl)); spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf(browseUrl));
comp.ngOnInit(); comp.ngOnInit();
comp.showBackButton.subscribe((val) => { comp.showBackButton$.subscribe((val) => {
expect(val).toBeTrue(); expect(val).toBeTrue();
}); });
}); });
it('should show back button for recent submissions', () => { it('should show back button for recent submissions', () => {
spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf(recentSubmissionsUrl)); spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf(recentSubmissionsUrl));
comp.ngOnInit(); comp.ngOnInit();
comp.showBackButton.subscribe((val) => { comp.showBackButton$.subscribe((val) => {
expect(val).toBeTrue(); expect(val).toBeTrue();
}); });
}); });

View File

@@ -5,7 +5,7 @@ import { getItemPageRoute } from '../../../item-page-routing-paths';
import { RouteService } from '../../../../core/services/route.service'; import { RouteService } from '../../../../core/services/route.service';
import { Observable } from 'rxjs'; import { Observable } from 'rxjs';
import { getDSpaceQuery, isIiifEnabled, isIiifSearchEnabled } from './item-iiif-utils'; import { getDSpaceQuery, isIiifEnabled, isIiifSearchEnabled } from './item-iiif-utils';
import { filter, map, take } from 'rxjs/operators'; import { map, take } from 'rxjs/operators';
import { Router } from '@angular/router'; import { Router } from '@angular/router';
@Component({ @Component({
@@ -27,7 +27,7 @@ export class ItemComponent implements OnInit {
/** /**
* Used to show or hide the back to results button in the view. * Used to show or hide the back to results button in the view.
*/ */
showBackButton: Observable<boolean>; showBackButton$: Observable<boolean>;
/** /**
* Route to the item page * Route to the item page
@@ -73,10 +73,9 @@ export class ItemComponent implements OnInit {
this.itemPageRoute = getItemPageRoute(this.object); this.itemPageRoute = getItemPageRoute(this.object);
// hide/show the back button // hide/show the back button
this.showBackButton = this.routeService.getPreviousUrl().pipe( this.showBackButton$ = this.routeService.getPreviousUrl().pipe(
filter(url => this.previousRoute.test(url)), map((url: string) => this.previousRoute.test(url)),
take(1), take(1),
map(() => true)
); );
// check to see if iiif viewer is required. // check to see if iiif viewer is required.
this.iiifEnabled = isIiifEnabled(this.object); this.iiifEnabled = isIiifEnabled(this.object);

View File

@@ -1,4 +1,4 @@
<ds-themed-results-back-button *ngIf="showBackButton | async" [back]="back"></ds-themed-results-back-button> <ds-themed-results-back-button *ngIf="showBackButton$ | async" [back]="back"></ds-themed-results-back-button>
<div class="row" *ngIf="iiifEnabled"> <div class="row" *ngIf="iiifEnabled">
<div class="col-12"> <div class="col-12">
<ds-mirador-viewer id="iiif-viewer" <ds-mirador-viewer id="iiif-viewer"