Embedded links in the same domain as the webchat should open in the same tab, instead of a new tab - related to #3087

Feature Request

Is your feature request related to a problem? Please describe. Embedded web links in messages that are for the same domain open in new tabs. It would be nice to be able to control whether an embedded link in the same domain opens in a new tab or in the same tab.

For example,

If the webchat is active in the web domain of ‘test’ and an embedded link is for a domain ‘test1’ then the link will be.

<a href='https://test1/...' target='_blank' />

else if the domain of the embedded link is for the same domain as the webchat then the link will be

<a href='https://test/...' target='_self' />

Describe the suggestion or request in detail It would be nice to have a webchat style option to control whether a link within the same domain as the webchat opens in a new tab or the same tab.

https://github.com/Microsoft/BotFramework-WebChat/blob/master/packages/component/src/Styles/defaultStyleOptions.js

Describe alternatives you have considered The only other solutions to solve this problem is to implement a work around using DOM manipulation or to implement a custom webchat client from scratch.

Additional context

This is an issue with embedded links in messages not action buttons that appear on the bottom of cards. Though it would make sense that this feature would also affect the behavior of action buttons as well.

[tdurnford]

@scch1002 I think the Web Chat team would be open to adding an openInExistingWindow style option; however, we’d need to investigate if a style option is capable of covering all of the possible cases such as markdown, Adaptive Cards buttons and tap actions, and file download links.

In terms of markdown links, Web Chat implements a custom markdown renderer that sets the target to _blank. Developers can currently pass their own markdown renderer to Web Chat that does not set the target. Take a look at the code snippet and screen capture below for more details.

Web Chat v4

<script src="https://cdnjs.cloudflare.com/ajax/libs/markdown-it/10.0.0/markdown-it.js"></script>
<script>
  (async function() {
    const res = await fetch('https://webchat-mockbot.azurewebsites.net/directline/token', { method: 'POST' });
    const { token } = await res.json();

    const markdownIt = window.markdownit();

    window.WebChat.renderWebChat(
      {
        directLine: window.WebChat.createDirectLine({ token }),
        renderMarkdown: text => markdownIt.render(text)
      },
      document.getElementById('webchat')
    );

    document.querySelector('#webchat > *').focus();
  })().catch(err => console.error(err));
</script>

Screen capture

Relevant Code

https://github.com/microsoft/BotFramework-WebChat/blob/17f406974253eac292637a33f87d6ce07092fb8d/packages/bundle/src/renderMarkdown.js#L61

[cwhitten]

Hi @scch1002. openInExistingWindow style option seems totally reasonable. I’ll work with the team to formalize this API. Realistically we’d be looking at a May '20 or August '20 release that introduces this behavior.