Jest.js error: "Received: serializes to the same string"
Asked Answered
R

10

185

I've having a strange problem with this test:

deal.test.js

import Deal from "../src/models/Deal";
import apiProducts from "../__mocks__/api/products";

describe("Deal", () => {
  describe("Deal.fromApi", () => {
    it("takes an api product and returns a Deal", () => {
      const apiDeal = apiProducts[0];
      const newDeal = Deal.fromApi(apiDeal);
      const expected = expectedDeal();
      expect(newDeal).toEqual(expected);
    });
  });
});

Deal.js

export default class Deal {
  // no constructor since we only ever create a deal from Deal.fromApi

  static fromApi(obj: Object): Deal {
    const deal = new Deal();
    deal.id = obj.id;
    deal.name = obj.name;
    deal.slug = obj.slug;
    deal.permalink = obj.permalink;
    deal.dateCreated = obj.date_created;
    deal.dateModified = obj.date_modified;
    deal.status = obj.status;
    deal.featured = obj.featured;
    deal.catalogVisibility = obj.catalog_visibility;
    deal.descriptionHTML = obj.description;
    deal.shortDescriptionHTML = obj.short_description;
    deal.price = Number(obj.price);
    deal.regularPrice = Number(obj.regular_price);
    deal.salePrice = Number(obj.sale_price);
    deal.dateOnSaleFrom = obj.date_on_sale_from;
    deal.dateOnSaleTo = obj.date_on_sale_to;
    deal.onSale = obj.on_sale;
    deal.purchasable = obj.purchasable;
    deal.relatedIds = obj.related_ids;
    deal.upsellIds = obj.upsell_ids;
    deal.crossSellIds = obj.cross_sell_ids;
    deal.categories = obj.categories;
    deal.tags = obj.tags;
    deal.images = obj.images;
    return deal;
  }

 descriptionWithTextSize(size: number): string {
    return this.descriptionWithStyle(`font-size:${size}`);
  }

  descriptionWithStyle(style: string): string {
    return `<div style="${style}">${this.description}</div>`;
  }

  distanceFromLocation = (
    location: Location,
    unit: unitOfDistance = "mi"
  ): number => {
    return distanceBetween(this.location, location);
  };

  distanceFrom = (otherDeal: Deal, unit: unitOfDistance = "mi"): number => {
    return distanceBetween(this.location, otherDeal.location);
  };

  static toApi(deal: Deal): Object {
    return { ...deal };
  }
}

The test fails with this error:

  ● Deal › Deal.fromApi › takes an api product and returns a Deal

    expect(received).toEqual(expected) // deep equality

    Expected: {"catalogVisibility": "visible", "categories": [{"id": 15, "name": "New York", "slug": "new-york"}], "crossSellIds": [34, 31], "dateCreated": "2019-05-18T17:36:14", "dateModified": "2019-05-18T17:39:02", "dateOnSaleFrom": null, "dateOnSaleTo": null, "descriptionHTML": "<p>Pete's Tavern<br />
    129 E 18th St<br />
    New York, NY 10003</p>
    <p>Weekdays from 4 p.m. to 7 p.m.<br />
    $5 wines and beers</p>
    ", "distanceFromLocation": [Function anonymous], "featured": false, "id": 566, "images": [{"alt": "", "date_created": "2019-05-18T17:38:52", "date_created_gmt": "2019-05-18T17:38:52", "date_modified": "2019-05-18T17:38:52", "date_modified_gmt": "2019-05-18T17:38:52", "id": 567, "name": "wine and beers2", "src": "https://tragodeals.com/wp-content/uploads/2019/05/wine-and-beers2.jpg"}], "name": "Wines and beers", "onSale": true, "permalink": "https://tragodeals.com/product/wines-and-beers/", "price": 5, "purchasable": true, "regularPrice": 11, "relatedIds": [552, 564, 390, 37, 543], "salePrice": 5, "shortDescriptionHTML": "<p>$5 wines and beers</p>
    ", "slug": "wines-and-beers", "status": "publish", "tags": [{"id": 58, "name": "beers", "slug": "beers"}, {"id": 54, "name": "Cocktails", "slug": "cocktails"}, {"id": 45, "name": "drink", "slug": "drink"}, {"id": 57, "name": "wine", "slug": "wine"}], "upsellIds": [53]}
    Received: serializes to the same string

    > 15 |       expect(newDeal).toEqual(expected);
         |                       ^
      16 |     });
      17 |   });
      18 | });

      at Object.toEqual (__tests__/deal.test.js:15:23)

I inserted this loop to investigate:

for (let key in expected) {
  expect(expected[key]).toEqual(newDeal[key]);
}

And I see that the problem is with functions. So I changed the whole test to this:

      for (let key in expected) {
        if (typeof expected[key] === "function") continue;
        expect(expected[key]).toEqual(newDeal[key]);
      }
     // expect(newDeal).toEqual(expected);

And it passes, and also fails when it should. (if you read the old version of this question where I was getting passing tests that I didn't understand, it was because I was returning from the loop when I should have been continueing).

But I'd like to be able to do it with the standard assertion expect(newDeal).toEqual(expected). It looks like there's something I'm not understanding about checking for class object (Deal) equality with functions.

PS. You might suggest using toMatchObject. But, sadly:

  ● Deal › Deal.fromApi › takes an api product and returns a Deal

    expect(received).toMatchObject(expected)

    - Expected
    + Received

    @@ -1,6 +1,6 @@
    - Deal {
    + Object {
        "address": "129 E 18th St New York, NY 10003",
        "catalogVisibility": "visible",
        "categories": Array [
          Object {
            "id": 15,

      13 |         expect(expected[key]).toEqual(newDeal[key]);
      14 |       }
    > 15 |       expect(newDeal).toMatchObject(expected);
         |                       ^
      16 |     });
      17 |   });
      18 | });

Retro answered 1/7, 2019 at 17:16 Comment(2)
Hi Jonathan, is it possible that you pass a sample of apiProducts in order to reproduce this error? also could you provide the exact error you get in the console?Mweru
Weird thing i Noticed about your constructor Object.assign(this, obj: Object) <-- would do everything you perfomed manually :DNocuous
M
238

Similarly to other colleagues I had this issue with an Array comparison, I was basically testing a function that got the largest string in an array, additionally it should return an array if more than 1 of those strings matched the largest length possible.

When I started testing I got the following message:

screenshot of jest results

So I replaced the toBe method

expect(function(array1)).toBe('one result')

with toStrictEqual to make a deep equality comparison

expect(function(array2)).toStrictEqual(['more than one', 'more than one']);
Mweru answered 23/6, 2020 at 22:20 Comment(3)
using toEqual will also works, in conclusion, do not use toBe to compare arrays.Roscoeroscommon
Back when I posted I think the toEqueal method didn’t cut it, I’ll have a look at itMweru
you also need to do .sort() at each array to make sure you compare them in the same sequencePhilender
O
54

I had a similar case where the object had a base64 encoded string, I managed the test to compare the serialization of the object using JSON.stringify:

expect(JSON.stringify(newDeal)).toMatchObject(JSON.stringify(expected));
Objective answered 5/11, 2020 at 8:5 Comment(4)
expect(newDeal).toMatchObject(expected) will do. No need to convert to string.Pitch
@AVC Are you sure that's correct? Jest says this about expect(newDeal).toMatchObject(expected): It will match received objects with properties that are not in the expected object.. It did not work for me when I tried it. I had to do JSON.stringify() on both sides of the equation in order for the toEqual() comparison to succeed.Paniculate
toMatchObeject() works nicely. Thanks.Mucronate
Somehow toMatchObeject() is not working for me. expect(JSON.stringify(newDeal)).toMatchObject(JSON.stringify(expected)); is working fine and makes the test passed.Spawn
B
41

Just had this problem when tried to compare arrays where in one array there was an element with -1 index set (imagine any other key to be set except numbers from 0 to N). So you may have this error in the following scenario:

const arr = [1, 2]
arr[-1] = 'foo'
expect(arr).toEqual([1, 2])

They both serialized to the same string, but they are not equal.

Bogle answered 27/7, 2019 at 8:21 Comment(2)
My problem was that we'd put a static property on our array, which is similar to thisBuiron
Thanks for this answer, ran into this exact scenario!Reflation
P
16

I had this problem when i tried to compare arrays where one array was coming back from the Graphql's resolver and the other one was from my test's input.
ALL the fields were the same except the entries inside the array coming from Graphql did not have any __proto__ while the ones from my test input had __proto__: Object and that cause the toStrictEqual to fail, because it checks the types besides the structure. So, in my case the type caused to fail. Changing it to toEqual solved the problem.

                expect(res.data.myMutation.values).toEqual(
                    testInput.values,
                );

Photojournalism answered 17/11, 2021 at 11:13 Comment(0)
R
14

In my situation, I was deep equal checking a proxied object vs a regular object.

const proxyObject = new Proxy({}, {
    get: function(target, prop) {
        return Object.hasOwnProperty.call(target, prop) ? target[prop] : '';
    }
})
expect(proxyObject).toEqual({})
// Expected: {}
// Received: serializes to the same string

It should be:

expect(proxyObject).toMatchObject({})
Rochdale answered 7/6, 2021 at 6:28 Comment(0)
I
7

I had a similar issue while comparing two MongoDb ObjectIds. To overcome the problem, I used

expect(`${thisObject._id}`).toEqual(`${thatObject._id}`);
Intisar answered 22/7, 2022 at 14:50 Comment(0)
S
2

I had this same issue with jest. In my case I was comparing the array of objects (basically a model class). And in that class I had defined a function as an arrow function.

The problem is, while comparing it checks for the arrow functions also. And as arrow functions create different instances for all the objects in contrast to normal function which have only one instance class-wide, the arrow function comparison results false.

So a simple solution would be to convert your arrow functions to normal functions in classes.

Use:

class ClassName {
  yourFunc(){
    // your code here
  }
};

Instead of:

class ClassName {
  yourFunc = () => {
    // your code here
  };
};

So once converted to normal function you can simply use toEqual() for comparison.

If you can't convert to normal function you can use JSON.stringify() to convert them first to strings and then use toEqual() or toBe().

Seabolt answered 18/7, 2022 at 15:9 Comment(0)
S
0

The output for mongoose.Types.ObjectId is a complex type - converting it via .toHexString() allows you to compare it to other objectId (and it also makes the objectid readable to jest).

//from this:
expect(res.body).toHaveProperty('genre._id', genrePayload._id);

//to this:
expect(res.body).toHaveProperty('genre._id', genrePayload._id.toHexString());
Sarthe answered 1/10, 2023 at 14:1 Comment(0)
W
0

I got this error when wanted to assert to log object.

Solved this issue with create a new context

  describe('assert deep', () => {
    testScheduler = new TestScheduler((actual, expected) => {
      expect(JSON.stringify(actual)).toEqual(JSON.stringify(expected));
    });
   

 //   What suite you want with this configuration 


  })

Wellordered answered 24/11, 2023 at 22:16 Comment(0)
M
0

In my case it was because of a function included inside the object. So it should be checked this way:

expect(obj).toEqual({ foo: expect.any(Function), bar: true })
Moue answered 22/3 at 11:5 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.