diff --git a/marketplace-ui/src/app/app.component.spec.ts b/marketplace-ui/src/app/app.component.spec.ts index 776d58bf3..0a55ca2b6 100644 --- a/marketplace-ui/src/app/app.component.spec.ts +++ b/marketplace-ui/src/app/app.component.spec.ts @@ -31,8 +31,8 @@ describe('AppComponent', () => { [ 'getNavigationStartEvent', 'isDesignerEnv', - 'checkCookieForDesignerEnv', - 'checkCookieForDesignerVersion' + 'checkSessionStorageForDesignerEnv', + 'checkSessionStorageForDesignerVersion' ] ); @@ -89,7 +89,7 @@ describe('AppComponent', () => { expect(component).toBeTruthy(); }); - it('should subscribe to query params and check cookies if not in designer environment', () => { + it('should subscribe to query params and check session strorage if not in designer environment', () => { routingQueryParamService.isDesignerEnv.and.returnValue(false); const params = { someParam: 'someValue' }; @@ -103,10 +103,10 @@ describe('AppComponent', () => { navigationStartSubject.next(new NavigationStart(1, 'testUrl')); expect( - routingQueryParamService.checkCookieForDesignerEnv + routingQueryParamService.checkSessionStorageForDesignerEnv ).toHaveBeenCalledWith(params); expect( - routingQueryParamService.checkCookieForDesignerVersion + routingQueryParamService.checkSessionStorageForDesignerVersion ).toHaveBeenCalledWith(params); }); @@ -117,10 +117,10 @@ describe('AppComponent', () => { navigationStartSubject.next(new NavigationStart(1, 'testUrl')); expect( - routingQueryParamService.checkCookieForDesignerEnv + routingQueryParamService.checkSessionStorageForDesignerEnv ).not.toHaveBeenCalled(); expect( - routingQueryParamService.checkCookieForDesignerVersion + routingQueryParamService.checkSessionStorageForDesignerVersion ).not.toHaveBeenCalled(); }); diff --git a/marketplace-ui/src/app/app.component.ts b/marketplace-ui/src/app/app.component.ts index 67b0d9dff..fb13b0105 100644 --- a/marketplace-ui/src/app/app.component.ts +++ b/marketplace-ui/src/app/app.component.ts @@ -40,8 +40,8 @@ export class AppComponent { this.routingQueryParamService.getNavigationStartEvent().subscribe(() => { if (!this.routingQueryParamService.isDesignerEnv()) { this.route.queryParams.subscribe(params => { - this.routingQueryParamService.checkCookieForDesignerEnv(params); - this.routingQueryParamService.checkCookieForDesignerVersion(params); + this.routingQueryParamService.checkSessionStorageForDesignerEnv(params); + this.routingQueryParamService.checkSessionStorageForDesignerVersion(params); }); } }); diff --git a/marketplace-ui/src/app/auth/auth.service.spec.ts b/marketplace-ui/src/app/auth/auth.service.spec.ts index 8d7b07fe9..af558eb4b 100644 --- a/marketplace-ui/src/app/auth/auth.service.spec.ts +++ b/marketplace-ui/src/app/auth/auth.service.spec.ts @@ -4,7 +4,6 @@ import { Router } from '@angular/router'; import { CookieService } from 'ngx-cookie-service'; import { AuthService } from './auth.service'; import { environment } from '../../environments/environment'; -import { of } from 'rxjs'; import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http'; import { TOKEN_KEY } from '../shared/constants/common.constant'; diff --git a/marketplace-ui/src/app/core/interceptors/api.interceptor.spec.ts b/marketplace-ui/src/app/core/interceptors/api.interceptor.spec.ts index d09151d5a..5ef65a1ee 100644 --- a/marketplace-ui/src/app/core/interceptors/api.interceptor.spec.ts +++ b/marketplace-ui/src/app/core/interceptors/api.interceptor.spec.ts @@ -5,7 +5,7 @@ import { ActivatedRoute } from '@angular/router'; import { TranslateModule } from '@ngx-translate/core'; import { of } from 'rxjs'; import { ProductComponent } from '../../modules/product/product.component'; -import { DESIGNER_COOKIE_VARIABLE } from '../../shared/constants/common.constant'; +import { DESIGNER_SESSION_STORAGE_VARIABLE } from '../../shared/constants/common.constant'; import { apiInterceptor } from './api.interceptor'; import { MatomoTestingModule } from 'ngx-matomo-client/testing'; @@ -29,7 +29,7 @@ describe('AuthInterceptor', () => { provide: ActivatedRoute, useValue: { queryParams: of({ - [DESIGNER_COOKIE_VARIABLE.restClientParamName]: true + [DESIGNER_SESSION_STORAGE_VARIABLE.restClientParamName]: true }) } } diff --git a/marketplace-ui/src/app/modules/product/product-detail/product-detail-version-action/product-detail-version-action.component.html b/marketplace-ui/src/app/modules/product/product-detail/product-detail-version-action/product-detail-version-action.component.html index 4fb9bca6c..37f94b6f4 100644 --- a/marketplace-ui/src/app/modules/product/product-detail/product-detail-version-action/product-detail-version-action.component.html +++ b/marketplace-ui/src/app/modules/product/product-detail/product-detail-version-action/product-detail-version-action.component.html @@ -131,10 +131,14 @@ const selectedItemElement = document.querySelector('.install-designer-dropdown'); if (selectedItemElement) { const metaDataJsonUrl = selectedItemElement.getAttribute('metaDataJsonUrl'); - install(metaDataJsonUrl); + try { + install(metaDataJsonUrl); + } catch (error) { + event.stopImmediatePropagation(); + } } } - installInDesigner();" [ngClass]="themeService.isDarkMode() ? 'btn-light' : 'btn-primary'"> + installInDesigner(event);" [ngClass]="themeService.isDarkMode() ? 'btn-light' : 'btn-primary'"> {{ 'common.product.detail.install.buttonLabelInDesigner' | translate }} diff --git a/marketplace-ui/src/app/modules/product/product-detail/product-detail-version-action/product-detail-version-action.component.ts b/marketplace-ui/src/app/modules/product/product-detail/product-detail-version-action/product-detail-version-action.component.ts index 5437585cf..856bf6037 100644 --- a/marketplace-ui/src/app/modules/product/product-detail/product-detail-version-action/product-detail-version-action.component.ts +++ b/marketplace-ui/src/app/modules/product/product-detail/product-detail-version-action/product-detail-version-action.component.ts @@ -234,7 +234,7 @@ export class ProductDetailVersionActionComponent implements AfterViewInit { this.productService .sendRequestToUpdateInstallationCount( this.productId, - this.routingQueryParamService.getDesignerVersionFromCookie() + this.routingQueryParamService.getDesignerVersionFromSessionStorage() ) .subscribe((data: number) => this.installationCount.emit(data)); } diff --git a/marketplace-ui/src/app/modules/product/product-detail/product-detail.component.spec.ts b/marketplace-ui/src/app/modules/product/product-detail/product-detail.component.spec.ts index 1587fc146..d379ea5dc 100644 --- a/marketplace-ui/src/app/modules/product/product-detail/product-detail.component.spec.ts +++ b/marketplace-ui/src/app/modules/product/product-detail/product-detail.component.spec.ts @@ -45,7 +45,7 @@ describe('ProductDetailComponent', () => { beforeEach(async () => { const routingQueryParamServiceSpy = jasmine.createSpyObj( 'RoutingQueryParamService', - ['getDesignerVersionFromCookie', 'isDesignerEnv'] + ['getDesignerVersionFromSessionStorage', 'isDesignerEnv'] ); const languageServiceSpy = jasmine.createSpyObj( @@ -130,10 +130,10 @@ describe('ProductDetailComponent', () => { expect(component.selectedVersion).toEqual('Version 10.0.0'); }); - it('should get corresponding version from cookie', () => { + it('should get corresponding version from session strorage', () => { const targetVersion = '1.0'; const productId = 'Portal'; - routingQueryParamService.getDesignerVersionFromCookie.and.returnValue( + routingQueryParamService.getDesignerVersionFromSessionStorage.and.returnValue( targetVersion ); component.getProductById(productId, false).subscribe(productDetail => { diff --git a/marketplace-ui/src/app/modules/product/product-detail/product-detail.component.ts b/marketplace-ui/src/app/modules/product/product-detail/product-detail.component.ts index 6daf53420..eda8701dc 100644 --- a/marketplace-ui/src/app/modules/product/product-detail/product-detail.component.ts +++ b/marketplace-ui/src/app/modules/product/product-detail/product-detail.component.ts @@ -204,7 +204,7 @@ export class ProductDetailComponent { } getProductById(productId: string, isShowDevVersion: boolean): Observable { - const targetVersion = this.routingQueryParamService.getDesignerVersionFromCookie(); + const targetVersion = this.routingQueryParamService.getDesignerVersionFromSessionStorage(); let productDetail$: Observable; if (!targetVersion) { productDetail$ = this.productService.getProductDetails(productId, isShowDevVersion); diff --git a/marketplace-ui/src/app/modules/product/product.component.spec.ts b/marketplace-ui/src/app/modules/product/product.component.spec.ts index 31d4414dd..6f5d6841f 100644 --- a/marketplace-ui/src/app/modules/product/product.component.spec.ts +++ b/marketplace-ui/src/app/modules/product/product.component.spec.ts @@ -15,7 +15,7 @@ import { ProductComponent } from './product.component'; import { ProductService } from './product.service'; import { MockProductService } from '../../shared/mocks/mock-services'; import { RoutingQueryParamService } from '../../shared/services/routing.query.param.service'; -import { DESIGNER_COOKIE_VARIABLE } from '../../shared/constants/common.constant'; +import { DESIGNER_SESSION_STORAGE_VARIABLE } from '../../shared/constants/common.constant'; import { ItemDropdown } from '../../shared/models/item-dropdown.model'; import { By } from '@angular/platform-browser'; import { Location } from '@angular/common'; @@ -59,8 +59,8 @@ describe('ProductComponent', () => { 'getNavigationStartEvent', 'isDesigner', 'isDesignerEnv', - 'checkCookieForDesignerEnv', - 'checkCookieForDesignerVersion' + 'checkSessionStorageForDesignerEnv', + 'checkSessionStorageForDesignerVersion' ] ); @@ -75,7 +75,7 @@ describe('ProductComponent', () => { provide: ActivatedRoute, useValue: { queryParams: of({ - [DESIGNER_COOKIE_VARIABLE.restClientParamName]: true + [DESIGNER_SESSION_STORAGE_VARIABLE.restClientParamName]: true }) } }, @@ -210,7 +210,7 @@ describe('ProductComponent', () => { it('should set isRESTClient true based on query params and designer environment', () => { component.route.queryParams = of({ - [DESIGNER_COOKIE_VARIABLE.restClientParamName]: 'resultsOnly', + [DESIGNER_SESSION_STORAGE_VARIABLE.restClientParamName]: 'resultsOnly', }); routingQueryParamService.isDesignerEnv.and.returnValue(true); @@ -222,8 +222,8 @@ describe('ProductComponent', () => { it('should not display marketplace introduction in designer', () => { component.route.queryParams = of({ - [DESIGNER_COOKIE_VARIABLE.restClientParamName]: 'resultsOnly', - [DESIGNER_COOKIE_VARIABLE.searchParamName]: 'search' + [DESIGNER_SESSION_STORAGE_VARIABLE.restClientParamName]: 'resultsOnly', + [DESIGNER_SESSION_STORAGE_VARIABLE.searchParamName]: 'search' }); component.isDesignerEnvironment = true; diff --git a/marketplace-ui/src/app/modules/product/product.component.ts b/marketplace-ui/src/app/modules/product/product.component.ts index 46a8eac23..a041ae197 100644 --- a/marketplace-ui/src/app/modules/product/product.component.ts +++ b/marketplace-ui/src/app/modules/product/product.component.ts @@ -31,7 +31,7 @@ import { RoutingQueryParamService } from '../../shared/services/routing.query.pa import { DEFAULT_PAGEABLE, DEFAULT_PAGEABLE_IN_REST_CLIENT, - DESIGNER_COOKIE_VARIABLE + DESIGNER_SESSION_STORAGE_VARIABLE } from '../../shared/constants/common.constant'; import { ItemDropdown } from '../../shared/models/item-dropdown.model'; @@ -80,12 +80,13 @@ export class ProductComponent implements AfterViewInit, OnDestroy { constructor() { this.route.queryParams.subscribe(params => { this.isRESTClient.set( - DESIGNER_COOKIE_VARIABLE.restClientParamName in params && + DESIGNER_SESSION_STORAGE_VARIABLE.restClientParamName in params && this.isDesignerEnvironment ); - if (params[DESIGNER_COOKIE_VARIABLE.searchParamName] != null) { - this.criteria.search = params[DESIGNER_COOKIE_VARIABLE.searchParamName]; + if (params[DESIGNER_SESSION_STORAGE_VARIABLE.searchParamName] != null) { + this.criteria.search = + params[DESIGNER_SESSION_STORAGE_VARIABLE.searchParamName]; } }); diff --git a/marketplace-ui/src/app/shared/constants/common.constant.ts b/marketplace-ui/src/app/shared/constants/common.constant.ts index 7631e713b..f50652674 100644 --- a/marketplace-ui/src/app/shared/constants/common.constant.ts +++ b/marketplace-ui/src/app/shared/constants/common.constant.ts @@ -182,7 +182,7 @@ export const FEEDBACK_SORT_TYPES: ItemDropdown[] = [ } ]; -export const DESIGNER_COOKIE_VARIABLE = { +export const DESIGNER_SESSION_STORAGE_VARIABLE = { ivyViewerParamName: 'ivy-viewer', ivyVersionParamName: 'ivy-version', defaultDesignerViewer: 'designer-market', diff --git a/marketplace-ui/src/app/shared/services/routing.query.param.service.spec.ts b/marketplace-ui/src/app/shared/services/routing.query.param.service.spec.ts index 2bd01ae23..34ba79e3e 100644 --- a/marketplace-ui/src/app/shared/services/routing.query.param.service.spec.ts +++ b/marketplace-ui/src/app/shared/services/routing.query.param.service.spec.ts @@ -1,20 +1,15 @@ import { TestBed } from '@angular/core/testing'; import { Router, NavigationStart } from '@angular/router'; -import { CookieService } from 'ngx-cookie-service'; import { RoutingQueryParamService } from './routing.query.param.service'; import { Subject } from 'rxjs'; -import { DESIGNER_COOKIE_VARIABLE } from '../constants/common.constant'; +import { DESIGNER_SESSION_STORAGE_VARIABLE } from '../constants/common.constant'; describe('RoutingQueryParamService', () => { let service: RoutingQueryParamService; - let cookieService: jasmine.SpyObj; let eventsSubject: Subject; + let mockStorage: { [key: string]: string }; beforeEach(() => { - const cookieServiceSpy = jasmine.createSpyObj('CookieService', [ - 'get', - 'set' - ]); eventsSubject = new Subject(); const routerSpy = jasmine.createSpyObj('Router', [], { events: eventsSubject.asObservable() @@ -23,59 +18,61 @@ describe('RoutingQueryParamService', () => { TestBed.configureTestingModule({ providers: [ RoutingQueryParamService, - { provide: CookieService, useValue: cookieServiceSpy }, { provide: Router, useValue: routerSpy } ] }); service = TestBed.inject(RoutingQueryParamService); - cookieService = TestBed.inject( - CookieService - ) as jasmine.SpyObj; + mockStorage = { + 'ivy-viewer': 'designer-market', + 'ivy-version': '1.0' + }; + spyOn(sessionStorage, 'getItem').and.callFake((key: string) => { + return mockStorage[key] || null; + }); + + spyOn(sessionStorage, 'setItem').and.callFake((key: string, value: string) => { + mockStorage[key] = value; + }); }); it('should be created', () => { expect(service).toBeTruthy(); }); - it('should check cookie for designer version', () => { - const params = { [DESIGNER_COOKIE_VARIABLE.ivyVersionParamName]: '1.0' }; - service.checkCookieForDesignerVersion(params); - expect(cookieService.set).toHaveBeenCalledWith( - DESIGNER_COOKIE_VARIABLE.ivyVersionParamName, + it('should check session storage for designer version', () => { + const params = { + [DESIGNER_SESSION_STORAGE_VARIABLE.ivyVersionParamName]: '1.0' + }; + service.checkSessionStorageForDesignerVersion(params); + expect(sessionStorage.setItem).toHaveBeenCalledWith( + DESIGNER_SESSION_STORAGE_VARIABLE.ivyVersionParamName, '1.0' ); - expect(service.getDesignerVersionFromCookie()).toBe('1.0'); + expect(service.getDesignerVersionFromSessionStorage()).toBe('1.0'); }); - it('should check cookie for designer env', () => { + it('should check session storage for designer env', () => { const params = { - [DESIGNER_COOKIE_VARIABLE.ivyViewerParamName]: - DESIGNER_COOKIE_VARIABLE.defaultDesignerViewer + [DESIGNER_SESSION_STORAGE_VARIABLE.ivyViewerParamName]: + DESIGNER_SESSION_STORAGE_VARIABLE.defaultDesignerViewer }; - service.checkCookieForDesignerEnv(params); - expect(cookieService.set).toHaveBeenCalledWith( - DESIGNER_COOKIE_VARIABLE.ivyViewerParamName, - DESIGNER_COOKIE_VARIABLE.defaultDesignerViewer + service.checkSessionStorageForDesignerEnv(params); + expect(sessionStorage.setItem).toHaveBeenCalledWith( + DESIGNER_SESSION_STORAGE_VARIABLE.ivyViewerParamName, + DESIGNER_SESSION_STORAGE_VARIABLE.defaultDesignerViewer ); expect(service.isDesignerViewer()).toBeTrue(); }); - it('should get designer version from cookie if not set', () => { - cookieService.get.and.returnValue('1.0'); - expect(service.getDesignerVersionFromCookie()).toBe('1.0'); + it('should get designer version from session storage if not set', () => { + expect(service.getDesignerVersionFromSessionStorage()).toBe('1.0'); }); - it('should set isDesigner to true if cookie matches default designer viewer', () => { - cookieService.get.and.returnValue( - DESIGNER_COOKIE_VARIABLE.defaultDesignerViewer - ); + it('should set isDesigner to true if session storage matches default designer viewer', () => { expect(service.isDesignerViewer()).toBeTrue(); }); it('should listen to navigation start events', () => { - cookieService.get.and.returnValue( - DESIGNER_COOKIE_VARIABLE.defaultDesignerViewer - ); eventsSubject.next(new NavigationStart(1, 'testUrl')); expect(service.isDesignerViewer()).toBeTrue(); }); diff --git a/marketplace-ui/src/app/shared/services/routing.query.param.service.ts b/marketplace-ui/src/app/shared/services/routing.query.param.service.ts index 21568d314..47ccc4eee 100644 --- a/marketplace-ui/src/app/shared/services/routing.query.param.service.ts +++ b/marketplace-ui/src/app/shared/services/routing.query.param.service.ts @@ -1,6 +1,5 @@ import { computed, Injectable, signal } from '@angular/core'; -import { CookieService } from 'ngx-cookie-service'; -import { DESIGNER_COOKIE_VARIABLE } from '../constants/common.constant'; +import { DESIGNER_SESSION_STORAGE_VARIABLE } from '../constants/common.constant'; import { Router, Params, NavigationStart } from '@angular/router'; import { Observable } from 'rxjs'; import { filter } from 'rxjs/operators'; @@ -13,46 +12,51 @@ export class RoutingQueryParamService { designerVersion = signal(''); constructor( - private readonly cookieService: CookieService, private readonly router: Router ) { this.getNavigationStartEvent().subscribe(() => { if (!this.isDesigner()) { this.isDesigner.set( - this.cookieService.get( - DESIGNER_COOKIE_VARIABLE.ivyViewerParamName - ) === DESIGNER_COOKIE_VARIABLE.defaultDesignerViewer + sessionStorage.getItem( + DESIGNER_SESSION_STORAGE_VARIABLE.ivyViewerParamName + ) === DESIGNER_SESSION_STORAGE_VARIABLE.defaultDesignerViewer ); } }); } - checkCookieForDesignerVersion(params: Params) { - const versionParam = params[DESIGNER_COOKIE_VARIABLE.ivyVersionParamName]; + checkSessionStorageForDesignerVersion(params: Params) { + const versionParam = + params[DESIGNER_SESSION_STORAGE_VARIABLE.ivyVersionParamName]; if (versionParam !== undefined) { - this.cookieService.set( - DESIGNER_COOKIE_VARIABLE.ivyVersionParamName, + sessionStorage.setItem( + DESIGNER_SESSION_STORAGE_VARIABLE.ivyVersionParamName, versionParam ); this.designerVersion.set(versionParam); } } - checkCookieForDesignerEnv(params: Params) { - const ivyViewerParam = params[DESIGNER_COOKIE_VARIABLE.ivyViewerParamName]; - if (ivyViewerParam === DESIGNER_COOKIE_VARIABLE.defaultDesignerViewer) { - this.cookieService.set( - DESIGNER_COOKIE_VARIABLE.ivyViewerParamName, + checkSessionStorageForDesignerEnv(params: Params) { + const ivyViewerParam = + params[DESIGNER_SESSION_STORAGE_VARIABLE.ivyViewerParamName]; + if ( + ivyViewerParam === DESIGNER_SESSION_STORAGE_VARIABLE.defaultDesignerViewer + ) { + sessionStorage.setItem( + DESIGNER_SESSION_STORAGE_VARIABLE.ivyViewerParamName, ivyViewerParam ); this.isDesigner.set(true); } } - getDesignerVersionFromCookie() { + getDesignerVersionFromSessionStorage() { if (this.designerVersion() === '') { this.designerVersion.set( - this.cookieService.get(DESIGNER_COOKIE_VARIABLE.ivyVersionParamName) + sessionStorage.getItem( + DESIGNER_SESSION_STORAGE_VARIABLE.ivyVersionParamName + ) ?? '' ); } return this.designerVersion(); @@ -61,8 +65,9 @@ export class RoutingQueryParamService { isDesignerViewer() { if (!this.isDesigner()) { this.isDesigner.set( - this.cookieService.get(DESIGNER_COOKIE_VARIABLE.ivyViewerParamName) === - DESIGNER_COOKIE_VARIABLE.defaultDesignerViewer + sessionStorage.getItem( + DESIGNER_SESSION_STORAGE_VARIABLE.ivyViewerParamName + ) === DESIGNER_SESSION_STORAGE_VARIABLE.defaultDesignerViewer ); } return this.isDesigner();