Tell MessageListItem markdown component to open urls in a new browser tab

Flow
1

Hi guys,

I’m using MessageListItem with markdown text and I’ve noticed that it will open links in the same browser tab/window where Vaadin app is running. Is there a way to open markdown links in a new browser tab?

Best,
Sanel

2

I think markdown does not support target on links, so you have to use an HTML element

3

Thanks! I went with a small javascript workaround that roughly looks like down below, applied when MessageList is rendered:

document.getElementsByTagName("vaadin-message-list")[0]
        .querySelectorAll('a')
        .forEach(link => {link.hostname !== location.hostname && link.setAttribute('target', '_blank');})
1 Like
4

Markdown supports embedding full-fledged html, so you can actually embed a <a href="..." target="_blank">...</a> into the markdown.

5

Yeah, I’m aware of that and thank you for suggestion :) The thing is that I’m getting reply from llm service in markdown format and, AFAIK, the only way to address that is to fiddle with structured output and custom schema (which is an option for the future) or alter each prompt and tell llm to output links with target="_blank" attribute.

6

Actually this does not work: when I instanciate MessageListItem with an <a target="_blank"> final render removes target attribute

You explained it well here: Markdown component improvement - #7 by rofa :+1: