Typescript's mock function allows developers to create mock implementations of

Here is the code that needs to be mocked:

const P = {
    scripts: {
        getScripts: (name?: any) => {
            // do some stuff and return json
            return { foo: 'value'};
        }
    }
}
export default P;

The code needing to be tested:

export const getScripts = (name?: string) => {
   return P.scripts.getScripts(name); // I want a mock being called here
};

I have successfully used sinonJS for my tests:

const fakeGetScript = sinon.fake.returns({
    foo: 'fakeValue'
});

However, I am struggling to replace the original getScript function of P with my fake one.

Any suggestions on how to achieve this?

Answer №1

While Proxyquire is a useful tool, it lacks the ability to maintain your typescript types. If you're looking for a solution that specifically focuses on replacing imports with fakes and is built on top of sinon, check out ts-mock-imports. This library is designed to be type safe, providing added security to your code.

Answer №2

Have you considered passing P as a collaborator to simplify the mocking process instead of intercepting require with proxyquire?

export const getScripts = (name?: string, P) => {
   return P.scripts.getScripts(name); // It would be beneficial to have a mock called here
};

// Test
const fakeGetScript = () => ({ foo: 'value' });
const P = { scripts: { getScripts: fakeGetScript } };

expect(getScripts('aName', P)).toEqual({ foo: 'value' });

Answer №3

If you find yourself needing to intercept the module creation during an import, Sinon may not be able to handle this task. A possible solution is to utilize the proxyquire library.

Here's how you could implement it:

const proxyquire =  require('proxyquire');
const fakeGetScript = sinon.fake.returns({
    foo: 'fakeValue'
});
const p = proxyquire('./path/to/p', {
  scripts: {
    getScripts: fakeGetScript
  }
});

Afterwards, you can perform your assertions on fakeGetScript as needed.

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

Managing return types in functions based on conditions

Recently, I developed a function to map links originating from a CMS. However, there are instances where the link in the CMS is optional. In such cases, I need to return null. On the other hand, when the links are mandatory, having null as a return type is ...

The error message "The element 'router-outlet' is unrecognized during the execution of ng build --prod" appears

I encountered a specific error message when running ng build --prod, although the regular ng build command works without issue. Error: src/app/app.component.html:1:1 - error NG8001: 'router-outlet' is not recognized as an element: 1. If 'rou ...

Customizing event typings for OpenTok in Typescript

Currently, I am working on integrating chat functionality using the 'signal' events with the OpenTok API. Here is my event listener that successfully receives the signal: // Listen for signal CHAT_MESSAGE sess.on('signal:CHAT_MESSAGE', ...

Dividing an array into categories with typescript/javascript

Here is the initial structure I have: products = [ { 'id': 1 'name: 'test' }, { 'id': 2 'name: 'test' }, { 'id' ...

Encountering issue while resolving flux/utils in webpack

My TypeScript OS project is in the process of being migrated to webpack, Unfortunately, I am currently facing a build error: ERROR in ./src/store/GigaStore.ts Module not found: Error: Cannot resolve module 'flux/utils' in /home/erfangc/GigaGrid ...

The resolve.alias feature in webpack is not working properly for third-party modules

Currently, I am facing an issue trying to integrate npm's ng2-prism with angular2-seed. The problem arises when importing angular2/http, which has recently been moved under @angular. Even though I expected webpack's configuration aliases to hand ...

Learn how to hide the dropdown menu in Angular 8 by detecting clicks outside of the menu area

Is there a way to hide the custom dropdown menu whenever I click outside of it? After trying the code below, I noticed that it hides even if I click on an element inside the dropdown menu: <button class="btn btn-primary btn-sm mt-1" type="button" id= ...

The `setState` function is failing to change the current value

I'm having an issue with setting State in the dropdown component of semantic-ui-react while using TypeScript in my code. The selected category value is always returning an empty string "". Any suggestions on how to resolve this problem? impo ...

Guide on exporting Excel data using Angular and TypeScript

My project involves managing a table of information that includes fields for FirstName, LastName, PhoneNumber, Age, and Date. I've created a function that allows me to export the data to an Excel file, but I only want to export specific fields like Fi ...

What specific event do I require for the onChange event in React using TypeScript?

I'm facing a problem while working with React TypeScript. I need to type the onChange event for a select element, but the data is coming from event.value instead of event.target.value. What should be the appropriate event to use in this case? Below i ...

Is it possible to integrate TypeScript 5.0 decorators into React components?

Every time I add decorators to my class, they always get called with the arguments specified for legacy decorators: a target, property key, and property descriptor. I am interested in using TypeScript 5.0 decorators. Is this feasible, and if so, how can I ...

The specified main access point, "@angular/cdk/platform", is lacking in required dependencies

I recently updated my Angular app from version 8 to version 9. After resolving all compilation and linter errors, I encountered one specific issue that is causing me trouble: ERROR in The target entry-point "@angular/cdk/platform" has missing dep ...

Is there a way to ensure an ajax call finishes executing without relying on 'async: false' or callbacks?

In my view, I have implemented a TypeScript code defining a KnockoutJS binding handler for a clickable element as shown below: module MyModule { export interface ICopyButtonParams { dataUrl: string; } ko.bindingHandlers.copyButton = { ...

Unusual problem with accessing Object values in vscode using typescript

When attempting to write Object.values in TypeScript, I encounter a visual error (although it compiles without issues). https://example.com/image1.png I have tried searching online and restarting vscode, and here is my current tsconfig.json. https://exa ...

Incorporating traditional Javascript classes for modeling in React development

Can traditional JavaScript classes be utilized in models within the MVC framework while using React, as opposed to relying on Redux or contexts & reducers which may impact reusability? If this approach is feasible, how can we efficiently 'subscribe&ap ...

Is Angular 2 giving you trouble with the AoT compilation and module.id error?

I need to set up AoT compilation for my Angular 2 project. My application is organized into a js directory where all generated .js files are stored, and an app directory containing my .ts, .html, and .css files. For the AoT compilation process, I am usin ...

Strategies for redirecting search queries when adding a new path

Issue I am facing a challenge with pushing a new path to the URI while maintaining existing search queries. For example: Current URL: https://example.com/foo?bar=123&foobar=123 When I use history.push('newPath'), I end up with https://exa ...

Having Trouble with Angular 6 Subject Subscription

I have created an HTTP interceptor in Angular that emits a 'string' when a request starts and ends: @Injectable({ providedIn: 'root' }) export class LoadingIndicatorService implements HttpInterceptor { private loadingIndicatorSour ...

"Null value is no longer associated with the object property once it has

What causes the type of y to change to string only after the destruction of the object? const obj: { x: string; y: string | null } = {} as any const { x, y } = obj // y is string now ...

Experimenting with ES6 modules using Mocha

Recently, I was given a new project at work that involves using raw native imports/exports in code (compatible only with the latest browsers). The project is being worked on by consultants, and although I cannot make significant changes to their work, I am ...