From 6fa572529283deba7218e164f471e594a6eedaad Mon Sep 17 00:00:00 2001
From: Joffrey JAFFEUX <j.jaffeux@gmail.com>
Date: Mon, 30 Dec 2019 08:18:36 +0100
Subject: [PATCH] FIX: makes highlighting last viewed topic more resilient
 (#8624)

`highlight` was called from `didInsertElement` which technically doesn't ensure the list is rendered. By wrapping the highlighting code in `afterRender` we ensure it works more consistently.
---
 .../discourse/components/topic-list-item.js.es6 | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/app/assets/javascripts/discourse/components/topic-list-item.js.es6 b/app/assets/javascripts/discourse/components/topic-list-item.js.es6
index 670d45b64cf..2909dce548e 100644
--- a/app/assets/javascripts/discourse/components/topic-list-item.js.es6
+++ b/app/assets/javascripts/discourse/components/topic-list-item.js.es6
@@ -1,6 +1,7 @@
 import discourseComputed from "discourse-common/utils/decorators";
 import { alias } from "@ember/object/computed";
 import Component from "@ember/component";
+import { schedule } from "@ember/runloop";
 import DiscourseURL from "discourse/lib/url";
 import { bufferedRender } from "discourse-common/lib/buffered-render";
 import { findRawTemplate } from "discourse/lib/raw-templates";
@@ -197,12 +198,18 @@ export const ListItemDefaults = {
   navigateToTopic,
 
   highlight(opts = { isLastViewedTopic: false }) {
-    const $topic = $(this.element);
-    $topic
-      .addClass("highlighted")
-      .attr("data-islastviewedtopic", opts.isLastViewedTopic);
+    schedule("afterRender", () => {
+      if (!this.element || this.isDestroying || this.isDestroyed) {
+        return;
+      }
 
-    $topic.on("animationend", () => $topic.removeClass("highlighted"));
+      const $topic = $(this.element);
+      $topic
+        .addClass("highlighted")
+        .attr("data-islastviewedtopic", opts.isLastViewedTopic);
+
+      $topic.on("animationend", () => $topic.removeClass("highlighted"));
+    });
   },
 
   _highlightIfNeeded: on("didInsertElement", function() {