wildcard_mention: Don't highlight for unsubbed users.

web/src/rendered_markdown.js

@@ -11,6 +11,7 @@ import {$t, $t_html} from "./i18n";
 import * as people from "./people";
 import * as realm_playground from "./realm_playground";
 import * as rtl from "./rtl";
+import * as stream_data from "./stream_data";
 import * as sub_store from "./sub_store";
 import * as timerender from "./timerender";
 import {show_copied_confirmation} from "./tippyjs";
@@ -82,8 +83,24 @@ export const update_elements = ($content) => {
         // We give special highlights to the mention buttons
         // that refer to the current user.
         if (user_id === "*" || people.is_my_user_id(user_id)) {
-            // Either a wildcard mention or us, so mark it.
-            $(this).addClass("user-mention-me");
+            const $message_header_stream = $content
+                .closest(".recipient_row")
+                .find(".message_header.message_header_stream");
+            // If stream message
+            if ($message_header_stream.length) {
+                const stream_id = Number.parseInt(
+                    $message_header_stream.attr("data-stream-id"),
+                    10,
+                );
+                // Don't highlight the mention if user is not subscribed to the stream.
+                if (stream_data.is_user_subscribed(stream_id, people.my_current_user_id())) {
+                    // Either a wildcard mention or us, so mark it.
+                    $(this).addClass("user-mention-me");
+                }
+            } else {
+                // Always highlight wildcard mentions in private message.
+                $(this).addClass("user-mention-me");
+            }
         }
         if (user_id && user_id !== "*" && !$(this).find(".highlight").length) {
             // If it's a mention of a specific user, edit the

web/tests/rendered_markdown.test.js

@@ -78,6 +78,17 @@ const $array = (array) => {
     return {each};
 };
 
+function set_closest_dot_find_result($content, value) {
+    $content.closest = (closest_opts) => {
+        assert.equal(closest_opts, ".recipient_row");
+        const find = (find_opts) => {
+            assert.equal(find_opts, ".message_header.message_header_stream");
+            return value;
+        };
+        return {find};
+    };
+}
+
 const get_content_element = () => {
     const $content = $.create("content-stub");
     $content.set_find_results(".user-mention", $array([]));
@@ -89,6 +100,7 @@ const get_content_element = () => {
     $content.set_find_results(".emoji", $array([]));
     $content.set_find_results("div.spoiler-header", $array([]));
     $content.set_find_results("div.codehilite", $array([]));
+    set_closest_dot_find_result($content, []);
 
     // Fend off dumb security bugs by forcing devs to be
     // intentional about HTML manipulation.
@@ -141,7 +153,7 @@ run_test("user-mention", () => {
     assert.equal($cordelia.text(), `@${cordelia.full_name}`);
 });
 
-run_test("user-mention (wildcard)", () => {
+run_test("user-mention PM (wildcard)", () => {
     // Setup
     const $content = get_content_element();
     const $mention = $.create("mention");
@@ -153,6 +165,37 @@ run_test("user-mention (wildcard)", () => {
     assert.ok($mention.hasClass("user-mention-me"));
 });
 
+run_test("user-mention Stream subbed (wildcard)", () => {
+    // Setup
+    const $content = get_content_element();
+    const $mention = $.create("mention");
+    $mention.attr("data-user-id", "*");
+    $content.set_find_results(".user-mention", $array([$mention]));
+    const attr = () => stream.stream_id;
+    set_closest_dot_find_result($content, {attr, length: 1});
+    stream_data.is_user_subscribed = () => true;
+
+    assert.ok(!$mention.hasClass("user-mention-me"));
+    rm.update_elements($content);
+    assert.ok($mention.hasClass("user-mention-me"));
+});
+
+run_test("user-mention Stream not subbed (wildcard)", () => {
+    // Setup
+    const $content = get_content_element();
+    const $mention = $.create("mention");
+    $mention.attr("data-user-id", "*");
+    $content.set_find_results(".user-mention", $array([$mention]));
+    const attr = () => 1;
+    set_closest_dot_find_result($content, {attr, length: 1});
+    stream_data.is_user_subscribed = () => false;
+
+    // Don't add user-mention-me class.
+    assert.ok(!$mention.hasClass("user-mention-me"));
+    rm.update_elements($content);
+    assert.ok(!$mention.hasClass("user-mention-me"));
+});
+
 run_test("user-mention (email)", () => {
     // Setup
     const $content = get_content_element();