From ceb3bb0d7646771bb8395958665686812be1f803 Mon Sep 17 00:00:00 2001 From: Silke Date: Wed, 29 Jun 2022 13:18:29 +0200 Subject: [PATCH] fix: don't display the review tab on product master variation page (#1193) --- .../product-rating.component.html | 8 +++-- .../product-rating.component.spec.ts | 1 + .../product-rating.component.ts | 4 ++- .../product-detail-info.component.html | 16 +++++----- .../product-detail-info.component.spec.ts | 30 +++++++++++++++++-- .../product-detail-info.component.ts | 4 ++- 6 files changed, 49 insertions(+), 14 deletions(-) diff --git a/src/app/extensions/rating/shared/product-rating/product-rating.component.html b/src/app/extensions/rating/shared/product-rating/product-rating.component.html index 514808044c2..8343e2a0461 100644 --- a/src/app/extensions/rating/shared/product-rating/product-rating.component.html +++ b/src/app/extensions/rating/shared/product-rating/product-rating.component.html @@ -1,4 +1,6 @@ - - - ({{ numberOfReviews$ | async }}) + + + + ({{ numberOfReviews$ | async }}) + diff --git a/src/app/extensions/rating/shared/product-rating/product-rating.component.spec.ts b/src/app/extensions/rating/shared/product-rating/product-rating.component.spec.ts index 28305dde91e..1b90bbe1e06 100644 --- a/src/app/extensions/rating/shared/product-rating/product-rating.component.spec.ts +++ b/src/app/extensions/rating/shared/product-rating/product-rating.component.spec.ts @@ -19,6 +19,7 @@ describe('Product Rating Component', () => { const context = mock(ProductContextFacade); when(context.select('product', 'roundedAverageRating')).thenReturn(of(3.5)); when(context.select('product', 'numberOfReviews')).thenReturn(of(2)); + when(context.select('variationCount')).thenReturn(of(0)); await TestBed.configureTestingModule({ declarations: [MockComponent(ProductRatingStarComponent), ProductRatingComponent], diff --git a/src/app/extensions/rating/shared/product-rating/product-rating.component.ts b/src/app/extensions/rating/shared/product-rating/product-rating.component.ts index 0b166ad1734..98b40d5e809 100644 --- a/src/app/extensions/rating/shared/product-rating/product-rating.component.ts +++ b/src/app/extensions/rating/shared/product-rating/product-rating.component.ts @@ -7,7 +7,7 @@ import { ProductContextFacade } from 'ish-core/facades/product-context.facade'; import { GenerateLazyComponent } from 'ish-core/utils/module-loader/generate-lazy-component.decorator'; /** - * The Product Rating Component renders rating stars for a product with rounded average rating as number. + * The Product Rating Component renders rating stars for a product (besides variation masters) with rounded average rating as number. * */ @Component({ selector: 'ish-product-rating', @@ -21,6 +21,7 @@ export class ProductRatingComponent implements OnInit { stars$: Observable<('full' | 'half' | 'empty')[]>; rating$: Observable; numberOfReviews$: Observable; + isVariationMaster$: Observable; constructor(private context: ProductContextFacade) {} @@ -30,5 +31,6 @@ export class ProductRatingComponent implements OnInit { map(rate => range(1, 6).map(index => (index <= rate ? 'full' : index - 0.5 === rate ? 'half' : 'empty'))) ); this.numberOfReviews$ = this.context.select('product', 'numberOfReviews'); + this.isVariationMaster$ = this.context.select('variationCount').pipe(map(variationCount => !!variationCount)); } } diff --git a/src/app/pages/product/product-detail-info/product-detail-info.component.html b/src/app/pages/product/product-detail-info/product-detail-info.component.html index a05cca42dbc..798cdc17e8b 100644 --- a/src/app/pages/product/product-detail-info/product-detail-info.component.html +++ b/src/app/pages/product/product-detail-info/product-detail-info.component.html @@ -1,6 +1,6 @@
diff --git a/src/app/pages/product/product-detail-info/product-detail-info.component.spec.ts b/src/app/pages/product/product-detail-info/product-detail-info.component.spec.ts index 9a335507424..0a723f44bd5 100644 --- a/src/app/pages/product/product-detail-info/product-detail-info.component.spec.ts +++ b/src/app/pages/product/product-detail-info/product-detail-info.component.spec.ts @@ -1,7 +1,12 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; -import { instance, mock } from 'ts-mockito'; +import { NgbNavModule } from '@ng-bootstrap/ng-bootstrap'; +import { TranslateModule } from '@ngx-translate/core'; +import { of } from 'rxjs'; +import { instance, mock, when } from 'ts-mockito'; import { ProductContextFacade } from 'ish-core/facades/product-context.facade'; +import { FeatureToggleModule } from 'ish-core/feature-toggle.module'; +import { ProductView } from 'ish-core/models/product-view/product-view.model'; import { ProductDetailInfoComponent } from './product-detail-info.component'; @@ -9,11 +14,17 @@ describe('Product Detail Info Component', () => { let component: ProductDetailInfoComponent; let fixture: ComponentFixture; let element: HTMLElement; + let context: ProductContextFacade; beforeEach(async () => { + context = mock(ProductContextFacade); + when(context.select('product')).thenReturn(of({ sku: '123' } as ProductView)); + when(context.select('variationCount')).thenReturn(of(0)); + await TestBed.configureTestingModule({ + imports: [FeatureToggleModule.forTesting('rating'), NgbNavModule, TranslateModule.forRoot()], declarations: [ProductDetailInfoComponent], - providers: [{ provide: ProductContextFacade, useFactory: () => instance(mock(ProductContextFacade)) }], + providers: [{ provide: ProductContextFacade, useFactory: () => instance(context) }], }).compileComponents(); }); @@ -28,4 +39,19 @@ describe('Product Detail Info Component', () => { expect(element).toBeTruthy(); expect(() => fixture.detectChanges()).not.toThrow(); }); + + it('should display the product description tab with status active', () => { + fixture.detectChanges(); + + expect(element.querySelectorAll('ul.nav-tabs li')).toHaveLength(2); + expect(element.querySelector('ul.nav-tabs li[data-testing-id=product-description-tab] a.active')).toBeTruthy(); + }); + + it('should not display the product rating tab for variation master', () => { + when(context.select('variationCount')).thenReturn(of(2)); + + fixture.detectChanges(); + + expect(element.querySelectorAll('ul.nav-tabs li')).toHaveLength(1); + }); }); diff --git a/src/app/pages/product/product-detail-info/product-detail-info.component.ts b/src/app/pages/product/product-detail-info/product-detail-info.component.ts index 9844a288b28..4bef1a834e6 100644 --- a/src/app/pages/product/product-detail-info/product-detail-info.component.ts +++ b/src/app/pages/product/product-detail-info/product-detail-info.component.ts @@ -1,5 +1,5 @@ import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core'; -import { Observable } from 'rxjs'; +import { Observable, map } from 'rxjs'; import { ProductContextDisplayProperties, ProductContextFacade } from 'ish-core/facades/product-context.facade'; import { ProductView } from 'ish-core/models/product-view/product-view.model'; @@ -11,12 +11,14 @@ import { ProductView } from 'ish-core/models/product-view/product-view.model'; }) export class ProductDetailInfoComponent implements OnInit { product$: Observable; + isVariationMaster$: Observable; active = 'DESCRIPTION'; constructor(private context: ProductContextFacade) {} ngOnInit() { this.product$ = this.context.select('product'); + this.isVariationMaster$ = this.context.select('variationCount').pipe(map(variationCount => !!variationCount)); } configuration$(key: keyof ProductContextDisplayProperties) {