Add latest changes from gitlab-org/gitlab@14-10-stable-eev14.10.0-rc42

3 files changed, 36 insertions, 6 deletions

diff --git a/spec/frontend/vue_shared/components/markdown/apply_suggestion_spec.js b/spec/frontend/vue_shared/components/markdown/apply_suggestion_spec.js
index c56628fcbcd..ecb2b37c3a5 100644
--- a/spec/frontend/vue_shared/components/markdown/apply_suggestion_spec.js
+++ b/spec/frontend/vue_shared/components/markdown/apply_suggestion_spec.js
@@ -1,4 +1,4 @@
-import { GlDropdown, GlFormTextarea, GlButton } from '@gitlab/ui';
+import { GlDropdown, GlFormTextarea, GlButton, GlAlert } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import ApplySuggestionComponent from '~/vue_shared/components/markdown/apply_suggestion.vue';
 
@@ -10,9 +10,10 @@ describe('Apply Suggestion component', () => {
     wrapper = shallowMount(ApplySuggestionComponent, { propsData: { ...propsData, ...props } });
   };
 
-  const findDropdown = () => wrapper.find(GlDropdown);
-  const findTextArea = () => wrapper.find(GlFormTextarea);
-  const findApplyButton = () => wrapper.find(GlButton);
+  const findDropdown = () => wrapper.findComponent(GlDropdown);
+  const findTextArea = () => wrapper.findComponent(GlFormTextarea);
+  const findApplyButton = () => wrapper.findComponent(GlButton);
+  const findAlert = () => wrapper.findComponent(GlAlert);
 
   beforeEach(() => createWrapper());
 
@@ -53,6 +54,20 @@ describe('Apply Suggestion component', () => {
     });
   });
 
+  describe('error', () => {
+    it('displays an error message', () => {
+      const errorMessage = 'Error message';
+      createWrapper({ errorMessage });
+
+      const alert = findAlert();
+
+      expect(alert.exists()).toBe(true);
+      expect(alert.props('variant')).toBe('danger');
+      expect(alert.props('dismissible')).toBe(false);
+      expect(alert.text()).toBe(errorMessage);
+    });
+  });
+
   describe('apply suggestion', () => {
     it('emits an apply event with no message if no message was added', () => {
       findTextArea().vm.$emit('input', null);
diff --git a/spec/frontend/vue_shared/components/markdown/field_spec.js b/spec/frontend/vue_shared/components/markdown/field_spec.js
index b5daa389fc6..d1c4d777d44 100644
--- a/spec/frontend/vue_shared/components/markdown/field_spec.js
+++ b/spec/frontend/vue_shared/components/markdown/field_spec.js
@@ -85,7 +85,7 @@ describe('Markdown field component', () => {
   describe('mounted', () => {
     const previewHTML = `
     <p>markdown preview</p>
-    <video src="${FIXTURES_PATH}/static/mock-video.mp4" muted="muted"></video>
+    <video src="${FIXTURES_PATH}/static/mock-video.mp4"></video>
   `;
     let previewLink;
     let writeLink;
@@ -101,6 +101,21 @@ describe('Markdown field component', () => {
       expect(subject.find('.zen-backdrop textarea').element).not.toBeNull();
     });
 
+    it('renders referenced commands on markdown preview', async () => {
+      axiosMock
+        .onPost(markdownPreviewPath)
+        .reply(200, { references: { users: [], commands: 'test command' } });
+
+      previewLink = getPreviewLink();
+      previewLink.vm.$emit('click', { target: {} });
+
+      await axios.waitFor(markdownPreviewPath);
+      const referencedCommands = subject.find('[data-testid="referenced-commands"]');
+
+      expect(referencedCommands.exists()).toBe(true);
+      expect(referencedCommands.text()).toContain('test command');
+    });
+
     describe('markdown preview', () => {
       beforeEach(() => {
         axiosMock.onPost(markdownPreviewPath).reply(200, { body: previewHTML });
diff --git a/spec/frontend/vue_shared/components/markdown/header_spec.js b/spec/frontend/vue_shared/components/markdown/header_spec.js
index 9ffb9c6a541..fa4ca63f910 100644
--- a/spec/frontend/vue_shared/components/markdown/header_spec.js
+++ b/spec/frontend/vue_shared/components/markdown/header_spec.js
@@ -95,7 +95,7 @@ describe('Markdown field header component', () => {
   it('hides toolbar in preview mode', () => {
     createWrapper({ previewMarkdown: true });
 
-    expect(findToolbar().classes().includes('gl-display-none')).toBe(true);
+    expect(findToolbar().classes().includes('gl-display-none!')).toBe(true);
   });
 
   it('emits toggle markdown event when clicking preview tab', async () => {