Merge branch 'security-mr-reviewer-xss' into 'master'

Escapes MR approval rule names correctly

See merge request gitlab-org/security/gitlab!1760

app/assets/javascripts/users_select/index.js

@@ -842,7 +842,7 @@ UsersSelect.prototype.renderApprovalRules = function (elsClassName, approvalRule
   const [rule] = approvalRules;
   const countText = sprintf(__('(+%{count} rules)'), { count });
   const renderApprovalRulesCount = count > 1 ? `<span class="ml-1">${countText}</span>` : '';
-  const ruleName = rule.rule_type === 'code_owner' ? __('Code Owner') : rule.name;
+  const ruleName = rule.rule_type === 'code_owner' ? __('Code Owner') : escape(rule.name);
 
   return `<div class="gl-display-flex gl-font-sm">
     <span class="gl-text-truncate" title="${ruleName}">${ruleName}</span>

spec/frontend/users_select/index_spec.js

+import { escape } from 'lodash';
+import UsersSelect from '~/users_select/index';
 import {
   createInputsModelExpectation,
   createUnassignedExpectation,
@@ -91,5 +93,19 @@ describe('~/users_select/index', () => {
         expect(findDropdownItemsModel()).toEqual(expectation);
       });
     });
+
+    describe('renderApprovalRules', () => {
+      const ruleNames = ['simple-name', '"\'<>&', '"><script>alert(1)<script>'];
+
+      it.each(ruleNames)('escapes rule name correctly for %s', (name) => {
+        const escapedName = escape(name);
+
+        expect(
+          UsersSelect.prototype.renderApprovalRules('reviewer', [{ name }]),
+        ).toMatchInterpolatedText(
+          `<div class="gl-display-flex gl-font-sm"> <span class="gl-text-truncate" title="${escapedName}">${escapedName}</span> </div>`,
+        );
+      });
+    });
   });
 });