Fix XSS in Ancestor tooltip title

Ancestor tooltip does not escape HTML when rendering. With this
we'll escape HTML using underscore's escape method.

ee/app/assets/javascripts/sidebar/components/ancestors_tree/ancestors_tree.vue

 <script>
 import { GlLoadingIcon, GlLink, GlTooltip } from '@gitlab/ui';
+import { escape } from 'underscore';
 
 import { __ } from '~/locale';
 import Icon from '~/vue_shared/components/icon.vue';
@@ -38,6 +39,8 @@ export default {
       // Fallback to None if immediate parent is unavailable.
 
       let { title } = immediateParent;
+      title = escape(title);
+
       const { humanReadableEndDate, humanReadableTimestamp } = immediateParent;
 
       if (humanReadableEndDate || humanReadableTimestamp) {

ee/changelogs/unreleased/security-rs-milestone-xss-12-0.yml

+---
+title: Fix XSS in Ancestor tooltip title
+merge_request:
+author:
+type: security

ee/spec/javascripts/sidebar/ee_ancestor_tree_spec.js

 import Vue from 'vue';
+import { escape } from 'underscore';
 import ancestorsTree from 'ee/sidebar/components/ancestors_tree/ancestors_tree.vue';
 import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
@@ -59,4 +60,19 @@ describe('AncestorsTreeContainer', () => {
       .then(done)
       .catch(done.fail);
   });
+
+  it('escapes html in the tooltip', done => {
+    const title = '<script>alert(1);</script>';
+    const escapedTitle = escape(title);
+
+    vm.$props.ancestors = [{ id: 1, url: '', title, state: 'open' }];
+    vm.$nextTick()
+      .then(() => {
+        const tooltip = vm.$el.querySelector('.collapse-truncated-title');
+
+        expect(tooltip.innerText).toBe(escapedTitle);
+      })
+      .then(done)
+      .catch(done.fail);
+  });
 });