diff --git a/reportbuilder/templates/editor_navbar.mustache b/reportbuilder/templates/editor_navbar.mustache
index d1aecf9d2ad..d365854a757 100644
--- a/reportbuilder/templates/editor_navbar.mustache
+++ b/reportbuilder/templates/editor_navbar.mustache
@@ -26,7 +26,7 @@
     }
 }}
 <nav class="navbar fixed-top navbar-light bg-white navbar-expand align-items-center" aria-label="{{#str}}sitemenubar, admin{{/str}}">
-    <h1 class="h3 m-0 p-0">{{title}}</h1>
+    <h1 class="h3 m-0 p-0">{{{title}}}</h1>
     <div class="ml-auto d-flex">
         {{{buttons}}}
     </div>
diff --git a/reportbuilder/templates/local/filters/header.mustache b/reportbuilder/templates/local/filters/header.mustache
index 12fb905dd26..c6492bc12db 100644
--- a/reportbuilder/templates/local/filters/header.mustache
+++ b/reportbuilder/templates/local/filters/header.mustache
@@ -27,6 +27,6 @@
 <div class="filter pb-4 mb-3 border-bottom" data-filter-for="{{name}}">
     <div class="filter-header d-flex align-items-start justify-content-between">
         <div class="filter-name">
-            {{name}}
+            {{{name}}}
         </div>
     </div>
diff --git a/reportbuilder/tests/behat/customreports.feature b/reportbuilder/tests/behat/customreports.feature
index afec5984e3c..9efe19703a6 100644
--- a/reportbuilder/tests/behat/customreports.feature
+++ b/reportbuilder/tests/behat/customreports.feature
@@ -151,3 +151,12 @@ Feature: Manage custom reports
     Then I should not see "Preview" in the "[data-region='core_reportbuilder/report']" "css_element"
     And I should not see "Edit" in the "[data-region='core_reportbuilder/report']" "css_element"
     And "button[title='Filters']" "css_element" should exist in the "[data-region='core_reportbuilder/report']" "css_element"
+
+  Scenario: Special characters in report name are shown correctly
+    Given the following "core_reportbuilder > Reports" exist:
+      | name                    | source                                   |
+      | My fish & chips report  | core_user\reportbuilder\datasource\users |
+    When I log in as "admin"
+    And I navigate to "Reports > Report builder > Custom reports" in site administration
+    And I press "Edit report content" action in the "My fish & chips report" report row
+    Then I should see "My fish & chips report" in the "#region-main .navbar" "css_element"
diff --git a/reportbuilder/tests/behat/filtereditor.feature b/reportbuilder/tests/behat/filtereditor.feature
index bb4e1b9f375..01825ee8efc 100644
--- a/reportbuilder/tests/behat/filtereditor.feature
+++ b/reportbuilder/tests/behat/filtereditor.feature
@@ -47,6 +47,20 @@ Feature: Manage custom report filters
     Then I should see "English" in the "[data-region='active-filters']" "css_element"
     And I should not see "Spanish" in the "[data-region='active-filters']" "css_element"
 
+  Scenario: Rename filter in report using special characters
+    Given the following "core_reportbuilder > Reports" exist:
+      | name      | source                                   | default |
+      | My report | core_user\reportbuilder\datasource\users | 0       |
+    And the following "core_reportbuilder > Filters" exist:
+      | report    | uniqueidentifier |
+      | My report | user:email       |
+    And I am on the "My report" "reportbuilder > Editor" page logged in as "admin"
+    And I click on "Show/hide 'Filters'" "button"
+    When I set the field "Rename filter 'Email address'" to "Fish & Chips"
+    And I click on "Switch to preview mode" "button"
+    And I click on "Filters" "button"
+    Then I should see "Fish & Chips" in the "[data-region='report-filters']" "css_element"
+
   Scenario: Move filter in report
     Given the following "core_reportbuilder > Reports" exist:
       | name      | source                                   | default |