From ea1c1783057a609972040d34ab2a17db2d7015ca Mon Sep 17 00:00:00 2001
From: Rohitt Vashishtha <aero31aero@gmail.com>
Date: Wed, 15 Jul 2020 05:38:01 +0530
Subject: [PATCH] markdown: Format spoilers for desktop notifications.

We hide the spoiler content in browser/desktop notifications.

Note: its not worth adding zjquery tests for this bit of code because
the tests do not operate on the actual data and are likely to get stale
if we change the syntax for spoilers.
---
 frontend_tests/node_tests/notifications.js |  2 ++
 frontend_tests/node_tests/spoilers.js      | 32 ++++++++++++++++++++++
 static/js/notifications.js                 |  1 +
 static/js/spoilers.js                      | 13 +++++++++
 4 files changed, 48 insertions(+)
 create mode 100644 frontend_tests/node_tests/spoilers.js

diff --git a/frontend_tests/node_tests/notifications.js b/frontend_tests/node_tests/notifications.js
index 5d78b949cc..2801ec2ca6 100644
--- a/frontend_tests/node_tests/notifications.js
+++ b/frontend_tests/node_tests/notifications.js
@@ -24,6 +24,8 @@ zrequire('muting');
 zrequire('stream_data');
 zrequire('people');
 zrequire('ui');
+zrequire('spoilers');
+spoilers.hide_spoilers_in_notification = () => {};
 
 zrequire('notifications');
 
diff --git a/frontend_tests/node_tests/spoilers.js b/frontend_tests/node_tests/spoilers.js
new file mode 100644
index 0000000000..aa86a472c0
--- /dev/null
+++ b/frontend_tests/node_tests/spoilers.js
@@ -0,0 +1,32 @@
+set_global('$', global.make_zjquery());
+zrequire('spoilers');
+
+// This function is taken from rendered_markdown.js and slightly modified.
+const $array = (array) => {
+    const each = (func) => {
+        array.forEach((elem, index) => {
+            func.call(this, index, elem);
+        });
+    };
+    return {each};
+};
+
+const get_spoiler_elem = (title) => {
+    const block = $.create(`block-${title}`);
+    const header = $.create(`header-${title}`);
+    const content = $.create(`content-${title}`);
+    header.text(title);
+    block.set_find_results('.spoiler-header', header);
+    block.set_find_results('.spoiler-content', content);
+    return block;
+};
+
+run_test('hide spoilers in notifications', () => {
+    const root = $.create('root element');
+    const spoiler_1 = get_spoiler_elem('this is the title');
+    const spoiler_2 = get_spoiler_elem('');
+    root.set_find_results('.spoiler-block', $array([spoiler_1, spoiler_2]));
+    spoilers.hide_spoilers_in_notification(root);
+    assert.equal(spoiler_1.find('.spoiler-header').text(), 'this is the title (…)');
+    assert.equal(spoiler_2.find('.spoiler-header').text(), '(…)');
+});
diff --git a/static/js/notifications.js b/static/js/notifications.js
index 1c587c73c5..c150d04974 100644
--- a/static/js/notifications.js
+++ b/static/js/notifications.js
@@ -299,6 +299,7 @@ function process_notification(notification) {
     // Convert the content to plain text, replacing emoji with their alt text
     content = $('<div/>').html(message.content);
     ui.replace_emoji_with_text(content);
+    spoilers.hide_spoilers_in_notification(content);
     content = content.text();
 
     const topic = message.topic;
diff --git a/static/js/spoilers.js b/static/js/spoilers.js
index f1095822a7..1971fb29e7 100644
--- a/static/js/spoilers.js
+++ b/static/js/spoilers.js
@@ -33,6 +33,19 @@ function expand_spoiler(spoiler) {
     });
 }
 
+exports.hide_spoilers_in_notification = (content) => {
+    content.find('.spoiler-block').each((i, elem) => {
+        $(elem).find('.spoiler-content').remove();
+        let text = $(elem).find('.spoiler-header').text().trim();
+        if (text.length > 0) {
+            text = `${text} `;
+        }
+        text = `${text}(…)`;
+        $(elem).find('.spoiler-header').text(text);
+    });
+    return content;
+};
+
 exports.initialize = function () {
     $("body").on("click", ".spoiler-header", function (e) {
         const button = $(this).children('.spoiler-button');