How do I mock `.length` in Jest?

If you are working with JavaScript or TypeScript, chances are you have come across the need to mock certain properties or methods during unit testing. One common scenario is when you need to mock the `.length` property of an array or a string in Jest. In this blog post, we will explore different approaches to achieve this.

Approach 1: Using Jest’s `mockImplementation`

The first approach involves using Jest’s `mockImplementation` method to mock the `.length` property. This method allows you to provide a custom implementation for the mocked property. Here’s an example:

// Mocking .length property of an array
const myArray = [1, 2, 3];
jest.spyOn(myArray, 'length', 'get').mockImplementation(() => 10);

console.log(myArray.length); // Output: 10

// Mocking .length property of a string
const myString = 'Hello, World!';
jest.spyOn(myString, 'length', 'get').mockImplementation(() => 15);

console.log(myString.length); // Output: 15
    

In the above code snippet, we first use `jest.spyOn` to spy on the `.length` property of the array `myArray` and provide a custom implementation using `mockImplementation`. Similarly, we do the same for the string `myString`. The mocked `.length` property will now return the value we specified.

Approach 2: Using Jest’s `Object.defineProperty`

Another approach is to use Jest’s `Object.defineProperty` method to directly define a new property with a custom getter function. Here’s how you can do it:

// Mocking .length property of an array
const myArray = [1, 2, 3];
Object.defineProperty(myArray, 'length', { get: () => 10 });

console.log(myArray.length); // Output: 10

// Mocking .length property of a string
const myString = 'Hello, World!';
Object.defineProperty(myString, 'length', { get: () => 15 });

console.log(myString.length); // Output: 15
    

In this approach, we use `Object.defineProperty` to define a new property with the name `’length’` on the array `myArray` and the string `myString`. We provide a custom getter function that returns the desired length value.

Conclusion

Mocking the `.length` property in Jest can be achieved using either the `mockImplementation` method or the `Object.defineProperty` method. Both approaches allow you to provide a custom implementation for the mocked property. Choose the approach that suits your needs and preferences.

Happy testing!