Jasmine was surprised when an error occurred while trying to create a spy object

I'm trying to simulate and meet the else condition for the method below, but I keep receiving an error stating Expected spy modalService.open not to have been called.

Below is the code snippet of the component:

After changing the line component.isError = true;

The If block wasn't highlighted, yet the error persists

public importDeals(upload, list) {
  this.fileName = '';
   let ngbModalOptions: NgbModalOptions = {
    backdrop : 'static',
    keyboard : false,
    windowClass: 'custom-class'
};   
if (!this.isError) {
  this.uploadModalRef = this.modalService.open(upload, ngbModalOptions);
}
this.tempContingency = list;
}

Here's the current unit test case (Jasmine)

it('should import deals', () => {
  // component.importDeals;
  // expect(component.importDeals('upload','list')).toBeUndefined();
  component.importDeals;
  component.uploadModalRef = jasmine.createSpyObj('uploadModalRef', ['close']);
  let mockOptions: NgbModalOptions = {
    backdrop : 'static',
    keyboard : false,
    windowClass: 'custom-class'
  };
  const mockConfirm = 'confirm-template';
  component.importDeals(mockConfirm,'');
  expect(modalService.open).toHaveBeenCalledWith(mockConfirm, mockOptions);
});
it('should not import deals', () => { 
  component.importDeals; 
  component.modalService = jasmine.createSpyObj('modalService',['open'])
  const mockConfirm = 'confirm-template'; 

  component.importDeals(mockConfirm,''); 
  expect(modalService.open).not.toHaveBeenCalled(); 
  });

Please advise on what could be causing the issue here. Thank you.

Answer №1

To ensure that the if block does not execute, make sure to set the value of isError to true.

it('should prevent importing deals', () => { 
  component.importDeals; 
  component.modalService = jasmine.createSpyObj('modalService',['open']);
  component.isError = true; // <- don't forget this line
  const mockConfirm = 'confirm-template'; 

  component.importDeals(mockConfirm,''); 
  expect(modalService.open).not.toHaveBeenCalled(); 
});

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

Creating a loading screen in Angular 4: Insert an item into the HTML and then set it to disappear automatically after

I'm dealing with a loading screen that typically takes between 15-30 seconds to load about 50 items onto the page. The loading process displays each item on the page using the message: Loading item x For each data call made to the database, an obser ...

Issue with Ngx Bootstrap Tooltip 10 compatibility with Angular 15 and Bootstrap 15

I have tried following the guidelines for displaying tooltips from , but unfortunately, I'm facing an issue where the tooltip is not appearing as expected. The tooltip is linked to this specific div: https://i.sstatic.net/TuYFF.png However, when ho ...

Is there a preferred method in RxJS for handling snapshotChanges()?

Currently, my code includes an auth.service.ts, crud.service.ts, and a components.ts. Although it functions correctly, it is a hodgepodge of various tutorials and documentation. I am seeking advice on how to streamline the code by centralizing all logic ...

Using Angular 2: Applying a specific class to a single element with [ngClass]

I have a header table with arrows indicating sorting order, using Bootstrap icons. However, when I click on a column, all columns receive the icon class. Here is an example of what I mean: https://i.sstatic.net/CAS81.png Below is the code snippet: HTML ...

Do not include properties with the NestJs condition

When responding to a Public route, I want to ensure that my users' emails are not exposed. However, I still need to access them from other routes that utilize a bearer JWT authentication system. This is the type of code I am looking to implement: @C ...

Utilizing watcher with computed property in TypeScript VueJS: A comprehensive guide

I'm in the process of creating a unique component that permits the use of any <div> elements as radio buttons. Here is my current code implementation: <template> <div class="radio-div" :class="selected ? 'select ...

Exploring the hidden gems of npm package.json: the keys

There are some keys in the package.json file of Angular 2/4's source code that remain undocumented: { "name": "@angular/platform-browser/animations", "typings": "../animations.d.ts", "main": "../bundles/platform-browser-animations.umd.js", "m ...

Troubleshooting Angular 7 Build Failure: Missing Typescript .d.ts Declaration Files for Ahead-of-Time Compilation

I have encountered difficulties in building my Angular 7 application after upgrading from v6. When I use ng build, everything runs smoothly. However, when I try either ng serve --aot, ng build --aot, or ng build --prod (which also includes aot), an error ...

How to dynamically style table cells in Angular 11 using ng-class and *ngFor

Currently, I am working on populating a table by looping through an array using *ngFor directive. Although the table is getting populated successfully, I am looking to dynamically change the background color of a cell based on the value it contains. For i ...

Leveraging the Angular Material 2 table component to showcase data fetched from the backend system according to the user's present location

This question is similar to another one about how to get the current location in Typescript and pass it to a backend, which was answered by libertyernie. However, this time I need help with integrating the current location into an Angular Material 2 table ...

Issues with Typescript when Adding Objects to an Array in a Function

In my Angular 2 application, I am encountering a problem when trying to add new items to an array. The issue appears to be related to Typescript types, although I'm not entirely certain. Here is the current structure of the array I am attempting to mo ...

The URL may change, but Angular remains on the same page without navigating

I am encountering an issue with 2 links in my application. The first time I click on any one of them, it navigates to the corresponding page without any problem. However, when I click on the second link after that, the URL changes but the navigation does n ...

What is the best method to utilize angular 2 cli for copying css and essential files to the dist folder?

After setting up my Angular 2 TypeScript solution and including the material Angular 2 npm package, I followed these steps: npm install -g angular-cli ng new PROJECT_NAME cd PROJECT_NAME ng build The files were successfully transferred from my source fol ...

Using a package manager with Deno: Best practices and tips

I just learned about Deno, the alternative to NodeJS. I'm trying to figure out how to use yarn or npm with Deno, but I can't seem to find any instructions. Is there a way to use yarn or npm with Deno? ...

Ways to restrict the values allowed in a TypeScript type?

I have a requirement: type AllowedKeys = 'a' | 'b' | 'c' ... and now I want to define a type where the key has to be one of the values in AllowedKeys. For example: type MyType = { a: number; b: string; c: boolean; d: {} / ...

Is there a way to spy on private functions within a node module using jasmine-node?

mainApp.js function _hidden() { console.log( '_hidden' ); } function show() { console.log( 'showing' ); _hidden(); } module.exports = { show: show, _hidden: _hidden }; test/mainTest.js describe( 'testing&ap ...

Enhance the AutoComplete/Autosuggest input component by improving its focus feature

I'm struggling to automatically set focus on the Autosuggest input element in function components using React/TypeScript. Despite trying various solutions, I have not been successful. Below is the unmodified full code. NumberAutoForm.tsx import R ...

Leveraging Typescript Definitions Files from Definitely Typed with an Outdated Typescript Version

I've been struggling with integrating third party React component libraries into my project that uses Typescript 1.8.10 along with React and Redux. Specifically, I've been attempting to use React Date Picker, but have encountered issues due to th ...

Having trouble importing the datamap library into the HTML of an Angular 2 application

I am currently in the process of developing a small Angular 2 application for educational purposes, and my intention is to incorporate datamaps for the map interface. However, there is no directive available for this library yet, so I am experimenting wit ...

Retrieve the previous value of the selection change with the Mat Select function

In my current project, I have a form with a mat-select dropdown. Whenever the user makes a selection, a dialog pops up to confirm the choice. However, I am facing an issue: The selectionChange() event is triggered when the value changes and provides the n ...