Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[FIX] CXSPA-9334 Terms and condition URL not changed accordingly when… #19966

Merged
merged 12 commits into from
Feb 11, 2025
Merged
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,12 @@
<span class="form-check-label">
{{ 'checkoutReview.confirmThatRead' | cxTranslate }}
<a
[routerLink]="{ cxRoute: 'termsAndConditions' } | cxUrl"
[routerLink]="
{
cxRoute: 'termsAndConditions',
params: [params$ | async],
} | cxUrl
"
class="cx-tc-link"
target="_blank"
rel="noopener noreferrer"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,10 @@ import { Pipe, PipeTransform } from '@angular/core';
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
import { ReactiveFormsModule, UntypedFormGroup } from '@angular/forms';
import {
CurrencyService,
GlobalMessageService,
I18nTestingModule,
LanguageService,
RoutingService,
} from '@spartacus/core';
import { OrderFacade } from '@spartacus/order/root';
Expand Down Expand Up @@ -48,6 +50,12 @@ describe('CheckoutPlaceOrderComponent', () => {
let launchDialogService: LaunchDialogService;

beforeEach(waitForAsync(() => {
const mockCurrencyService = {
getActive: () => of('USD'),
};
const mockLanguageService = {
getActive: () => of('en'),
};
TestBed.configureTestingModule({
imports: [ReactiveFormsModule, I18nTestingModule, AtMessageModule],
declarations: [MockUrlPipe, CheckoutPlaceOrderComponent],
Expand All @@ -56,6 +64,8 @@ describe('CheckoutPlaceOrderComponent', () => {
{ provide: RoutingService, useClass: MockRoutingService },
{ provide: LaunchDialogService, useClass: MockLaunchDialogService },
{ provide: GlobalMessageService, useValue: {} },
{ provide: CurrencyService, useValue: mockCurrencyService },
{ provide: LanguageService, useValue: mockLanguageService },
],
}).compileComponents();
}));
Expand Down Expand Up @@ -100,6 +110,15 @@ describe('CheckoutPlaceOrderComponent', () => {
});
});

it('should combine currency and language into params$', (done) => {
component.ngOnInit();
component.params$.subscribe(([currency, language]) => {
expect(currency).toBe('USD');
expect(language).toBe('en');
done();
});
});

describe('Place order UI', () => {
beforeEach(() => {
controls.termsAndConditions.setValue(true);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,32 +8,41 @@ import {
ChangeDetectionStrategy,
Component,
ComponentRef,
inject,
OnDestroy,
OnInit,
ViewContainerRef,
} from '@angular/core';
import {
UntypedFormBuilder,
UntypedFormGroup,
Validators,
} from '@angular/forms';
import { RoutingService } from '@spartacus/core';
import {
CurrencyService,
LanguageService,
RoutingService,
} from '@spartacus/core';
import { OrderFacade } from '@spartacus/order/root';
import { LaunchDialogService, LAUNCH_CALLER } from '@spartacus/storefront';
import { Observable } from 'rxjs';
import { combineLatest, map, Observable } from 'rxjs';

@Component({
selector: 'cx-place-order',
templateUrl: './checkout-place-order.component.html',
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false,
})
export class CheckoutPlaceOrderComponent implements OnDestroy {
export class CheckoutPlaceOrderComponent implements OnDestroy, OnInit {
placedOrder: void | Observable<ComponentRef<any> | undefined>;

params$ = new Observable<string[]>();
checkoutSubmitForm: UntypedFormGroup = this.fb.group({
termsAndConditions: [false, Validators.requiredTrue],
});

private currencyService = inject(CurrencyService);
private languageService = inject(LanguageService);

get termsAndConditionInvalid(): boolean {
return this.checkoutSubmitForm.invalid;
}
Expand All @@ -46,6 +55,13 @@ export class CheckoutPlaceOrderComponent implements OnDestroy {
protected vcr: ViewContainerRef
) {}

ngOnInit() {
this.params$ = combineLatest([
this.currencyService.getActive(),
this.languageService.getActive(),
]).pipe(map(([currency, language]) => [currency, language]));
}

submitForm(): void {
if (this.checkoutSubmitForm.valid) {
this.placedOrder = this.launchDialogService.launch(
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,12 @@
[class.disabled]="isDisabled(i)"
>
<a
[routerLink]="{ cxRoute: step.routeName } | cxUrl"
[routerLink]="
{
cxRoute: step.routeName,
params: [params$ | async],
} | cxUrl
"
class="cx-link"
[attr.aria-current]="isActive(i) ? 'step' : null"
[attr.aria-disabled]="isDisabled(i) ? 'true' : null"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,11 @@ import { Pipe, PipeTransform } from '@angular/core';
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { CheckoutStep, CheckoutStepType } from '@spartacus/checkout/base/root';
import { I18nTestingModule } from '@spartacus/core';
import {
CurrencyService,
I18nTestingModule,
LanguageService,
} from '@spartacus/core';
import { BehaviorSubject, Observable, of } from 'rxjs';
import { CheckoutStepService } from '../services/checkout-step.service';
import { CheckoutProgressComponent } from './checkout-progress.component';
Expand Down Expand Up @@ -58,6 +62,12 @@ describe('CheckoutProgressComponent', () => {
let fixture: ComponentFixture<CheckoutProgressComponent>;

beforeEach(waitForAsync(() => {
const mockCurrencyService = {
getActive: () => of('USD'),
};
const mockLanguageService = {
getActive: () => of('en'),
};
TestBed.configureTestingModule({
imports: [I18nTestingModule],
declarations: [
Expand All @@ -67,6 +77,8 @@ describe('CheckoutProgressComponent', () => {
],
providers: [
{ provide: CheckoutStepService, useClass: MockCheckoutStepService },
{ provide: CurrencyService, useValue: mockCurrencyService },
{ provide: LanguageService, useValue: mockLanguageService },
],
}).compileComponents();
}));
Expand All @@ -89,6 +101,15 @@ describe('CheckoutProgressComponent', () => {
});
});

it('should combine currency and language into params$', (done) => {
component.ngOnInit();
component.params$.subscribe(([currency, language]) => {
expect(currency).toBe('USD');
expect(language).toBe('en');
done();
});
});

it('should contain link with "active" class', () => {
const step = fixture.debugElement.query(
By.css('.cx-item:nth-child(1) .cx-link')
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,21 +4,30 @@
* SPDX-License-Identifier: Apache-2.0
*/

import { ChangeDetectionStrategy, Component } from '@angular/core';
import {
ChangeDetectionStrategy,
Component,
inject,
OnInit,
} from '@angular/core';
import { CheckoutStep, CheckoutStepState } from '@spartacus/checkout/base/root';
import { BehaviorSubject, Observable } from 'rxjs';
import { tap } from 'rxjs/operators';
import { BehaviorSubject, combineLatest, Observable } from 'rxjs';
import { map, tap } from 'rxjs/operators';
import { CheckoutStepService } from '../services/checkout-step.service';
import { CurrencyService, LanguageService } from '@spartacus/core';

@Component({
selector: 'cx-checkout-progress',
templateUrl: './checkout-progress.component.html',
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false,
})
export class CheckoutProgressComponent {
export class CheckoutProgressComponent implements OnInit {
params$ = new Observable<string[]>();
private _steps$: BehaviorSubject<CheckoutStep[]> =
this.checkoutStepService.steps$;
private currencyService = inject(CurrencyService);
private languageService = inject(LanguageService);

constructor(protected checkoutStepService: CheckoutStepService) {}

Expand All @@ -32,6 +41,13 @@ export class CheckoutProgressComponent {
return this._steps$.asObservable();
}

ngOnInit(): void {
this.params$ = combineLatest([
this.currencyService.getActive(),
this.languageService.getActive(),
]).pipe(map(([currency, language]) => [currency, language]));
}

getTabIndex(stepIndex: number): number {
return !this.isActive(stepIndex) && !this.isDisabled(stepIndex) ? 0 : -1;
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,10 @@ import { Pipe, PipeTransform } from '@angular/core';
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
import { ReactiveFormsModule, UntypedFormGroup } from '@angular/forms';
import {
CurrencyService,
GlobalMessageService,
I18nTestingModule,
LanguageService,
RoutingService,
} from '@spartacus/core';
import {
Expand Down Expand Up @@ -91,6 +93,12 @@ describe('CheckoutScheduledReplenishmentPlaceOrderComponent', () => {
let scheduledReplenishmentOrderFacade: ScheduledReplenishmentOrderFacade;

beforeEach(waitForAsync(() => {
const mockCurrencyService = {
getActive: () => of('USD'),
};
const mockLanguageService = {
getActive: () => of('en'),
};
TestBed.configureTestingModule({
imports: [ReactiveFormsModule, I18nTestingModule, AtMessageModule],
declarations: [
Expand All @@ -113,6 +121,8 @@ describe('CheckoutScheduledReplenishmentPlaceOrderComponent', () => {
provide: GlobalMessageService,
useValue: {},
},
{ provide: CurrencyService, useValue: mockCurrencyService },
{ provide: LanguageService, useValue: mockLanguageService },
],
}).compileComponents();
}));
Expand Down
Loading