Codeberg Issues: Clicking on a drop-down menu causes the menu to open and close

[the-blank-x]

Steps to reproduce

1. Go to https://codeberg.org/teddit/teddit/issues
2. Activate hints
3. Select "Label"

Screen recording

link-hints-codeberg-label.mp4

Description

On the issues page of a Codeberg repo, if you select one of the dropdown options using Link Hints, the dropdown menu opens and closes instantly. Interestingly, if you click on the dropdown menu, the bug will no longer manifest until you click somewhere else.

link-hints-codeberg-label-mouse.mp4

Debug info

Debug info

{
  "version": "1.3.1",
  "browser": "firefox",
  "userAgent": "Mozilla/5.0 (X11; Linux x86_64; rv:112.0) Gecko/20100101 Firefox/112.0",
  "browserInfo": {
    "name": "Firefox",
    "vendor": "LibreWolf",
    "version": "112.0.2-1",
    "buildID": "20230430120954"
  },
  "platformInfo": {
    "os": "linux",
    "arch": "x86-64"
  },
  "storage.sync": {
    "normal.ctrl-j": "EnterHintsMode_Click",
    "normal.ctrl-k": "EnterHintsMode_BackgroundTab",
    "normal.ctrl-J": "EnterHintsMode_ManyClick",
    "normal.ctrl-K": "EnterHintsMode_ManyTab",
    "normal.ctrl-L": "EnterHintsMode_Select",
    "normal.ctrl-:": "EnterHintsMode_ForegroundTab",
    "debug.Background.PREFER_WINDOWS": false,
    "debug.ElementManager.ROLES_CLICKABLE": [
      "button",
      "checkbox",
      "link",
      "menuitem",
      "menuitemcheckbox",
      "menuitemradio",
      "option",
      "radio",
      "searchbox",
      "spinbutton",
      "switch",
      "tab",
      "textbox"
    ],
    "hints.ctrl-Enter": "ActivateHintAlt",
    "debug.ElementManager.ATTRIBUTES_CLICKABLE": [
      "aria-checked",
      "aria-selected",
      "data-dismiss",
      "data-ember-action",
      "data-image-url",
      "data-line-number",
      "data-permalink-path"
    ],
    "debug.ElementManager.REGEX_CLICKABLE_CLASS": "\\bcm-|ͼ|\\bmtk|sparkline-year-label|js-wiki-toggle-collapse"
  },
  "storage.local": {
    "tutorialShown": true
  },
  "language": "en-US"
}

[the-blank-x]

I think I've figured out the cause.

LinkHints/src/worker/Program.ts

Lines 961 to 965 in 495652e

	element.focus();
	targetElement.dispatchEvent(mousedownEvent);
	targetElement.dispatchEvent(mouseupEvent);
	let defaultPrevented = !targetElement.dispatchEvent(clickEvent);

Here, the element is first focused, which causes the menu to open. Then, the mousedown+mouseup+click happens, which closes the menu. This also explains why the bug doesn't happen if the dropdown was clicked before, as the element would've already been focused, causing element.focus() to essentially be a noop. The fix would be to have the focus be after mousedown, but

LinkHints/src/worker/Program.ts

Lines 955 to 957 in 495652e

	// When clicking a link for real the focus happens between the mousedown and
	// the mouseup, but moving this line between those two `.dispatchEvent` calls
	// below causes dropdowns in gmail not to be triggered anymore.