External links are not clickable in page preview

Steps to reproduce

Add an external link to a note, then hover-preview that note and click on the link

Expected result

Link should open

Actual result

Preview closes without any further effect

Environment

  • Operating system: Windows
  • Obsidian version: 0.12.12

Additional information

According to this post, this issue was slated to be fixed in an insider build last month, but evidently it didn’t make it, and it isn’t listed as a fix in the release notes for any of the current insider builds either.

Btw, in case the cause/fix isn’t known, the issue is that external links will only open if the click event default behavior is allowed, but the markdown preview’s “close on click” handling prevents the default behavior. To fix this, MarkdownPreviewRenderer’s onExternalLinkClick() could call stopPropagation() on the click event (so it doesn’t bubble up to the level where the default gets prevented), and then explicitly close the preview. This would allow the default behavior to fire and the preview to be closed.

(Incidentally, doing a stopPropagation in its onCheckboxClick method to keep the preview from closing when you tick a box would be nice, too! It’d be especially useful when doing task searches and previewing the results.)

Alternately, just giving hover previews an explicit closing X and only closing them on link clicks or the explicit closing X (or by mouse out, of course) would avoid the issue entirely, and support plugins having more active UI accessible in hover previews, without the need to code explicit propagation stops for every possible interaction.

For anybody who needs a workaround, here is the complete source of a plugin that allows external links to open normally:

var obsidian = require('obsidian');

module.exports = class QuickFixes extends obsidian.Plugin {
    onload() {
        this.register(
            onElement(
                document, "click",
                ".hover-popover .markdown-preview-view", e => {
                    // Don't allow popover click handler to preventDefault
                    e.preventDefault = () => undefined;
                },
                {capture: false}
            )
        );
    }
}

function onElement(el, event, selector, callback, options) {
    el.on(event, selector, callback, options)
    return () => el.off(event, selector, callback, options);
}

I think this was merged.

Apparently I lost the commit in a merge conflict! Will be released with the next insider. Sorry about that!

1 Like