getItemForm does not make a second promise call

I have a scenario where my function calls the api.send service twice, however when I run a test expecting it to resolve both promises, only res1 is returned and not res2. How can I ensure that both promises are resolved successfully?

Here is my function:

handleItems = () => {
              this.api.send('filter', 'get', { lang: 'ES', filter: { id: this.item['id'] } }).then(res1 => {
                this.item = res1['data'][0];
                this.api.send('filter', 'get', { lang: 'EN', filter: { id: this.item['id'] } }).then(res2 => {
                  let itemEng = res2['data'][0];
                });
              });
            };

This is my test case:

it('should invoke api.send with English result', () => {
            
            component.formDef = [{ field_id: 57, field_key: "name1", field_name: 'test1' }];
            let res1 = { data: [{ id: 1, name: 'test1' }, { id: 2, name: 'test1' }] };
            let res2 = { data: [{ id: 1, name: 'test2' }, { id: 2, name: 'test' }] };
            component.item = let item = {id:1, count: 1, data:[{id: 1, tacticas: {95: [135]}}]};

            let spy1 = spyOn(api, 'send').and.returnValues(Promise.resolve(res1), Promise.resolve(res2));

            component.itemToForm();

            expect(spy1).toHaveBeenCalled();
            expect(spy1).toHaveBeenCalledTimes(2);

Answer №1

It is imperative that the implementation of your function be altered. Currently, it does not return anything, and it is unclear how you are accessing res1. Consider revising it as follows:

getItemForm = async () => {
              const res1 = await this.api.send('filter', 'get', { lang: 'ES', filter: { id: this.item['id'] } }),
                    res2 = await this.api.send('filter', 'get', { lang: 'EN', filter: { id: this.item['id'] } })     
               return {res1, res2};         
};

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

Exploring the Functionality of the MatSlideToggleChange Event in the mat-slide-toggle Component

I want to create a form that switches between two dropdown menus using a switch. Is it possible to use the MatSlideToggleChange event from the MatSlide class to make this happen? ...

React Material UI Select component is failing to recognize scrolling event

Having some difficulty understanding how to detect a scroll event with a Select component using Material-UI. The Select has MenuProps={...}, and I want to listen for the scroll event inside it. I've tried putting onScroll within MenuProps={...}, but ...

Angular does not wait for the backend service call response in tap

Does anyone have a solution for subscribing to responses when the tap operator is used in a service? edit(status) { dataObj.val = status; // call post service with status.. this.service .update(dataObj) .pipe(takeUntil(this._n ...

When using Angular server-side pagination with ngrx and Express in Node.js, I often encounter discrepancies in the indexing across different stacks

After successfully implementing server-side pagination in Angular, I encountered an issue where the page was set to 1 initially, but the mat-paginator component started at index 2. Despite functioning correctly when changing pages, this discrepancy puzzled ...

The Auth0 callback function is functioning properly in the development environment of my Angular 2 (4) application

While testing my Angular 4 login with Auth0 in development mode using localhost:4000/callback as the redirectUri for my auth0.WebAuth, everything works smoothly. However, when transitioning to production and changing the redirectUri = https://example.com/ ...

Error: Angular 4 encountered an unexpected character and could not parse

I am encountering an issue with a code snippet that looks like this: persona = { ... edadNiño = 9 } I'm trying to bind it using the following syntax: <input type="number" name="edadNiño" [(ngModel)] = "persona.edadNiño"> However, when I a ...

Using ngrx, only the Array inside the Object retrieved by the GET-response is required

My issue involves using ngrx and trying to receive an Array of type "ReceivingObject". However, the problem arises when the GET-response returns it as an Array inside an Object structure. { "receivingObject": [ { "type": "xxx", "value": ...

In Visual Studio, the .js.map files and .js files seem to be mysteriously hidden, leaving only the TypeScript .ts files visible

In the past, I utilized Visual Studio Code for Angular 2 development and had the ability to hide .js and .js.map files from the IDE. Now, I am working on a project using VS 2017 Professional with Typescript, Jasmine, Karma, and Angular 4. Task Runner, etc. ...

Angular: ensure the form reverts to its initial value when the modal is closed and reopened

I am facing an issue with my items section. When I click on an item, a modal window opens allowing me to edit the text inside a textarea. However, if I make changes to the text and then cancel or close the modal, upon reopening it, the previously modified ...

Passing parameters to an Angular 2 component

When it comes to passing a string parameter to my component, I need the flexibility to adjust the parameters of services based on the passed value. Here's how I handle it: In my index.html, I simply call my component and pass the required parameter. ...

Unable to simulate a static method in Vitest - encountering an error stating "is not a function"

I am currently writing unit tests using the Vitest framework for my TypeScript and React application, but I have encountered an issue with mocking static methods. Below is a snippet of my code: export class Person { private age: number; constructor(p ...

The process of subscribing to a service in Angular

I currently have 3 objects: - The initial component - A connection service - The secondary component When the initial component is folded/expanded, it should trigger the expansion/folding of the secondary component through the service. Within the service ...

Having trouble with Angular 2 and localhost/null error while attempting to make an http.get request?

In my Angular 2 webpage, I am using the OnInit function to execute a method that looks like this (with generic names used): getAllObjects(): Promise<object[]>{ return this.http.get(this.getAllObjectsUrl).toPromise().then(response => response. ...

The quick and easy guide to effortlessly removing and adding classes using Angular's Renderer2

Is there a way to efficiently add and remove a class from an element with just two lines of code, instead of using multiple if-else statements? Have you tried this method? (It's not working for me though.) constructor(private renderer: Renderer2,priv ...

Tips for developing a strongly-typed generic function that works seamlessly with redux slices and their corresponding actions

Currently, I am working with @reduxjs/toolkit and aiming to develop a function that can easily create a slice with default reducers. Although my current implementation is functional, it lacks strong typing. Is there a way to design a function in such a man ...

What is the proper way to specify the interface as Dispatch<Action>?

My goal is to create an interface with the dispatch function without using Redux. interface DispatchProps { dispatch: (action: { type: string }) => void; } export function addTwoToNumber({ dispatch }: DispatchProps) { dispatch({ type: '@addTwo ...

Showcase Ionic Validation - exhibit error messages reminiscent of material design

I've been working on a Login and Registration Page in Ionic 5. I wanted to showcase error messages beneath the input text field like shown in this example https://i.stack.imgur.com/d83ZV.png Thus, I integrated Angular Responsive Forms into my projec ...

Calling a function within another function

In my code, I have a function that formats the price and retrieves the value needed for refactoring after upgrading our dependencies. I'm struggling with passing the form value to the amountOnBlur function because the blur function in the dependencie ...

What is the best approach to apply type casting in an *ngFor loop for an array containing a variety of types in Angular?

I am facing a scenario where I have two objects named DeviceA and DeviceB, both belonging to the same parent class called Device. interface Device { shared: string } interface DeviceA extends Device { attributeA: string[] } interface DeviceB extends ...

A helpful guide on showcasing error messages at the top of a form in Angular using reactive forms

I have a Validation summary component that is designed to fetch an ngForm, but it is currently unable to subscribe to status changes or value changes and display the summary of error messages. export class CustomValidationSummaryComponent implements OnIni ...