WIP: End all emoji reactions on VS16

changelog.d/522.bugfix

@@ -0,0 +1 @@
+End all emoji reactions on VS16 in compliance with MSC2677

src/BridgedRoom.ts

@@ -52,6 +52,15 @@ interface ISlackChatMessagePayload extends IMatrixToSlackResult {
 const RECENT_MESSAGE_MAX = 10;
 const PUPPET_INCOMING_DELAY_MS = 1500;
 
+export const emojifyReaction = (emojiLonghand: string, on_missing?: (a: string)=>string): string => {
+    let reactionKey = emoji.emojify(emojiLonghand, on_missing);
+    // The Matrix spec (MSC2677) wants all emoji reactions to end with VARIATION SELECTOR-16.
+    // https://github.com/matrix-org/matrix-doc/pull/2677/files#diff-d923db279cef6ece055fee081cfc3f3aR56
+    if (!reactionKey.endsWith(':') && !reactionKey.endsWith('\ufe0f')) {
+        reactionKey += '\ufe0f'.normalize(); // VARIATION SELECTOR-16
+    }
+    return reactionKey;
+};
 
 /**
  * A BridgedRoom is a 1-to-1 connection of a Matrix room and a Slack channel.
@@ -675,11 +684,7 @@ export class BridgedRoom {
             return;
         }
 
-        let reactionKey = emoji.emojify(`:${message.reaction}:`, getFallbackForMissingEmoji);
-        // Element uses the default thumbsup and thumbsdown reactions with an appended variant character.
-        if (reactionKey === '👍' || reactionKey === '👎') {
-            reactionKey += '\ufe0f'.normalize(); // VARIATION SELECTOR-16
-        }
+        const reactionKey = emojifyReaction(`:${message.reaction}:`, getFallbackForMissingEmoji);
 
         if (this.recentSlackMessages.includes(`reactadd:${reactionKey}:${message.user_id}:${message.item.ts}`)) {
             // We sent this, ignore.

src/tests/unit/BridgedRoomTest.ts

@@ -14,7 +14,8 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import { BridgedRoom } from "../../BridgedRoom";
+import { expect } from "chai";
+import { BridgedRoom, emojifyReaction } from "../../BridgedRoom";
 
 describe("BridgedRoom", () => {
     it("constructs", () => {
@@ -25,3 +26,67 @@ describe("BridgedRoom", () => {
         });
     });
 });
+
+describe("emojifyReaction", () => {
+    describe("Ends with Variant Selector 16", () => {
+        it("On former quick reactions", () => {
+            expect(emojifyReaction(':thumbsup:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':thumbsdown:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':rocket:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':heart:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':tada:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':eyes:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':smile:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':confused:')).to.match(/\ufe0f$/);
+        });
+        it("On other emojis", () => {
+            expect(emojifyReaction(':female-police-officer:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':male-singer:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':construction_worker:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':flag-ca:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':tm:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':electric_plug:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':clock430:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':metro:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':dog:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':woman-woman-boy-boy:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':mage:')).to.match(/\ufe0f$/);
+        });
+        it("On emoji sequences", () => {
+            expect(emojifyReaction(':male-farmer::skin-tone-2:')).to.match(/\ufe0f$/);
+            expect(emojifyReaction(':dancer::skin-tone-6:')).to.match(/\ufe0f$/);
+        });
+    });
+    describe("Doesn't contain a Variant Selector 16 other than at the end", () => {
+        it("On former quick reactions", () => {
+            expect(emojifyReaction(':thumbsup:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':thumbsdown:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':rocket:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':heart:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':tada:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':eyes:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':smile:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':confused:')).to.match(/^[^\ufe0f]*.$/);
+        });
+        it("On other emojis", () => {
+            expect(emojifyReaction(':female-police-officer:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':male-singer:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':construction_worker:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':flag-ca:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':tm:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':electric_plug:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':clock430:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':metro:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':dog:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':woman-woman-boy-boy:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':mage:')).to.match(/^[^\ufe0f]*.$/);
+        });
+        it("On emoji sequences", () => {
+            expect(emojifyReaction(':male-farmer::skin-tone-2:')).to.match(/^[^\ufe0f]*.$/);
+            expect(emojifyReaction(':dancer::skin-tone-6:')).to.match(/^[^\ufe0f]*.$/);
+        });
+    });
+    it("Returns the same string when no emoji with that name exists", () => {
+        expect(emojifyReaction(':notanemoji:')).to.equal(':notanemoji:');
+    });
+});