How does a website know the DNS server a client uses?
This is a DNS resolution trick that could also be performed using non-http protocols but in this case is performed by using random hostnames and zero-pixel images via http.
Look at the source code on the page and you will see a series of random 10-character subdomains requested for several URL's. These are very unique hostnames which neither your computer or your ISP, or more importantly your DNS provider, will have cached in local DNS.
When these unique URL's hostnames hit your DNS provider they then have to request them from the testing companies website who then correlates the owners IP address doing the unique DNS request and then notifies you of the company name that made the request via a quick lookup
List of randomized host names all for the same domain
ixc9a5snm4.dnsleaktest.com
rhl50vm36o.dnsleaktest.com
4xov3y3uvc.dnsleaktest.com
2n5t99gbzp.dnsleaktest.com
6mzklkved4.dnsleaktest.com
d6z20e9c2x.dnsleaktest.com
can be found in the following html (your hostnames will be different)
<img width=0 height=0 src="https://ixc9a5snm4.dnsleaktest.com">.
<img width=0 height=0 src="https://rhl50vm36o.dnsleaktest.com">.
<img width=0 height=0 src="https://4xov3y3uvc.dnsleaktest.com">.
<img width=0 height=0 src="https://2n5t99gbzp.dnsleaktest.com">.
<img width=0 height=0 src="https://6mzklkved4.dnsleaktest.com">.
<img width=0 height=0 src="https://d6z20e9c2x.dnsleaktest.com">.
I didn't know about this. Extremely interesting. It seems to work by trying to generate connections to long random subdomains that it controls, and it can probably collate the domain resolution requests from the calling DNS server.
Fig 1: List of requests initiated by the browser that failed
Under the hood it's the standard tracking using a zero size image generator:
<pre class="progress">Query round Progress... Servers found
<br/> 1
<img width=0 height=0 src="https://1k9oraud8h.dnsleaktest.com">.
<img width=0 height=0 src="https://dajo0hwg9c.dnsleaktest.com">.
<img width=0 height=0 src="https://6crg9z68gj.dnsleaktest.com">.
<img width=0 height=0 src="https://nwitgnyo7r.dnsleaktest.com">.
<img width=0 height=0 src="https://z3yine4a7p.dnsleaktest.com">.
<img width=0 height=0 src="https://2tvxmp2yd5.dnsleaktest.com">.
</pre>
Interestingly, since I have piwik (the analytics engine used) blocked by default, all the requests failed, but my DNS servers were still identified, which means that they're relying on more than just the HTTP tracker.
Adding clarification to address @Falco's question.
The images will likely fail to load for everyone, since the subdomains don't exist. Hence, the requests are never generated (invalid DNS lookup) as you can see from the screengrabs below. The only difference in my case is that they don't receive a tracking ID.
Fig 2: The domain name never resolves for any of the subdomains
Fig 3: Hence the HTTP requests are never made by the browser
Since I cannot access the backend, I'm just guessing about what happens behind the scene. They probably have a hook on their DNS server that writes the source IP for each DNS Question received into their DB (perhaps this thread also does the hostname and ISP lookup before saving the data). Notice this is a DNS question and never a materialized HTTP lookup. The only thing that the central web server has to do is to return the row corresponding to the suddomains associated with my browser.
The simplest way would be a one-to-one correspondence with the tracking ID. Normally, it sends a piwik tracking cookie with a name like pk_id and there is an extra request at the end to piwik.php with a lot of tracking details. In my case this cookie is never established and the extra hop does not take place. I see no other session identification happening, I'll look more closely at it on the weekend if the community hasn't dug in.