FIX: remove anchors from banner headings.

FIX: remove anchors from banner headings.

Else it will create UX issues when the banner is visible on top of the banner topic.

diff --git a/app/assets/javascripts/discourse/components/discourse-banner.js.es6 b/app/assets/javascripts/discourse/components/discourse-banner.js.es6
index 9182998d76..0bb9e17ecd 100644
--- a/app/assets/javascripts/discourse/components/discourse-banner.js.es6
+++ b/app/assets/javascripts/discourse/components/discourse-banner.js.es6
@@ -2,6 +2,14 @@ import discourseComputed from "discourse-common/utils/decorators";
 import Component from "@ember/component";
 
 export default Component.extend({
+  @discourseComputed("banner.html")
+  content(bannerHtml) {
+    const $div = $("<div>");
+    $div.append(bannerHtml);
+    $div.find("[id^='heading--']").removeAttr("id");
+    return $div.html();
+  },
+
   @discourseComputed("user.dismissed_banner_key", "banner.key", "hide")
   visible(dismissedBannerKey, bannerKey, hide) {
     dismissedBannerKey =
diff --git a/app/assets/javascripts/discourse/templates/components/discourse-banner.hbs b/app/assets/javascripts/discourse/templates/components/discourse-banner.hbs
index ad5cccf6a9..f4864b3dc8 100644
--- a/app/assets/javascripts/discourse/templates/components/discourse-banner.hbs
+++ b/app/assets/javascripts/discourse/templates/components/discourse-banner.hbs
@@ -3,7 +3,7 @@
     <div id="banner" class={{overlay}}>
       {{d-button icon="times" action="dismiss" class="btn btn-flat close" title="banner.close"}}
       <div id="banner-content">
-        {{{banner.html}}}
+        {{{content}}}
         {{#if currentUser.staff}}
           <p><a href="{{banner.url}}">{{{i18n "banner.edit"}}}</a></p>
         {{/if}}

GitHub sha: 7a054fc1

Shouldn’t this be done once on the server-side instead of on every client?

1 Like

I added it as a temporary fix. I think we should support anchors in banner headings. But it will require a major change. Since we’re close to the major version bump I will work on it later.

1 Like