Fix aria.js bugs: incorrect role element problem, mobile focus problem, tippy problem (#23450)

This PR is extracted from #23346 to address some unclear (I don't
understand) code-belonging concerns.

This PR needs to be backported, otherwise the `aria.js` is too buggy in
some cases. Since there would be two minor conflicts, I will do the
backport manually.

Before: the `aria.js` is still buggy in some cases.

After: tested with AppleVoice, Android TalkBack

* Fix incorrect dropdown init code
* Fix incorrect role element (the menu role should be on the `$menu`
element, but not on the `$focusable`)
* Fix the focus-show-click-hide problem on mobile. Now the language menu
works as expected
* Fix incorrect dropdown template function setting
* Clarify the logic in aria.js
* Hide item's tippy after menu gets hidden
* Fix incorrect tippy `setProps` after `destroy`
* Fix UI lag problem when page gets redirected during menu hiding
animation with screen reader
* Improve comments
* Implement the layout proposed by #19861

<details>


d74a7efb60/web_src/js/features/aria.md (L38-L47)

</details>

web_src/js/modules/tippy.js

@@ -53,10 +53,11 @@ export function showTemporaryTooltip(target, content) {
     onHidden: (tippy) => {
       if (oldContent) {
         tippy.setContent(oldContent);
+        tippy.setProps({onHidden: undefined});
       } else {
         tippy.destroy();
+        // after destroy, the `_tippy` is detached, it can't do "setProps (etc...)" anymore
       }
-      tippy.setProps({onHidden: undefined});
     },
   });
 }