philc
Controls in a <dialog> element not visible
When I press 'f' to show controls, nothing within a
Linux Chrome 65.0.3325.181, Vimium 1.63.3
Indeed.
It could be related to the fact that the dialog is within an iframe. Haven't investigated further.
A <dialog> seems to be always most top, and hints of LinkHInts are hidden.
On Chrome 68, there's no z-index statement in user-agent styles on <dialog>, so I have no ideas how to fix this problem.
While link hints that are appended to the body don't work because <dialog>s seem to have their own "layer",
<body>
<div#vimiumHintMarkerContainer>
<div.vimiumHintMarker></div>
<div.vimiumHintMarker></div>
</div>
</body>
...we might be able to fix this by including <dialog>-specific hints the same way, but within the <dialog> element.
<body>
<dialog>
<!-- Markers for contents of the dialog -->
<div#vimiumHintMarkerContainer>
<div.vimiumHintMarker></div>
<div.vimiumHintMarker></div>
</div>
</dialog>
<!-- Markers for everything else -->
<div#vimiumHintMarkerContainer>
<div.vimiumHintMarker></div>
<div.vimiumHintMarker></div>
</div>
</body>
I used inspect element to move #vimiumHintMarkerContainer into the <dialog> of the cookie banner at https://try.devowl.io (thank you @JulianDeal for locating this in #4068), and they seem to work 🤔.
A few points to think about,
- Vimium would now have to manage multiple containers.
#vimiumHintMarkerContainer→.vimiumHintMarkerContainer? - If the dialog is shown modally, you won't be able to interact with anything outside it anyway, so we could skip hinting the rest of the page.
As suggested by you @ravindUwU, I started injecting multiple hint containers into the code.
For <dialog>s as in https://try.devowl.io/ you have to account for scroll position, because the <dialog> creates its own stacking context.
It works fine for devowl. Problem is with mozilla page because the dialogs are inside iframes. They get rendered with an offset, too, but not a scrolling offset.
I have to find out where this comes from.
If any of you have an idea how to handle this, feel free to reach out, especially you, Detective @ravindUwU.
Code can be found under https://github.com/JulianDeal/vimium/tree/bug/dialog-fix
This looks like it's fixed by showing links hints in a popover element, for browsers that support popover (Chrome, soon Firefox): 412cc37621a578ee260925f31e0722539af33f39
