Add latest changes from gitlab-org/gitlab@master

7 files changed, 202 insertions, 75 deletions

diff --git a/spec/frontend/alert_management/components/alert_management_detail_spec.js b/spec/frontend/alert_management/components/alert_management_detail_spec.js
index 2a9d66af7df..21398915c1e 100644
--- a/spec/frontend/alert_management/components/alert_management_detail_spec.js
+++ b/spec/frontend/alert_management/components/alert_management_detail_spec.js
@@ -127,6 +127,13 @@ describe('AlertDetails', () => {
       });
     });
 
+    describe('View full alert details', () => {
+      it('should display a unstyled list of alert details', () => {
+        wrapper.find('[data-testid="fullDetailsTab"]').trigger('click');
+        expect(wrapper.find('.list-unstyled').exists()).toBe(true);
+      });
+    });
+
     describe('loading state', () => {
       beforeEach(() => {
         mountComponent({ loading: true });
diff --git a/spec/frontend/design_management/components/design_notes/__snapshots__/design_note_spec.js.snap b/spec/frontend/design_management/components/design_notes/__snapshots__/design_note_spec.js.snap
index 84e52e1099a..e071274cc81 100644
--- a/spec/frontend/design_management/components/design_notes/__snapshots__/design_note_spec.js.snap
+++ b/spec/frontend/design_management/components/design_notes/__snapshots__/design_note_spec.js.snap
@@ -50,17 +50,7 @@ exports[`Design note component should match the snapshot 1`] = `
       </span>
     </div>
      
-    <button
-      class="note-action-button js-note-edit btn btn-transparent qa-note-edit-button"
-      title="Edit comment"
-      type="button"
-    >
-      <gl-icon-stub
-        class="link-highlight"
-        name="pencil"
-        size="16"
-      />
-    </button>
+    <!---->
   </div>
    
   <div
diff --git a/spec/frontend/design_management/components/design_notes/design_note_spec.js b/spec/frontend/design_management/components/design_notes/design_note_spec.js
index 228ee9df00e..8b32d3022ee 100644
--- a/spec/frontend/design_management/components/design_notes/design_note_spec.js
+++ b/spec/frontend/design_management/components/design_notes/design_note_spec.js
@@ -12,6 +12,9 @@ const note = {
     id: 'author-id',
   },
   body: 'test',
+  userPermissions: {
+    adminNote: false,
+  },
 };
 HTMLElement.prototype.scrollIntoView = scrollIntoViewMock;
 
@@ -93,55 +96,75 @@ describe('Design note component', () => {
     expect(scrollIntoViewMock).toHaveBeenCalled();
   });
 
-  it('should open an edit form on edit button click', () => {
+  it('should not render edit icon when user does not have a permission', () => {
     createComponent({
       note,
     });
 
-    findEditButton().trigger('click');
-
-    return wrapper.vm.$nextTick().then(() => {
-      expect(findReplyForm().exists()).toBe(true);
-      expect(findNoteContent().exists()).toBe(false);
-    });
+    expect(findEditButton().exists()).toBe(false);
   });
 
-  describe('when edit form is rendered', () => {
-    beforeEach(() => {
-      createComponent(
-        {
-          note,
+  describe('when user has a permission to edit note', () => {
+    it('should open an edit form on edit button click', () => {
+      createComponent({
+        note: {
+          ...note,
+          userPermissions: {
+            adminNote: true,
+          },
         },
-        { isEditing: true },
-      );
-    });
-
-    it('should not render note content and should render reply form', () => {
-      expect(findNoteContent().exists()).toBe(false);
-      expect(findReplyForm().exists()).toBe(true);
-    });
+      });
 
-    it('hides the form on hideForm event', () => {
-      findReplyForm().vm.$emit('cancelForm');
+      findEditButton().trigger('click');
 
       return wrapper.vm.$nextTick().then(() => {
-        expect(findReplyForm().exists()).toBe(false);
-        expect(findNoteContent().exists()).toBe(true);
+        expect(findReplyForm().exists()).toBe(true);
+        expect(findNoteContent().exists()).toBe(false);
       });
     });
 
-    it('calls a mutation on submitForm event and hides a form', () => {
-      findReplyForm().vm.$emit('submitForm');
-      expect(mutate).toHaveBeenCalled();
+    describe('when edit form is rendered', () => {
+      beforeEach(() => {
+        createComponent(
+          {
+            note: {
+              ...note,
+              userPermissions: {
+                adminNote: true,
+              },
+            },
+          },
+          { isEditing: true },
+        );
+      });
+
+      it('should not render note content and should render reply form', () => {
+        expect(findNoteContent().exists()).toBe(false);
+        expect(findReplyForm().exists()).toBe(true);
+      });
+
+      it('hides the form on hideForm event', () => {
+        findReplyForm().vm.$emit('cancelForm');
 
-      return mutate()
-        .then(() => {
-          return wrapper.vm.$nextTick();
-        })
-        .then(() => {
+        return wrapper.vm.$nextTick().then(() => {
           expect(findReplyForm().exists()).toBe(false);
           expect(findNoteContent().exists()).toBe(true);
         });
+      });
+
+      it('calls a mutation on submitForm event and hides a form', () => {
+        findReplyForm().vm.$emit('submitForm');
+        expect(mutate).toHaveBeenCalled();
+
+        return mutate()
+          .then(() => {
+            return wrapper.vm.$nextTick();
+          })
+          .then(() => {
+            expect(findReplyForm().exists()).toBe(false);
+            expect(findNoteContent().exists()).toBe(true);
+          });
+      });
     });
   });
 });
diff --git a/spec/frontend/notebook/cells/code_spec.js b/spec/frontend/notebook/cells/code_spec.js
index 3c9aea4a61a..33dabe2b6dc 100644
--- a/spec/frontend/notebook/cells/code_spec.js
+++ b/spec/frontend/notebook/cells/code_spec.js
@@ -53,16 +53,32 @@ describe('Code component', () => {
     });
   });
 
+  describe('with string for output', () => {
+    // NBFormat Version 4.1 allows outputs.text to be a string
+    beforeEach(() => {
+      const cell = json.cells[2];
+      cell.outputs[0].text = cell.outputs[0].text.join('');
+
+      vm = setupComponent(cell);
+      return vm.$nextTick();
+    });
+
+    it('does not render output prompt', () => {
+      expect(vm.$el.querySelectorAll('.prompt').length).toBe(2);
+    });
+
+    it('renders output cell', () => {
+      expect(vm.$el.querySelector('.output')).toBeDefined();
+    });
+  });
+
   describe('with string for cell.source', () => {
-    beforeEach(done => {
+    beforeEach(() => {
       const cell = json.cells[0];
       cell.source = cell.source.join('');
 
       vm = setupComponent(cell);
-
-      setImmediate(() => {
-        done();
-      });
+      return vm.$nextTick();
     });
 
     it('renders the same input as when cell.source is an array', () => {
diff --git a/spec/frontend/notebook/cells/markdown_spec.js b/spec/frontend/notebook/cells/markdown_spec.js
index 359ac90a3ef..ad33858da22 100644
--- a/spec/frontend/notebook/cells/markdown_spec.js
+++ b/spec/frontend/notebook/cells/markdown_spec.js
@@ -11,7 +11,7 @@ describe('Markdown component', () => {
   let cell;
   let json;
 
-  beforeEach(done => {
+  beforeEach(() => {
     json = getJSONFixture('blob/notebook/basic.json');
 
     // eslint-disable-next-line prefer-destructuring
@@ -24,9 +24,7 @@ describe('Markdown component', () => {
     });
     vm.$mount();
 
-    setImmediate(() => {
-      done();
-    });
+    return vm.$nextTick();
   });
 
   it('does not render promot', () => {
@@ -41,17 +39,15 @@ describe('Markdown component', () => {
     expect(vm.$el.querySelector('.markdown h1')).not.toBeNull();
   });
 
-  it('sanitizes output', done => {
+  it('sanitizes output', () => {
     Object.assign(cell, {
       source: [
         '[XSS](data:text/html;base64,PHNjcmlwdD5hbGVydChkb2N1bWVudC5kb21haW4pPC9zY3JpcHQ+Cg==)\n',
       ],
     });
 
-    Vue.nextTick(() => {
+    return vm.$nextTick().then(() => {
       expect(vm.$el.querySelector('a').getAttribute('href')).toBeNull();
-
-      done();
     });
   });
 
@@ -60,45 +56,111 @@ describe('Markdown component', () => {
       json = getJSONFixture('blob/notebook/math.json');
     });
 
-    it('renders multi-line katex', done => {
+    it('renders multi-line katex', () => {
       vm = new Component({
         propsData: {
           cell: json.cells[0],
         },
       }).$mount();
 
-      Vue.nextTick(() => {
+      return vm.$nextTick().then(() => {
         expect(vm.$el.querySelector('.katex')).not.toBeNull();
-
-        done();
       });
     });
 
-    it('renders inline katex', done => {
+    it('renders inline katex', () => {
       vm = new Component({
         propsData: {
           cell: json.cells[1],
         },
       }).$mount();
 
-      Vue.nextTick(() => {
+      return vm.$nextTick().then(() => {
         expect(vm.$el.querySelector('p:first-child .katex')).not.toBeNull();
-
-        done();
       });
     });
 
-    it('renders multiple inline katex', done => {
+    it('renders multiple inline katex', () => {
       vm = new Component({
         propsData: {
           cell: json.cells[1],
         },
       }).$mount();
 
-      Vue.nextTick(() => {
+      return vm.$nextTick().then(() => {
         expect(vm.$el.querySelectorAll('p:nth-child(2) .katex').length).toBe(4);
+      });
+    });
+
+    it('output cell in case of katex error', () => {
+      vm = new Component({
+        propsData: {
+          cell: {
+            cell_type: 'markdown',
+            metadata: {},
+            source: ['Some invalid $a & b$ inline formula $b & c$\n', '\n'],
+          },
+        },
+      }).$mount();
+
+      return vm.$nextTick().then(() => {
+        // expect one paragraph with no katex formula in it
+        expect(vm.$el.querySelectorAll('p').length).toBe(1);
+        expect(vm.$el.querySelectorAll('p .katex').length).toBe(0);
+      });
+    });
+
+    it('output cell and render remaining formula in case of katex error', () => {
+      vm = new Component({
+        propsData: {
+          cell: {
+            cell_type: 'markdown',
+            metadata: {},
+            source: ['An invalid $a & b$ inline formula and a vaild one $b = c$\n', '\n'],
+          },
+        },
+      }).$mount();
+
+      return vm.$nextTick().then(() => {
+        // expect one paragraph with no katex formula in it
+        expect(vm.$el.querySelectorAll('p').length).toBe(1);
+        expect(vm.$el.querySelectorAll('p .katex').length).toBe(1);
+      });
+    });
+
+    it('renders math formula in list object', () => {
+      vm = new Component({
+        propsData: {
+          cell: {
+            cell_type: 'markdown',
+            metadata: {},
+            source: ["- list with inline $a=2$ inline formula $a' + b = c$\n", '\n'],
+          },
+        },
+      }).$mount();
+
+      return vm.$nextTick().then(() => {
+        // expect one list with a katex formula in it
+        expect(vm.$el.querySelectorAll('li').length).toBe(1);
+        expect(vm.$el.querySelectorAll('li .katex').length).toBe(2);
+      });
+    });
+
+    it("renders math formula with tick ' in it", () => {
+      vm = new Component({
+        propsData: {
+          cell: {
+            cell_type: 'markdown',
+            metadata: {},
+            source: ["- list with inline $a=2$ inline formula $a' + b = c$\n", '\n'],
+          },
+        },
+      }).$mount();
 
-        done();
+      return vm.$nextTick().then(() => {
+        // expect one list with a katex formula in it
+        expect(vm.$el.querySelectorAll('li').length).toBe(1);
+        expect(vm.$el.querySelectorAll('li .katex').length).toBe(2);
       });
     });
   });
diff --git a/spec/frontend/vue_shared/components/__snapshots__/code_block_spec.js.snap b/spec/frontend/vue_shared/components/__snapshots__/code_block_spec.js.snap
index 5347d1efc48..db174346729 100644
--- a/spec/frontend/vue_shared/components/__snapshots__/code_block_spec.js.snap
+++ b/spec/frontend/vue_shared/components/__snapshots__/code_block_spec.js.snap
@@ -1,16 +1,26 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Code Block matches snapshot 1`] = `
+exports[`Code Block with default props renders correctly 1`] = `
 <pre
   class="code-block rounded"
 >
-    
   <code
     class="d-block"
   >
     test-code
   </code>
-  
+</pre>
+`;
 
+exports[`Code Block with maxHeight set to "200px" renders correctly 1`] = `
+<pre
+  class="code-block rounded"
+  style="max-height: 200px; overflow-y: auto;"
+>
+  <code
+    class="d-block"
+  >
+    test-code
+  </code>
 </pre>
 `;
diff --git a/spec/frontend/vue_shared/components/code_block_spec.js b/spec/frontend/vue_shared/components/code_block_spec.js
index 0d21dd94f7c..60b0b0b566b 100644
--- a/spec/frontend/vue_shared/components/code_block_spec.js
+++ b/spec/frontend/vue_shared/components/code_block_spec.js
@@ -4,10 +4,15 @@ import CodeBlock from '~/vue_shared/components/code_block.vue';
 describe('Code Block', () => {
   let wrapper;
 
-  const createComponent = () => {
+  const defaultProps = {
+    code: 'test-code',
+  };
+
+  const createComponent = (props = {}) => {
     wrapper = shallowMount(CodeBlock, {
       propsData: {
-        code: 'test-code',
+        ...defaultProps,
+        ...props,
       },
     });
   };
@@ -17,9 +22,23 @@ describe('Code Block', () => {
     wrapper = null;
   });
 
-  it('matches snapshot', () => {
-    createComponent();
+  describe('with default props', () => {
+    beforeEach(() => {
+      createComponent();
+    });
 
-    expect(wrapper.element).toMatchSnapshot();
+    it('renders correctly', () => {
+      expect(wrapper.element).toMatchSnapshot();
+    });
+  });
+
+  describe('with maxHeight set to "200px"', () => {
+    beforeEach(() => {
+      createComponent({ maxHeight: '200px' });
+    });
+
+    it('renders correctly', () => {
+      expect(wrapper.element).toMatchSnapshot();
+    });
   });
 });