unit testing

-

 /* eslint-disable @typescript-eslint/no-unused-vars */

/* eslint-disable no-unused-expressions */
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { Store } from '@ngrx/store';
import { CaseIndicatorConfigurationComponent } from './case-indicator-configuration.component';
import { UserPreferencesCommonService } from '../services/common.service';
import { provideMockStore } from '@ngrx/store/testing';
import { CommonModule } from '@angular/common';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import {
  ReactiveFormsModule,
  FormsModule,
  FormGroup,
  FormControl,
  Validators,
} from '@angular/forms';
import { RouterTestingModule } from '@angular/router/testing';
import { OneWebComponentsAngularModule } from '@one/angular';
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { of } from 'rxjs';
import { I18NextModule } from 'angular-i18next';
import { I18N_PROVIDERS } from 'src/app/i18next/i18next';
import { snackbarService } from '@one/web-components';

// eslint-disable-next-line no-restricted-globals
fdescribe('CaseIndicatorConfigurationComponent', () => {
  let component: CaseIndicatorConfigurationComponent;
  let fixture: ComponentFixture<CaseIndicatorConfigurationComponent>;
  let store: jasmine.SpyObj<Store>;
  const getAllUserPreferences = {
    isLoading: false,
    allUserPreferences: [
      { prefName: 'AUT_FLAG_CASES', userPrefId: 358638, prefValue: '0' },
      { prefName: 'FLAG_CASE_YELLOW', userPrefId: 358638, prefValue: '0' },
      { prefName: 'FLAG_CASE_RED', userPrefId: 358638, prefValue: '0' },
    ],
  };
  const saveAllUserPreferences = {
    isLoading: false,
    responseStatus: { code: 1 },
    allUserPreferences: [
      { prefName: 'AUT_FLAG_CASES', userPrefId: 358638, prefValue: '0' },
      { prefName: 'FLAG_CASE_YELLOW', userPrefId: 358638, prefValue: '0' },
      { prefName: 'FLAG_CASE_RED', userPrefId: 358638, prefValue: '0' },
    ],
  };
  const initialState = {};
  // eslint-disable-next-line typescript-enum/no-enum, no-unused-vars
  const enum RADIO_VALUE_CHANGE {
    On = '1',
    Off = '0',
  }

  beforeEach(async () => {
    const apicallerServiceSpy = jasmine.createSpyObj(
      'UserPreferencesCommonService',
      ['selectAllUserPreferences', 'saveAllUserPreferences']
    );
    const storeserviceSpy = jasmine.createSpyObj('store', [
      'dispatch',
      'select',
    ]);

    await TestBed.configureTestingModule({
      imports: [
        HttpClientTestingModule,
        OneWebComponentsAngularModule,
        ReactiveFormsModule,
        RouterTestingModule,
        FormsModule,
        CommonModule,
        I18NextModule.forRoot(),
      ],
      declarations: [CaseIndicatorConfigurationComponent],
      providers: [
        provideMockStore({ initialState }),
        {
          provide: UserPreferencesCommonService,
          useValue: apicallerServiceSpy,
        },
        { provide: Store, useValue: storeserviceSpy },
        I18N_PROVIDERS,
      ],
      schemas: [CUSTOM_ELEMENTS_SCHEMA],
    })
      .compileComponents()
      .then(() => {
        store = TestBed.inject(Store) as jasmine.SpyObj<Store>;
      });

    fixture = TestBed.createComponent(CaseIndicatorConfigurationComponent);
    component = fixture.componentInstance;
    store.select.and.returnValue(
      await Promise.resolve(of(getAllUserPreferences))
    );
    store.select.and.returnValue(
      await Promise.resolve(of(saveAllUserPreferences))
    );
    component.caseIndicatorFormGroup = new FormGroup({
      txtYellow: new FormControl(
        { value: '', disabled: component.isInputDisabled },
        Validators.required
      ),
      txtRed: new FormControl(
        { value: '', disabled: component.isInputDisabled },
        Validators.required
      ),
    });
    component.caseIndicatorFormGroup.controls['txtYellow'].patchValue('2');
    // eslint-disable-next-line @typescript-eslint/no-unused-expressions
    component.caseIndicatorFormGroup.controls['txtRed'].patchValue('2');
    fixture.detectChanges();
  });
  describe('store test  onInit', () => {
    it('should get users from the store', () => {
      // eslint-disable-next-line @typescript-eslint/no-unused-expressions
      component.caseIndicatorFormGroup.controls['txtYellow'].patchValue('1');
      // eslint-disable-next-line @typescript-eslint/no-unused-expressions
      component.caseIndicatorFormGroup.controls['txtRed'].patchValue('2');
      store.select.and.returnValue(of(getAllUserPreferences));
      component.ngOnInit();
    });
  });
  it('should call formCancelled', () => {
    // eslint-disable-next-line @typescript-eslint/no-unused-expressions
    spyOn(snackbarService, 'show').and.callFake;
    spyOn<any>(component, 'confirmedByUserFromNotification').and.callThrough();
    component.formCancelled();
  });
  it('should call formcancelled', () => {
    // eslint-disable-next-line @typescript-eslint/no-unused-expressions
    spyOn(snackbarService, 'show').and.callFake;
    component.showSuccess('');
  });
  it('should call formcancelled', () => {
    // eslint-disable-next-line @typescript-eslint/no-unused-expressions
    spyOn(snackbarService, 'show').and.callFake;
    component.showError('');
  });

  // It('should call formCancelledClosed' , () =>{
  //   SpyOn(component.closeConfirmation, 'hide').and.callFake;
  //   Component.isFormDisabled = false;
  //   Component.formCancelledClosed();
  // })
  it('should call inputValueChange', () => {
    component.isFormDisabled = false;
    const ev = 'any';
    component.inputValueChange(ev);
    expect(component.isFormDisabled).toEqual(false);
  });
  it('should call saveCaseIndicator', () => {
    component.saveCaseIndicator();
  });
  it('should call onAutomaticFlagChange', () => {
    const data = component.isAutomaticFlagChange;
    component.onAutomaticFlagChange(data);
    component.isFormDisabled = false;
    expect(component.isFormDisabled).toEqual(false);
  });
  it('should call onAutomaticFlagChange', () => {
    const data = '1';
    component.onAutomaticFlagChange(data);
    component.isFormDisabled = true;
    expect(component.isFormDisabled).toEqual(true);
  });
  it('should create', () => {
    expect(component).toBeTruthy();
  });
});




import { Component } from '@angular/core';
import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
import { Store } from '@ngrx/store';
import { snackbarService } from '@one/web-components';
import { Subject, takeUntil } from 'rxjs';
import { AppState } from 'src/app/state/app-state';
import { resetCaseIndicator,  getAllUserPreferences, saveUserPreferences } from '../state/userPreferences.actions';
import { saveAllUserPreferences, selectAllUserPreferences } from '../state/userPreferences.selectors';
import { BACKEND_RESPONSE_CODE, TIMEOUTS } from 'src/types/enums';
import { t } from 'i18next';
export enum RADIO_VALUE_CHANGE {
  On  = "1",
  Off = "0"
}
@Component({
  selector: 'app-case-indicator-configuration',
  templateUrl: './case-indicator-configuration.component.html',
  styleUrls: ['./case-indicator-configuration.component.scss']
})
export class CaseIndicatorConfigurationComponent {
  private readonly destroyed$: Subject<any> = new Subject<any>();
  public caseIndicatorFormGroup !: FormGroup;
  public isFormDisabled: boolean = true;
  public isSubmitted:  boolean = false;
  public caseIndicatorData: any = [];
  public automaticFlag: any = [];
  public isAutomaticFlagChange: string = '0';
  public isInputDisabled: boolean = false;
  public flagCaseYellow: any;
  public flagCaseRed: any;
  public closeConfirmation: any;
  constructor(private readonly formBuilder: FormBuilder,    
    private readonly store: Store<AppState>,){

  }
  ngOnDestroy(): void {
    this.destroyed$.next(true);
    this.destroyed$.complete();
    this.store.dispatch(resetCaseIndicator());
  }
  ngOnInit(): void {
    this.initResetCaseIndicatorForm();
    if(this.isAutomaticFlagChange === RADIO_VALUE_CHANGE.Off){
      this.caseIndicatorFormGroup.get('txtYellow')?.disable();
      this.caseIndicatorFormGroup.get('txtRed')?.disable();
    }
    this.store.dispatch(getAllUserPreferences());
    this.store
    .select(selectAllUserPreferences)
    .pipe(takeUntil(this.destroyed$))
    .subscribe((res: any) => {
      if(res.isLoading === false){  
      this.caseIndicatorData = res;      
      this.automaticFlag =  this.caseIndicatorData.allUserPreferences.filter((d:any )=> d.prefName === "AUT_FLAG_CASES");
      this.isAutomaticFlagChange = this.automaticFlag[0].prefValue;  
      this.flagCaseYellow = this.caseIndicatorData.allUserPreferences.filter((d:any )=> d.prefName === "FLAG_CASE_YELLOW");
      this.flagCaseRed = this.caseIndicatorData.allUserPreferences.filter((d:any )=> d.prefName === "FLAG_CASE_RED");
      this.caseIndicatorFormGroup.setValue({txtYellow: this.flagCaseYellow[0].prefValue,txtRed:this.flagCaseRed[0].prefValue});
      }  
    });
    this.store
    .select(saveAllUserPreferences)
    .pipe(takeUntil(this.destroyed$))
    .subscribe((data:any) => {  
    if(data.isLoading === false){  
      if(data.responseStatus !== undefined){
        if(data.responseStatus.code === BACKEND_RESPONSE_CODE.Success){
          this.showSuccess(t('dataManagement.requests.saved'));
        }else{
          this.showError(data.message);
        }
      }  
      if(data.allUserPreferences){
          this.caseIndicatorData = data;  
          this.automaticFlag =  this.caseIndicatorData.allUserPreferences.filter((d:any )=> d.prefName === "AUT_FLAG_CASES");
          this.isAutomaticFlagChange = this.automaticFlag[0].prefValue;  
          this.flagCaseYellow = this.caseIndicatorData.allUserPreferences.filter((d:any )=> d.prefName === "FLAG_CASE_YELLOW");
          this.flagCaseRed = this.caseIndicatorData.allUserPreferences.filter((d:any )=> d.prefName === "FLAG_CASE_RED");
          this.caseIndicatorFormGroup.setValue({txtYellow: this.flagCaseYellow[0].prefValue,txtRed:this.flagCaseRed[0].prefValue});
          this.isFormDisabled =true;
      }
    }
    });
   
   
  }
  public initResetCaseIndicatorForm(){
    this.caseIndicatorFormGroup = new FormGroup({
      txtYellow: new FormControl({value: '', disabled: this.isInputDisabled}, Validators.required),
      txtRed: new FormControl({value: '', disabled: this.isInputDisabled },Validators.required)
    });
 
  }
  public formCancelled() {
    let msg = t('common.messages.cancel');
    this.isFormDisabled = true;
    this.closeConfirmation = snackbarService.show({
      message: msg,
      action: 'Yes',
      actionBtn: () => this.confirmedByUserFromNotification(),
      close: () => this.formCancelledClosed(),
      duration: 0,
      type: 'info',
      verticalPlacement: 'top',
      horizontalPlacement: 'center',
    });
  }

  public formCancelledClosed() {
    this.isFormDisabled = false;
    this.closeConfirmation.hide();
  }
  public inputValueChange(ev:any){
     this.isFormDisabled = false;
  }
  public saveCaseIndicator(){
    this.isSubmitted = true;
    if(this.caseIndicatorFormGroup.valid || this.caseIndicatorFormGroup.status === "DISABLED"){
      this.isSubmitted = false;
      let automatic  = {prefName : this.automaticFlag[0].prefName,userPrefId:this.automaticFlag[0].userPrefId, prefValue:this.isAutomaticFlagChange};
      let yellowFlag = {prefName : this.flagCaseYellow[0].prefName,userPrefId:this.flagCaseYellow[0].userPrefId, prefValue:this.caseIndicatorFormGroup.value.txtYellow};
      let redFlag    = {prefName : this.flagCaseRed[0].prefName,userPrefId:this.flagCaseRed[0].userPrefId, prefValue:this.caseIndicatorFormGroup.value.txtRed};
      let caseData   = [];
      caseData.push(automatic,yellowFlag,redFlag)
      let payload =  caseData;
      this.store.dispatch(saveUserPreferences({ payload }));
    }
  }
  public onAutomaticFlagChange(data:any){  
    this.isAutomaticFlagChange = data;
    if(data === RADIO_VALUE_CHANGE.Off){  
      this.caseIndicatorFormGroup.get('txtYellow')?.disable();
      this.caseIndicatorFormGroup.get('txtRed')?.disable();
      this.isFormDisabled = false;
      this.caseIndicatorFormGroup.setValue({txtYellow: this.flagCaseYellow[0].prefValue,txtRed:this.flagCaseRed[0].prefValue});
    }else{
      this.caseIndicatorFormGroup.get('txtYellow')?.enable();
      this.caseIndicatorFormGroup.get('txtRed')?.enable();
      this.isFormDisabled  = true;
    }
  }
  public showError(message: string) {
    snackbarService.show({
      message,
      duration: 0,
      type: 'error',
      verticalPlacement: 'top',
      horizontalPlacement: 'center',
    });
  }
  public showSuccess(message: string) {
    snackbarService.show({
      message,
      duration: TIMEOUTS.StandardNotificationTimeout,
      type: 'success',
      verticalPlacement: 'top',
      horizontalPlacement: 'center',
    });
  }
  private confirmedByUserFromNotification() {
    this.isFormDisabled = true;
    this.isAutomaticFlagChange = this.automaticFlag[0].prefValue;  
    this.caseIndicatorFormGroup.setValue({txtYellow: this.flagCaseYellow[0].prefValue,txtRed:this.flagCaseRed[0].prefValue});
    this.closeConfirmation.hide();
  }
}


Comments

Post a Comment

Popular posts from this blog

How to Add Firebase Analytics to Your NativeScript Mobile App

-
Image
tns plugin add nativescript-plugin-firebase reference links: https://github.com/EddyVerbruggen/nativescript-plugin-firebase . https://github.com/EddyVerbruggen/nativescript-plugin-firebase/issues/1171 . https://dzone.com/articles/how-to-add-firebase-analytics-to-your-nativescript . Prerequisites Before starting, you need to create a new Firebase application using your Google account. This happens with just a few clicks. Firebase provides a free tier which covers entirely all Analytics services, so you don't need to take out your credit card. Navigate to  https://firebase.google.com , authenticate with your Google credentials and follow the "Add project" wizard. In general, you don't need to change any of the default options in "Step 3," unless you have specific requirements related to services other than "Analytics." In your newly created project, you have to navigate to the project settings and add iOS and Android applicatio...
Read more

sidemenu refresh through events

-
create service ionic g service service name import {Injectable} from '@angular/core'; import {Subject} from 'rxjs'; @Injectable({     providedIn: 'root' }) export class GlobalFooService {     private fooSubject = new Subject<any>();     publishSomeData(data: any) {         this.fooSubject.next(data);     }     getObservable(): Subject<any> {         return this.fooSubject;     } } Now, you can subscribe in any component like app.component.ts: @Component({     selector: 'app-root',     templateUrl: 'app.component.html',     styleUrls: ['app.component.scss'] }) export class AppComponent {     constructor(private globalFooService: GlobalFooService) {         this.initializeApp();     }     initializeApp() {         // other code         this.globalFooService.get...
Read more

push multiple data in array(select and disselect items in array)

-
 <ion-content> <h1 class="h1 margin">Following</h1> <ion-row>   <ion-col size="12" *ngFor="let data of followingdata" (click)="select(data)">     <div  class="newcssbg"  [ngStyle]="{'background-image': 'url(' + data.img +  ')'}">       <div class="overlay">       <p class="innertext">{{data.text}}       <ion-icon *ngIf="data.selected" style="color:#fff;float:right;" name="checkmark-circle-outline"></ion-icon>       </p>    </div>     </div>   </ion-col> </ion-row> </ion-content> <!-- [ngStyle]="data.selected  && {'border': '2px solid green'}" --> ts  select(data) {     // this.followingdataarray.push(data);     this.followingdata.map(e => {               if(e.id==data.id){  ...
Read more