Select another version dropdown bug

[Christilut]

• URL: https://nodejs.org/api/https.html
• Browser version: Chrome 78
• Operating system: Windows 10

The View another version dropdown is a bit broken. When you mouse over it and go down, it closes before you can get your mouse into the version selection box.
Seems to happen 9/10 times for me.

[XhmikosR]

@Trott please move this to core

[aduh95]

This looks to me as a website related issue, not sure why this has been moved to core. @XhmikosR can you elaborate on how this is related to node, and maybe label the issue?

FWIW I am unable to reproduce the issue on iPadOS 13, the dropdown behaves as expected there.

[richardlau]

This looks to me as a website related issue, not sure why this has been moved to core.

The API docs are built as part of the releases. All the tooling to do that is in the core repository. The View another version dropdown is generated with this code:

node/tools/doc/html.js

Lines 394 to 422 in f4f856b

	async function altDocs(filename, docCreated) {
	const [, docCreatedMajor, docCreatedMinor] = docCreated.map(Number);
	const host = 'https://nodejs.org';
	const versions = await getVersions.versions();
	const getHref = (versionNum) =>
	`${host}/docs/latest-v${versionNum}/api/${filename}.html`;
	const wrapInListItem = (version) =>
	`<li><a href="${getHref(version.num)}">${version.num}` +
	`${version.lts ? ' <b>LTS</b>' : ''}</a></li>`;
	function isDocInVersion(version) {
	const [versionMajor, versionMinor] = version.num.split('.').map(Number);
	if (docCreatedMajor > versionMajor) return false;
	if (docCreatedMajor < versionMajor) return true;
	if (Number.isNaN(versionMinor)) return true;
	return docCreatedMinor <= versionMinor;
	}
	const list = versions.filter(isDocInVersion).map(wrapInListItem).join('\n');
	return list ? `
	<li class="version-picker">
	<a href="#">View another version <span>&#x25bc;</span></a>
	<ol class="version-picker">${list}</ol>
	</li>
	` : '';
	}

Speculatively it could be an issue with the style sheet:

node/doc/api_assets/style.css

Lines 112 to 158 in ce49f90

	li.version-picker {
	position: relative;
	}
	li.version-picker:hover > a {
	border-radius: 2px 2px 0 0;
	}
	li.version-picker:hover > ol {
	display: block;
	z-index: 1;
	}
	li.version-picker a span {
	font-size: .7rem;
	}
	ol.version-picker {
	background-color: #fff;
	border: 1px solid #43853d;
	border-radius: 0 0 2px 2px;
	display: none;
	list-style: none;
	position: absolute;
	right: 0;
	top: 1.25rem;
	width: 100%;
	}
	#gtoc ol.version-picker li {
	display: block;
	border-right: 0;
	margin-right: 0;
	}
	ol.version-picker li a {
	border-radius: 0;
	display: block;
	margin: 0;
	padding: .1rem;
	padding-left: 1rem;
	}
	ol.version-picker li:last-child a {
	border-bottom-right-radius: 1px;
	border-bottom-left-radius: 1px;
	}

[lpinca]

I can't reproduce the issue.

[Christilut]

Still reproducible to me, Chrome 79

Just move your mouse down slowly

[AshleyLilith]

I can replicate this issue in Firefox v72.0.2 64-bit and Chrome Chrome 79.0.3945.130 64-bit on Windows 10. When you hover from the right side to open the drop down menu, the drop down will close if your cursor remains an arrow icon. Hovering in from the left appears to work fine. If you hover far enough to highlight the link it works fine, but ff you hover back far enough to the right to lose the hand icon, and try to select the drop down, it will close.

It looks like a bit of right padding may have something to do with this.

Here are a couple of images. Hope this helps.

[jasnell]

Unable to duplicate behavior in Chrome, Firefox, or Edge on Windows 10. Issue was possibly fixed previous but the issue was never closed. Closing, but can reopen if it turns out to still be an issue

[Christilut]

Still going on on the live website in Chrome 83.

[jasnell]

hmm.. strange. I'm on Chrome 83 on Windows 10 and completely unable to replicate. Do you happen to have any extensions that could be causing it?

[aduh95]

Related PRs:

• doc: fix inability to hover version-picker #34447
• doc: remove space above version picker #34768

[targos]

Assuming this was fixed by these PRs