expect: compare URLs by href (so that different URLs aren't considered equal)

[kleinfreund]

Clear and concise description of the problem

When comparing URLs in Vitest, tests easily pass for completely different URLs (in a sense, this can be considered a bug):

expect(new URL('https://example.org')).toEqual(new URL('https://different-example.org'))
// This passes, but it shouldn't:                               ^^^^^^^^^^

The main equals comparison utility can be easily updated to handle this case better. I'd be happy to contribute this.

Suggested solution

Add a special case for URL objects in https://github.com/vitest-dev/vitest/blob/main/packages/expect/src/jest-utils.ts#L96-L97:

    if (a instanceof Error && b instanceof Error)
      return a.message === b.message

+   if (a instanceof URL && b instanceof URL)
+     return a.href === b.href

And add test cases for this in https://github.com/vitest-dev/vitest/blob/main/test/core/test/jest-expect.test.ts#L51-L52:

      expect(new Date(0)).toEqual(new Date(0))
      expect(new Date('inValId')).toEqual(new Date('inValId'))

+     expect(new URL('https://example.org')).toEqual(new URL('https://example.org'))
+     expect(new URL('https://example.org')).not.toEqual(new URL('https://different-example.org'))

Alternative

Fail URL comparisons unless they're the exact same object.

Additional context

I initially noticed this behavior while working on a small wrapper around fetch where I have a lot of tests that very roughly look like this (though in place of fetch I'm calling my fetch wrapper, replaced here for brevity):

test('test', async () => {
	vi.spyOn(window, 'fetch').mockImplementation(() => Promise.resolve(new Response('OK')))

	await fetch(new URL('https://example.org'))

	expect(fetch).toHaveBeenCalledWith(new URL('https://different-example.org'))
})

I noticed that I couldn't get the assertion to fail at all. As a workaround, my tests actually look like this:

test('test', async () => {
	vi.spyOn(window, 'fetch').mockImplementation((input) => {
		expect(toUrl(input).href).toEqual(toUrl('https://different-example.org').href)

		return Promise.resolve(new Response('OK'))
	})

	await fetch(new URL('https://example.org'))

	expect(fetch).toHaveBeenCalled()
})

function toUrl(url: string | URL | Request): URL {
	return typeof url === 'string'
		? new URL(url)
		: url instanceof URL
			? url
			: new URL(url.url)
}

While this works great, it's really a little too cumbersome for my liking. Using toHaveBeenCalledWith would be much nicer for this use case.

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that request the same feature to avoid creating a duplicate.