Anticipated that the absence of a value would match the presence of an Object

Struggling with running AngularJS unit tests for $resource using Jasmine v2.0 and Karma v0.13, I managed to convert custom actions to newer syntax successfully. However, a specific type of test is giving me trouble, which I suspect is related to $httpBackend. When testing this line, the following failure occurs:

Expected null({  }) to equal Object({  }).

The issue lies in the latest expectation in my actual test code:

      // ---
      callback = jasmine.createSpy();
      // ---

      it("should create resource", function() {
        $httpBackend.expect('POST', '/CreditCard', '{"name":"misko"}').respond({id: 123, name: 'misko'});

        var cc = CreditCard.save({name: 'misko'}, callback);
        expect(cc).toEqualData({name: 'misko'});
        expect(callback).not.toHaveBeenCalled();

        $httpBackend.flush();
        expect(cc).toEqualData({id: 123, name: 'misko'});
        expect(callback).toHaveBeenCalledOnce();
        expect(callback.calls.mostRecent().args[0]).toEqual(cc);
        expect(callback.calls.mostRecent().args[1]()).toEqual({});
      });

UPDATE

Resolved the issue.
It appears that the problem stems from how Angular creates an empty object when comparing with null and {}. The newest versions of Jasmine seem to struggle with this comparison method.

/**
 * Creates a new object without a prototype. This object is useful for lookup without having to
 * guard against prototypically inherited properties via hasOwnProperty.
 *
 * Related micro-benchmarks:
 * - http://jsperf.com/object-create2
 * - http://jsperf.com/proto-map-lookup/2
 * - http://jsperf.com/for-in-vs-object-keys2
 *
 * @returns {Object}
 */
function createMap() {
  return Object.create(null);
}

Answer №1

Upon inspecting the AngularJS source code, I discovered that there are instances where objects are constructed using Object.create(null), as shown in the example below.

/**
 * This function creates a new object with no prototype. Such an object proves to be beneficial for efficient lookup operations without having to worry about inherited properties from prototypes.
 *
 * Additional performance benchmarks:
 * - http://jsperf.com/object-create2
 * - http://jsperf.com/proto-map-lookup/2
 * - http://jsperf.com/for-in-vs-object-keys2
 *
 * @returns {Object}
 */
function createMap() {
  return Object.create(null);
}

I noticed that Jasmine 2.0 introduced support for comparing prototype types, causing some expectations to fail.

To remedy this, tests can now be structured like so:

expect(callback.calls.mostRecent().args[1]()).toEqual(Object.create(null));
, which should result in a successful test outcome.

Answer №2

I believe there might be an extra () in your code. Make the following adjustment;

expect(callback.mostRecentCall.args[1]()).toEqual({});

to

expect(callback.mostRecentCall.args[1]).toEqual({});

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

Tips for resolving dependency conflicts in a JavaScript project starter template

Currently, I'm utilizing the Airframe React template and the procedure seems quite simple: Extract the files and execute npm install in the project directory. However, an issue arises when running npm install as follows: npm WARN config global `--glob ...

The Street View feature on Google Maps API is now showcasing a cool,

I have been attempting to showcase the interior of various businesses using the Google Maps API street view feature. Initially, I was able to retrieve the place_id and then use it to access any available street view panoramas. However, this functionality s ...

Step-by-step guide on uploading a multipart file with AngularJS and Spring MVC

Currently, I am attempting to utilize AngularJS and Spring MVC for file uploading. In my application-context.xml file, I have configured a multipartResolver bean as follows: <mvc:annotation-driven /> <bean id="multipartResolver" ...

What is the process for creating a global variable in JavaScript?

Having trouble changing the value of "invocation_num" within a loop? I attempted to modify it as follows, but ended up with an undefined value. Any help would be greatly appreciated. $(document).on("click", '.favoret', function(){ document ...

Dealing with multiple occurrences of forward slashes in a URL

Currently utilizing React and grappling with resolving duplicate forward slashes on my site in a manner similar to Facebook. The process functions as follows: For example, if the user visits: https://facebook.com///settings, the URL is then corrected to h ...

Tips for creating a responsive tab indicator in Material UI?

I successfully integrated react router with material-ui and the routing system is working as expected. Clicking on a tab routes you to the corresponding component. However, I am facing an issue where the blue underline indicator that typically accompanies ...

Experiencing trouble with implementing multiple textboxes based on option selection using javascript

My JavaScript code is supposed to display multiple textboxes based on the user's selection, but for some reason, I can only select one textbox at a time. I'm not sure what's wrong with my code. Here's the snippet of the code: <ht ...

The directional rotation plugins of GSAP are incompatible with the plugins of PIXI

I've been experimenting with using directional rotation plugins in combination with pixi.js plugins. Unfortunately, I'm encountering some issues. If you check out the codepen link: https://codepen.io/asiankingofwhales/pen/RyNKBR?editors=0010, yo ...

It's impossible to remove a dynamically added class from a button

I'm facing an issue with adding and removing classes from a button using jQuery. I added a new class to the button, then removed it, but now when I click the button again I want to revert back to the initial class. Unfortunately, my code is not workin ...

Prevent typing in text box when drawer is activated by pressing a button

update 1 : After removing unnecessary files, I need assistance with https://codesandbox.io/s/0pk0z5prqn I am attempting to disable a textbox. When clicking the advanced sports search button, a drawer opens where I want to display a textbox. The toggleDra ...

Obtain SVG icons seamlessly in Next.js

My goal was to dynamically retrieve SVG icons, and I discovered a method to achieve this. However, it seems like I have made some errors along the way. Can you point out where I am going wrong? Icon.js import React from "react"; import { ReactCo ...

Clicking on a button will allow me to select only a portion of text within a specific cell of

Inside a table, there is a paragraph of text enclosed in a <td></td> element. Take for example the following passage. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard ...

What is the best way to retrieve data from a database and display it in a select dropdown list

I'm working on creating a Bingo game and I want to include a dropdown list that displays my previous records. How can I retrieve data from a database to populate this select dropdown list? Below is the relevant code snippet in PHP: <html> < ...

Is there a way to create an <a> element so that clicking on it does not update the URL in the address bar?

Within my JSP, there is an anchor tag that looks like this: <a href="patient/tools.do?Id=<%=mp.get("FROM_RANGE") %>"> <%= mp.get("DESCRITPION") %></a>. Whenever I click on the anchor tag, the URL appears in the Address bar. How can ...

The server's response is unpredictable, causing Json.Parse to fail intermittently

I have encountered a strange issue that is really frustrating. It all started when I noticed that my Json.Parse function failed intermittently. Here is the code snippet in question: const Info = JSON.parse(response); this.onInfoUpdate(Info.InfoConfig[0]); ...

Updating Parent Scope Value in AngularJS Custom Directive

As a newcomer to AngularJS, I am eager to create my own custom directive that will display notifications or alerts on the web page. For example, when a user successfully updates their information, I want a brief message to appear saying "Your information h ...

How to locate the cell with a specific class using JavaScript/jQuery

I need help with the following code snippet: var output = '<tr>'+ '<td class="class1">One</td>'+ '<td class="selected">Two</td>'+ '<td>< ...

Having trouble with the jQuery load function not functioning properly

I have encountered an issue with this code snippet while running it on XAMPP. The alert function is working fine, but the HTML content fails to load. I have included links to jQuery 3.2.1 for reference. index.html $(document).ready(function(){ $("#b ...

Create a variety of URL formats for various object cases

Can you guide me on how to verify and create a URL under different circumstances? I am dealing with 3 cases that involve different types of objects: "repositories": { "toto": { "tata": "https://google.com/", ...