diff --git a/webapp/channels/src/utils/text_formatting.test.ts b/webapp/channels/src/utils/text_formatting.test.ts
index 73ac30fb81..42485c3e84 100644
--- a/webapp/channels/src/utils/text_formatting.test.ts
+++ b/webapp/channels/src/utils/text_formatting.test.ts
@@ -7,7 +7,13 @@ import EmojiMap from 'utils/emoji_map';
 import {getEmojiMap} from 'selectors/emojis';
 import store from 'stores/redux_store.jsx';
 
-import {formatText, autolinkAtMentions, highlightSearchTerms, handleUnicodeEmoji, parseSearchTerms} from 'utils/text_formatting';
+import {
+    formatText,
+    autolinkAtMentions,
+    highlightSearchTerms,
+    handleUnicodeEmoji,
+    parseSearchTerms, autolinkChannelMentions, ChannelNamesMap,
+} from 'utils/text_formatting';
 import LinkOnlyRenderer from 'utils/markdown/link_only_renderer';
 
 const emptyEmojiMap = new EmojiMap(new Map());
@@ -176,6 +182,26 @@ describe('highlightSearchTerms', () => {
     });
 });
 
+describe('autolink channel mentions', () => {
+    test('link a channel mention', () => {
+        const mention = '~test-channel';
+        const leadingText = 'pre blah blah ';
+        const trailingText = ' post blah blah';
+        const text = `${leadingText}${mention}${trailingText}`;
+        const tokens = new Map();
+        const channelNamesMap: ChannelNamesMap = {
+            'test-channel': {
+                team_name: 'ad-1',
+                display_name: 'Test Channel',
+            },
+        };
+
+        const output = autolinkChannelMentions(text, tokens, channelNamesMap);
+        expect(output).toBe(`${leadingText}$MM_CHANNELMENTION0$${trailingText}`);
+        expect(tokens.get('$MM_CHANNELMENTION0$').value).toBe('<a class="mention-link" href="/ad-1/channels/test-channel" data-channel-mention-team="ad-1" data-channel-mention="test-channel">~Test Channel</a>');
+    });
+});
+
 describe('handleUnicodeEmoji', () => {
     const emojiMap = getEmojiMap(store.getState());
     const UNICODE_EMOJI_REGEX = emojiRegex();
diff --git a/webapp/channels/src/utils/text_formatting.tsx b/webapp/channels/src/utils/text_formatting.tsx
index 495ca66776..1090f1c7ca 100644
--- a/webapp/channels/src/utils/text_formatting.tsx
+++ b/webapp/channels/src/utils/text_formatting.tsx
@@ -481,7 +481,7 @@ export function allAtMentions(text: string): RegExpMatchArray {
     return text.match(Constants.SPECIAL_MENTIONS_REGEX && AT_MENTION_PATTERN) || [];
 }
 
-function autolinkChannelMentions(
+export function autolinkChannelMentions(
     text: string,
     tokens: Tokens,
     channelNamesMap: ChannelNamesMap,
@@ -498,7 +498,7 @@ function autolinkChannelMentions(
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             href = ((window as any).basename || '') + '/' + teamName + '/channels/' + channelName;
             tokens.set(alias, {
-                value: `<a class="mention-link" href="${href}" data-channel-mention-team="${teamName}" "data-channel-mention="${channelName}">~${displayName}</a>`,
+                value: `<a class="mention-link" href="${href}" data-channel-mention-team="${teamName}" data-channel-mention="${channelName}">~${displayName}</a>`,
                 originalText: mention,
             });
         } else if (team) {