How to preserve case of URL host/domain (URL() constructor)

Question

The URL() constructor normalizes the case of the hostname/domain to lowercase:

(new URL('https://WWW.EXAMPLE.COM/THIS/is/a/PATH')).href
// => 'https://www.example.com/THIS/is/a/PATH'

What is the simplest way to get the hostname and href strings with the case of the hostname preserved? Is there anything better than parsing the domain name manually, then replacing in the result from URL.href?

I would like to query/manipulate a URL (like remove unnecessary query parameters), but preserve the case of the domain. While domains are case-insensitive, sometimes hostnames have uppercase characters thrown in to make them more readable (like expertsexchange.com).

Answer 1

This seemed like the simplest/least error-prone way (no manual URL parsing):

const url = 'https://www.EXAMPLE.com/THIS/is/a/PATH'
console.log(url)

const urlObject = new URL(url)

// 1. Create a case-insensitive regular expression based on URL.hostname.
const hostnameRE = new RegExp(urlObject.hostname, 'i')

// 2. Get the original mixed-cased domain using hostnameRE.
const hostnameOriginalCase = (url.match(hostnameRE))[0]

// Modify URL object:
urlObject.searchParams.set('new', 'param')

// 3. Replace the lowercase domain with the mixed case domain, gain using hostnameRE.
const urlWithOriginalCase = urlObject.href.replace(hostnameRE, hostnameOriginalCase)

// Results:
console.log(urlObject.href)
console.log(urlWithOriginalCase)