diff --git a/app/assets/javascripts/discourse/app/components/categories-boxes-topic.js b/app/assets/javascripts/discourse/app/components/categories-boxes-topic.js
index 2fa8609125..f7b7e10ef5 100644
--- a/app/assets/javascripts/discourse/app/components/categories-boxes-topic.js
+++ b/app/assets/javascripts/discourse/app/components/categories-boxes-topic.js
@@ -3,6 +3,7 @@ import discourseComputed from "discourse-common/utils/decorators";
 
 export default Component.extend({
   tagName: "li",
+  attributeBindings: ["topic.id:data-topic-id"],
 
   @discourseComputed("topic.pinned", "topic.closed", "topic.archived")
   topicStatusIcon(pinned, closed, archived) {
diff --git a/app/assets/javascripts/discourse/app/components/featured-topic.js b/app/assets/javascripts/discourse/app/components/featured-topic.js
index fd01dce8d2..451bf1eecb 100644
--- a/app/assets/javascripts/discourse/app/components/featured-topic.js
+++ b/app/assets/javascripts/discourse/app/components/featured-topic.js
@@ -1,6 +1,7 @@
 import Component from "@ember/component";
 export default Component.extend({
   classNameBindings: [":featured-topic"],
+  attributeBindings: ["topic.id:data-topic-id"],
 
   click(e) {
     const $target = $(e.target);