Typescript-syntax - Hur man spionerar på en Ajax-förfrågan?

Jag försöker skriva ett enhetstest där jag vill verifiera att ett ajax-anrop har gjorts. Koden är enkel:

it('test spycall',()=>{
spyOn($,"ajax");
//my method call which in turns use     ajax
MyFunc();
expect($.ajax.calls.mostRecent().args[0]["url"].toEqual("myurl");
});

Felet som jag får :

Egenskapen 'calls' finns inte på typen '{settings:jqueryAjaxSettings):jQueryXHR;(url:string, settings?:JQueryAjaxSettings}

Svar #1

$.ajax.calls, bland annat, är en del av Jasmine-testningsramverket, inte JQuery i sig (Som du vet, Jasmine (eller snarare, Jasmine-Jquery, pluginen du använder) lägger till vissa felsökningsfunktioner i JQuerýs prototyp för att, ja, kunna testa ajax-anrop).

Det dåliga är att din .d.ts TypeScript-definitionsfil, filen som fungerar som ett gränssnitt mellan TypeScript och rena JS-bibliotek, inte är medveten om Jasmines funktioner.

Det finns flera sätt du kan närma dig att åtgärda detta, som

  • ser om någon har justerat JQuery .d.ts-filen för Jasmines funktioner eller
  • skapa den nya .d.ts-filen själv genom att ändra den ursprungliga eller, (vad jag skulle göra)
  • skriva över TypeScript-definitionen genom att deklarera $.ajax som any, eller att inte inkludera TypeScript-definitionen alls i din testkodbas och deklarera $ som any.

Svar #2

Det finns 2 sätt att bli av med felet:

// 1
expect(($.ajax as any).calls.mostRecent().args[0].url).toEqual("myurl");

// 2
let ajaxSpy = spyOn($,"ajax");
expect(ajaxSpy.calls.mostRecent().args[0].url).toEqual("myurl");

Du kan också använda partiell matchning:

expect(($.ajax as any).calls.mostRecent().args).toEqual([
  jasmine.objectContaining({url: "myurl"})
]);