Repository: speee/jsx-slack
Pull request #129 (2020-03-14 00:07:00)

Fix mention detection to match to longer Slack ID
We've matched to Slack ID whose 8 characters, for detecting mentions in `<a>` tag. According to [the changelog of Slack](https://api.slack.com/changelog), the IDs have grown longer to 11 characters (includes prefix) and could more longer in future.

Now the mention detection will match to longer Slack ID, 8 and more characters.


Patch:
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 71811f9..93c11a1 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,10 @@
 
 ## [Unreleased]
 
+### Fixed
+
+- Fix mention detection to match to longer Slack ID ([#129](https://github.com/speee/jsx-slack/pull/129))
+
 ## v1.5.0 - 2020-03-12
 
 ### Changed
diff --git a/src/utils.tsx b/src/utils.tsx
index 0fa78cb..13326ca 100644
--- a/src/utils.tsx
+++ b/src/utils.tsx
@@ -19,7 +19,7 @@ export enum SpecialLink {
   UserMention,
 }
 
-const spLinkMatcher = /^(#C|@[SUW])[A-Z0-9]{8}$/
+const spLinkMatcher = /^(#C|@[SUW])[A-Z0-9]{8,}$/
 const romanNumerals = {
   m: 1000,
   cm: 900,


Test patch:
diff --git a/test/html.tsx b/test/html.tsx
index 1557c4e..24c8f2b 100644
--- a/test/html.tsx
+++ b/test/html.tsx
@@ -1035,6 +1035,7 @@ describe('HTML parser for mrkdwn', () => {
 
     it('converts to channel link when referenced public channel ID', () => {
       expect(html(<a href="#C0123ABCD" />)).toBe('<#C0123ABCD>')
+      expect(html(<a href="#CLONGERCHANNELID" />)).toBe('<#CLONGERCHANNELID>')
       expect(html(<a href="#CWXYZ9876">Ignore contents</a>)).toBe(
         '<#CWXYZ9876>'
       )
@@ -1049,6 +1050,7 @@ describe('HTML parser for mrkdwn', () => {
 
     it('converts to user mention when referenced user ID', () => {
       expect(html(<a href="@U0123ABCD" />)).toBe('<@U0123ABCD>')
+      expect(html(<a href="@ULONGERUSERID" />)).toBe('<@ULONGERUSERID>')
       expect(html(<a href="@WGLOBALID" />)).toBe('<@WGLOBALID>')
       expect(html(<a href="@UWXYZ9876">Ignore contents</a>)).toBe(
         '<@UWXYZ9876>'
@@ -1064,6 +1066,9 @@ describe('HTML parser for mrkdwn', () => {
 
     it('converts to user group mention when referenced subteam ID', () => {
       expect(html(<a href="@S0123ABCD" />)).toBe('<!subteam^S0123ABCD>')
+      expect(html(<a href="@SLONGERSUBTEAMID" />)).toBe(
+        '<!subteam^SLONGERSUBTEAMID>'
+      )
       expect(html(<a href="@SWXYZ9876">Ignore contents</a>)).toBe(
         '<!subteam^SWXYZ9876>'
       )
diff --git a/test/legacy.tsx b/test/legacy.tsx
index 75bbd52..6145c14 100644
--- a/test/legacy.tsx
+++ b/test/legacy.tsx
@@ -848,6 +848,7 @@ describe('Legacy parser for mrkdwn', () => {
 
     it('converts to channel link when referenced public channel ID', () => {
       expect(html(<a href="#C0123ABCD" />)).toBe('<#C0123ABCD>')
+      expect(html(<a href="#CLONGERCHANNELID" />)).toBe('<#CLONGERCHANNELID>')
       expect(html(<a href="#CWXYZ9876">Ignore contents</a>)).toBe(
         '<#CWXYZ9876>'
       )
@@ -862,6 +863,7 @@ describe('Legacy parser for mrkdwn', () => {
 
     it('converts to user mention when referenced user ID', () => {
       expect(html(<a href="@U0123ABCD" />)).toBe('<@U0123ABCD>')
+      expect(html(<a href="@ULONGERUSERID" />)).toBe('<@ULONGERUSERID>')
       expect(html(<a href="@WGLOBALID" />)).toBe('<@WGLOBALID>')
       expect(html(<a href="@UWXYZ9876">Ignore contents</a>)).toBe(
         '<@UWXYZ9876>'
@@ -877,6 +879,9 @@ describe('Legacy parser for mrkdwn', () => {
 
     it('converts to user group mention when referenced subteam ID', () => {
       expect(html(<a href="@S0123ABCD" />)).toBe('<!subteam^S0123ABCD>')
+      expect(html(<a href="@SLONGERSUBTEAMID" />)).toBe(
+        '<!subteam^SLONGERSUBTEAMID>'
+      )
       expect(html(<a href="@SWXYZ9876">Ignore contents</a>)).toBe(
         '<!subteam^SWXYZ9876>'
       )