Description
Describe the bug
When a link appears on the page twice ‒ once inside and once outside the viewport ‒ and a delay has been set, the link will not cause prefetching/prerendering.
To Reproduce
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="main.css">
</head>
<body>
<div class="screen">
<a href="1.html">Link</a>
</div>
<a href="1.html">Same link</a>
<script src="../../dist/quicklink.umd.js"></script>
<script>
quicklink.listen({ delay: 1000 });
</script>
</body>
</html>Expected behavior
The page to be prefetched, as at least one link to it is in-viewport.
The IntersectionObserver detects that the first link is in-viewport, and appropriately pushes into the hrefsInViewport array. It immediately afterwards detects that the second link is not in-viewport, and thus removes the freshly added item from hrefsInViewport. hrefsInViewport ‒ as the name suggests ‒ contains hrefs, thus links with equal hrefs are indistinguishable in this context.
I am willing to submit a PR, but would like to make I'm not the only one who thinks this is unexpected.
One possible solution would be storing some identifier for a link that is unique to it, rather than the href (which is not necessarily unique). Such an identifier could be generated like so:
const identify = function(ids, node) {
let id = ids.get(node);
if (!id) {
ids.set(node, id = {});
}
return id;
}.bind(undefined, new WeakMap());