I have noticed that my unit test case does not include coverage for the if statement

Here is the function I have in my TypeScript file:

routeToIndividualPortal(sessionToken: string) {
    let redirectUrl = this.relayState;
    console.log("Pre-source-check Indivual URL : " + redirectUrl);
    let url = "";
    if(redirectUrl.includes(this.envSvc.environment.peakAppId)){
      url = this.sessionTokenUrl + sessionToken + "&redirectUrl=" + this.relayState;
      console.log("peak url : " + url);
    }
    else{
      url = this.sessionTokenUrl + sessionToken + "&redirectUrl=" +this.individualLoginRouterUrl + "&requestedUrl=" + redirectUrl
      console.log("C4 url : " + url);
    }
    console.log("window.location.href : " + url);
    window.open(url);
  }

And here is the test case that I have written, it is passing but only covering the else part and not the if part:

it('test routeToIndividualPortal', () => {
    envSvc = new EnvironmentService(window);
    envSvc.environment = new Environment();
    envSvc.environment.peakAppId = 'RelayState=0oartebbbbs4KnvOK0h7';
    let sessionToken = "randomstuffljbn";
    let redirectUrl = "";
    expect(component.relayState).toEqual(redirectUrl);

    spyOn(window, 'open');
    component.ngOnInit();
    component.routeToIndividualPortal(sessionToken);
    fixture.detectChanges();
    expect(component.loginInvalid).toBeTruthy();
  });

I am unsure of what I might be missing here, so any assistance in identifying where I went wrong would be greatly appreciated!

Answer №1

It's difficult to provide a definitive answer without a live example on a platform like stackblitz, as we can't see the exact values in your code. One suggestion is to run the test in a debugger and set a breakpoint at the if statement, or use console.log to output all the values.

However, judging from the snippet you shared:

let redirectUrl = "";
expect(component.relayState).toEqual(redirectUrl);

it seems that relayState is an empty string. Therefore, when you assign it to the variable redirectUrl in your function:

let redirectUrl = this.relayState

it will also be an empty string, causing the condition:

redirectUrl.includes(this.envSvc.environment.peakAppId)

to always evaluate to false.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the most reliable way to create an array ensuring that all potential values come from a specific dictionary?

I am seeking a method to define the testArray so that only keys from the example dictionary can be inserted into the array. enum example { key1 = 'A', key2 = 2, key3 = '3', }; const testArray: ?? = [example.key1, example.ke ...

What is the necessity of ngrx/store when services and localStorages are available for use?

When it comes to Angular, we rely on ngrx/store to manage the state. However, I question whether all tasks can be effectively handled using services alone. What benefits does implementing the ngrx/store package offer? Your insights would be greatly appre ...

Verify if the property in every element of the array is not empty

How can you determine if all employees have a non-null value for the SSN property in the given object? Employees: { id: 0, name: "John", SSN: "1234" } { id: 1, name: "Mark", SSN: "1876" } { id: 2, name: "Sue&q ...

The conventional method for including React import statements

I'm curious if there is a standard convention for writing import statements in React. For instance, I currently have the following: import React, { useState, FormEvent } from 'react'; import Avatar from '@material-ui/core/Avatar'; ...

What is the best way to integrate Emotion styled components with TypeScript in a React project?

Currently, I am delving into TypeScript and attempting to convert a small project that utilizes Emotion to TypeScript. I have hit a roadblock at this juncture. The code snippet below export const Title = styled.div(props => ({ fontSize: "20px", ...

Setting up "connect-redis" in a TypeScript environment is a straightforward process

Currently, I am diving into the Fullstack React GraphQL TypeScript Tutorial I encountered an issue while trying to connect Redis with express-session... import connectRedis from "connect-redis"; import session from "express-session"; ...

Exploring the power of Angular's ViewChildren to iterate through QueryList items

My ngFor loop includes child components: @ViewChildren(SingleMultiSelectionComponent) singleMultiSelections: QueryList<SingleMultiSelectionComponent>; I am attempting to iterate through this QueryList: console.log(this.singleMultiSelections); // 1 i ...

Tips on eliminating expansion upon button click in header within an Angular application

While utilizing Angular Materials, I encountered a challenge with the mat-expansion component. Every time I click on the buttons within the expansion panel, it closes due to the default behavior of mat-panel. Requirement - The panel should remain expanded ...

Solving Typing Problems in React TypeScript with "mui-icons" Props

I have a small compost project with only an App.JSX file that is functioning perfectly, but now I need to convert it to App.TSX. After changing the extension to .TSX, I encountered two errors that I'm unsure how to resolve. function MyComponentWithI ...

Exploring observables for querying the OMDB API and obtaining information on movies

Hey everyone, I'm currently working on implementing a live search feature using Observables in Angular2 to fetch Movie data from the OMDB API. While I can see that it is functioning correctly in the Chrome Network tab, the results aren't showing ...

Utilizing Anglar 16's MatTable trackBy feature on FormGroup for identifying unaltered fields

In my application, I am working with a MatTable that has a datasource consisting of AbstractControls (FormGroups) to create an editable table. At the end of each row, there are action buttons for saving or deleting the elements. My goal is to implement tr ...

Tips for managing the data type of a bound value through ngModel: preventing number distortion to string

I posted a query and managed to solve it. However, I observed that even though the provided data consists of objects defined like this: export interface GisPoint { e: number; n: number; } when a user inputs a value, the original content changes from { e: ...

Tips for differentiating between elements with identical values in an HTML datalist using Angular

My boss is insisting that I use a datalist in our website interface to select an employee, even though there's no way to determine if the user typed in the name or picked from the list. The challenge is that the list must only display full names, but ...

Ways to resolve the angular error "Encountering an unhandled exception: Unable to locate module 'typescript' "?

I'm encountering errors when running ng serve. I've attempted the following code as well, but I'm still facing the same error: npm install -g typescript Error displayed in text format D:\xampp\htdocs\angular\axen>ng ...

What is the way to assign a variable to ngClass in Angular?

I'm currently working on creating modals that will display different content based on which button is clicked. Each button should trigger a unique modal to appear, each with its own specific content inside. When a button is clicked, the 'active&a ...

Angular2 - HTML not displaying the response

I am currently mastering angularjs2. In my latest project, I attempted to fetch data from an API and received a response successfully. However, I encountered an issue where the response is not rendering in homepage.component.html as expected. I am unsure o ...

Implementing Azure AD authentication with Angular and .NET Core 2 Web API

My goal is to implement authentication in my application using Azure AD Currently, the flow of my application looks like this: User -> AngularApp -> Azure Login -> AngularApp with token -> API Call to backend with token -> Backend verifies token with Azu ...

Why would npm be unable to locate a file, potentially leading to an error? Could the lack of contents in my node_modules subfolder be the root cause of this issue?

I'm encountering an issue while attempting to execute npm install in the angular project directory obtained from ASP.NET Boilerplate. The error I'm facing is related to npm's inability to locate a specific file. D:\Dev\AspNetBoiler ...

Testing localStorage with sinon can be done by setting up unit tests

Experimenting with localStorage testing through sinon. As a newcomer to unit testing, I might be tackling something basic. Latest Development I was able to put together this code, but now encountering a new error Should wrap property of object Test Scen ...

I am encountering a TypeScript error when using the createRef() method in React JS

Encountering some TypeScript warnings with the following dependencies: <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="8df9f4fde8feeeffe4fdf9cdbea3b8a3bf">[email protected]</a>, <a href="/cdn-cgi/l/email-protect ...