September 18, 2020

Quick Share a link to Microsoft Teams

I have discovered recently by chance this nice feature: https://docs.microsoft.com/en-us/microsoftteams/platform/concepts/build-and-test/share-to-teams that allows to quickly share a link from the browser into a Microsoft Teams Channel.
I share here my learnings and how to integrate this feature e.g. to a hotkey.  

Feature Highlight

The feature is documented here
Opening a link like teams.microsoft.com/share?href=$url will open this nice Share window where you can comfortably select to which channel you want to post this url



will provide such a share window:



This is a big time saver compared to the other way around: 
copy the url to the clipboard, switch to Teams, search for the Channel you want to share, start a new conversation and paste the url.

Issues

In the share form, you can not provide a title to the conversation.
I have opened an issue to provide this feature request here  https://github.com/MicrosoftDocs/msteams-docs/issues/2077

If the shared url contains a ? in it it won't work.

Also the preview only works if no authentification is required (e.g. it won't work for Connections url)

Add to your AutoHotkey Script

The AHK code to assign this to a hotkey is as easy as following:

#IfWinActive, ahk_group Browser
^+t:: ; <--- [Browser] Share by Teams active url
TeamsShareActiveUrl:
sLink := GetActiveBrowserUrl()
sLink := CleanUrl(sLink,false)
sLink = https://teams.microsoft.com/share?href=%sLink%
Run %sLink%
return

NWS PowerTool Integration

This feature is implemented in the NWS PowerTool
You can access it by opening the PowerTool main menu Win+F1 when a Browser window is selected.

Add a button to your Chrome Extension

When providing such a command in your Chrome Extension you can also assign a hotkey to it.

In your manifest.json add the command:
"commands": {
    "share2teams" : {
      "suggested_key": {
           "default": "Alt+T" 
      },
      "description": "(Teams) Share Url"
    }     
  }

In your background.js add a listener to this command:
chrome.commands.onCommand.addListener(function (command) {
if (command === "share2teams"{
    Share2Teams();  
} // end if command share2teams
}); // end command.addListener
(for the hotkey)

and for the extension icon context menu

chrome.contextMenus.onClicked.addListener(function(info, tab) {
    if (info.menuItemId == "nws_crx_share2teams"{
        Share2Teams();
    }
});


function Share2Teams(){
chrome.tabs.query({active: true,currentWindow: true}, function(tabs) {
url = tabs[0].url;
re= /[&|\?]lang=[\w\-_]+(#!)?/;
url = url.replace(re, "");
//url = url.replace("?","%3F");
//url = url.replace(new RegExp("?", 'g'), "%3F");
window.open('https://teams.microsoft.com/share?href=' + url + '%2F&referrer=Share to Microsoft Teams','ms-teams-share-popup', 'width=700,height=600');  
});
} // eofun Share2Teams


Because the URL returned from url = document.location.href; when run from the Chrome extension icon is not the current tab URL. you need to use 
chrome.tabs.query({active: true,currentWindow: true}, function(tabs) {
url = tabs[0].url;
to get the current tab URL.

Alternatively, you can use an injected js script
and call it with:
 chrome.tabs.executeScript(tab.ib, {
            file: 'share2teams.js'
        });

share2teams.js looks like this:
(function() {
    var url = document.location.href;
    //alert(url);
    re= /[&|\?]lang=[\w\-_]+(#!)?/;
    url = url.replace(re, "");
    window.open('https://teams.microsoft.com/share?href=' + url + '%2F&referrer=Share to Microsoft Teams', 'ms-teams-share-popup', 'width=700,height=600');
})();

Note the necessary %2F&referrer=Share to Microsoft Teams part to workaround ? in URL issues.

This feature is implemented in my personal Chrome Extension which source code is available in this GitHub repository: https://github.com/tdalon/my_crx

There, you can see also how to add a Context Menu to the extension icon to run this feature from it.

BIG Thanks to Joao https://teams.handsontek.net/ for sharing this Chrome Extension that led me to discover this feature.

No comments:

Post a Comment