Merge branch 'Fix-bad-escape-in-empty_state.vue' into 'master'

Fix Bad Escape in Issue Board Empty State

See merge request gitlab-org/gitlab!45465

app/assets/javascripts/boards/components/modal/empty_state.vue

 <script>
-/* eslint-disable vue/no-v-html */
-import { GlButton } from '@gitlab/ui';
-import { __, sprintf } from '~/locale';
+import { GlButton, GlSprintf } from '@gitlab/ui';
+import { __ } from '~/locale';
 import ModalStore from '../../stores/modal_store';
 import modalMixin from '../../mixins/modal_mixins';
 
 export default {
   components: {
     GlButton,
+    GlSprintf,
   },
   mixins: [modalMixin],
   props: {
@@ -34,11 +34,8 @@ export default {
 
       if (this.activeTab === 'selected') {
         obj.title = __("You haven't selected any issues yet");
-        obj.content = sprintf(
-          __(
-            'Go back to %{startTag}Open issues%{endTag} and select some issues to add to your board.',
-          ),
-          { startTag: '<strong>', endTag: '</strong>' },
+        obj.content = __(
+          'Go back to %{tagStart}Open issues%{tagEnd} and select some issues to add to your board.',
         );
       }
 
@@ -57,7 +54,13 @@ export default {
       <div class="col-12 col-md-6 order-md-first">
         <div class="text-content">
           <h4>{{ contents.title }}</h4>
-          <p v-html="contents.content"></p>
+          <p>
+            <gl-sprintf :message="contents.content">
+              <template #tag="{ content }">
+                <strong>{{ content }}</strong>
+              </template>
+            </gl-sprintf>
+          </p>
           <gl-button
             v-if="activeTab === 'all'"
             :href="newIssuePath"

changelogs/unreleased/Fix-bad-escape-in-empty_state-vue.yml

+---
+title: Fix Bad Escape in Issue Board Empty State
+merge_request: 45465
+author: Kev @KevSlashNull
+type: fixed

locale/gitlab.pot

@@ -12804,7 +12804,7 @@ msgstr ""
 msgid "Go back (while searching for files)"
 msgstr ""
 
-msgid "Go back to %{startTag}Open issues%{endTag} and select some issues to add to your board."
+msgid "Go back to %{tagStart}Open issues%{tagEnd} and select some issues to add to your board."
 msgstr ""
 
 msgid "Go full screen"

spec/features/boards/add_issues_modal_spec.rb

@@ -87,11 +87,12 @@ RSpec.describe 'Issue Boards add issue modal', :js do
       end
     end
 
-    it 'shows selected issues' do
+    it 'shows selected issues tab and empty state message' do
       page.within('.add-issues-modal') do
         click_link 'Selected issues'
 
         expect(page).not_to have_selector('.board-card')
+        expect(page).to have_content("Go back to Open issues and select some issues to add to your board.")
       end
     end
 
@@ -147,7 +148,7 @@ RSpec.describe 'Issue Boards add issue modal', :js do
       end
     end
 
-    context 'selecing issues' do
+    context 'selecting issues' do
       it 'selects single issue' do
         page.within('.add-issues-modal') do
           first('.board-card .board-card-number').click
@@ -206,7 +207,7 @@ RSpec.describe 'Issue Boards add issue modal', :js do
         end
       end
 
-      it 'selects all that arent already selected' do
+      it "selects all that aren't already selected" do
         page.within('.add-issues-modal') do
           first('.board-card .board-card-number').click