Merge branch...

Merge branch '241912-remove-v-html-from-ee-app-assets-javascripts-environments-components-deploy_board_component' into 'master'

Remove v-html from ee/app/assets/javascripts/environments/components/deploy_board_component.vue

Closes #241912

See merge request gitlab-org/gitlab!41521

ee/app/assets/javascripts/environments/components/deploy_board_component.vue

 <script>
-/* eslint-disable @gitlab/vue-require-i18n-strings, vue/no-v-html */
+/* eslint-disable @gitlab/vue-require-i18n-strings */
 /**
  * Renders a deploy board.
  *
@@ -10,7 +10,12 @@
  * [Mockup](https://gitlab.com/gitlab-org/gitlab-foss/uploads/2f655655c0eadf655d0ae7467b53002a/environments__deploy-graphic.png)
  */
 import { isEmpty } from 'lodash';
-import { GlLoadingIcon, GlLink, GlTooltipDirective } from '@gitlab/ui';
+import {
+  GlLoadingIcon,
+  GlLink,
+  GlTooltipDirective,
+  GlSafeHtmlDirective as SafeHtml,
+} from '@gitlab/ui';
 import deployBoardSvg from 'ee_empty_states/icons/_deploy_board.svg';
 import { n__, s__, sprintf } from '~/locale';
 import { STATUS_MAP, CANARY_STATUS } from '../constants';
@@ -23,6 +28,7 @@ export default {
   },
   directives: {
     GlTooltip: GlTooltipDirective,
+    SafeHtml,
   },
   props: {
     deployBoardData: {
@@ -112,7 +118,7 @@ export default {
     <gl-loading-icon v-if="isLoading" class="loading-icon" />
     <template v-else>
       <div v-if="hasLegacyAppLabel" class="bs-callout bs-callout-warning mb-0 mt-0">
-        <span v-html="legacyLabelWarningMessage"></span>
+        <span v-safe-html="legacyLabelWarningMessage"></span>
         <gl-link target="_blank" :href="deployBoardsHelpPath">
           <strong>{{ __('More Information') }}</strong>
         </gl-link>
@@ -180,7 +186,7 @@ export default {
       </div>
 
       <div v-if="canRenderEmptyState" class="deploy-board-empty">
-        <section class="deploy-board-empty-state-svg" v-html="deployBoardSvg"></section>
+        <section v-safe-html="deployBoardSvg" class="deploy-board-empty-state-svg"></section>
 
         <section class="deploy-board-empty-state-text">
           <span class="deploy-board-empty-state-title d-flex">{{

ee/changelogs/unreleased/241912-remove-v-html-from-ee-app-assets-javascripts-environments-compo.yml

+---
+title: Remove v-html from environments/components/deploy_board_component.vue
+merge_request: 41521
+author: Takuya Noguchi
+type: security