Merge branch 'fix-anchor-scrolling' into 'master'

Fix broken anchor links when special characters are used

Closes #26778

See merge request !8961

3 files changed, 20 insertions, 0 deletions

diff --git a/app/assets/javascripts/lib/utils/common_utils.js.es6 b/app/assets/javascripts/lib/utils/common_utils.js.es6
index 0c6a3cc3170..477d026e270 100644
--- a/app/assets/javascripts/lib/utils/common_utils.js.es6
+++ b/app/assets/javascripts/lib/utils/common_utils.js.es6
@@ -69,6 +69,9 @@
       var hash = w.gl.utils.getLocationHash();
       if (!hash) return;
 
+      // This is required to handle non-unicode characters in hash
+      hash = decodeURIComponent(hash);
+
       var navbar = document.querySelector('.navbar-gitlab');
       var subnav = document.querySelector('.layout-nav');
       var fixedTabs = document.querySelector('.js-tabs-affix');
diff --git a/changelogs/unreleased/fix-anchor-scrolling.yml b/changelogs/unreleased/fix-anchor-scrolling.yml
new file mode 100644
index 00000000000..43b3b9bf96e
--- /dev/null
+++ b/changelogs/unreleased/fix-anchor-scrolling.yml
@@ -0,0 +1,4 @@
+---
+title: Fix broken anchor links when special characters are used
+merge_request: 8961
+author: Andrey Krivko
diff --git a/spec/javascripts/lib/utils/common_utils_spec.js.es6 b/spec/javascripts/lib/utils/common_utils_spec.js.es6
index 031f9ca03c9..f41967a5d02 100644
--- a/spec/javascripts/lib/utils/common_utils_spec.js.es6
+++ b/spec/javascripts/lib/utils/common_utils_spec.js.es6
@@ -41,6 +41,19 @@
       });
     });
 
+    describe('gl.utils.handleLocationHash', () => {
+      beforeEach(() => {
+        window.history.pushState({}, null, '#definição');
+      });
+
+      it('decodes hash parameter', () => {
+        spyOn(window.document, 'getElementById').and.callThrough();
+        gl.utils.handleLocationHash();
+        expect(window.document.getElementById).toHaveBeenCalledWith('definição');
+        expect(window.document.getElementById).toHaveBeenCalledWith('user-content-definição');
+      });
+    });
+
     describe('gl.utils.getParameterByName', () => {
       it('should return valid parameter', () => {
         const value = gl.utils.getParameterByName('reporter');