Add latest changes from gitlab-org/gitlab@master

4 files changed, 77 insertions, 104 deletions

diff --git a/spec/frontend/blob/notebook/notebook_viever_spec.js b/spec/frontend/blob/notebook/notebook_viever_spec.js
index 604104bb31f..93406db2675 100644
--- a/spec/frontend/blob/notebook/notebook_viever_spec.js
+++ b/spec/frontend/blob/notebook/notebook_viever_spec.js
@@ -11,6 +11,7 @@ describe('iPython notebook renderer', () => {
   let mock;
 
   const endpoint = 'test';
+  const relativeRawPath = '';
   const mockNotebook = {
     cells: [
       {
@@ -27,7 +28,7 @@ describe('iPython notebook renderer', () => {
   };
 
   const mountComponent = () => {
-    wrapper = shallowMount(component, { propsData: { endpoint } });
+    wrapper = shallowMount(component, { propsData: { endpoint, relativeRawPath } });
   };
 
   const findLoading = () => wrapper.find(GlLoadingIcon);
diff --git a/spec/frontend/notebook/cells/markdown_spec.js b/spec/frontend/notebook/cells/markdown_spec.js
index deeee5d6589..707efa21528 100644
--- a/spec/frontend/notebook/cells/markdown_spec.js
+++ b/spec/frontend/notebook/cells/markdown_spec.js
@@ -1,3 +1,4 @@
+import { mount } from '@vue/test-utils';
 import katex from 'katex';
 import Vue from 'vue';
 import MarkdownComponent from '~/notebook/cells/markdown.vue';
@@ -6,6 +7,28 @@ const Component = Vue.extend(MarkdownComponent);
 
 window.katex = katex;
 
+function buildCellComponent(cell, relativePath = '') {
+  return mount(Component, {
+    propsData: {
+      cell,
+    },
+    provide: {
+      relativeRawPath: relativePath,
+    },
+  }).vm;
+}
+
+function buildMarkdownComponent(markdownContent, relativePath = '') {
+  return buildCellComponent(
+    {
+      cell_type: 'markdown',
+      metadata: {},
+      source: markdownContent,
+    },
+    relativePath,
+  );
+}
+
 describe('Markdown component', () => {
   let vm;
   let cell;
@@ -17,12 +40,7 @@ describe('Markdown component', () => {
     // eslint-disable-next-line prefer-destructuring
     cell = json.cells[1];
 
-    vm = new Component({
-      propsData: {
-        cell,
-      },
-    });
-    vm.$mount();
+    vm = buildCellComponent(cell);
 
     return vm.$nextTick();
   });
@@ -61,17 +79,36 @@ describe('Markdown component', () => {
     expect(findLink().getAttribute('data-type')).toBe(null);
   });
 
+  describe('When parsing images', () => {
+    it.each([
+      [
+        'for relative images in root folder, it does',
+        '![](local_image.png)\n',
+        'src="/raw/local_image',
+      ],
+      [
+        'for relative images in child folders, it does',
+        '![](data/local_image.png)\n',
+        'src="/raw/data',
+      ],
+      ["for embedded images, it doesn't", '![](data:image/jpeg;base64)\n', 'src="data:'],
+      ["for images urls, it doesn't", '![](http://image.png)\n', 'src="http:'],
+    ])('%s', async ([testMd, mustContain]) => {
+      vm = buildMarkdownComponent([testMd], '/raw/');
+
+      await vm.$nextTick();
+
+      expect(vm.$el.innerHTML).toContain(mustContain);
+    });
+  });
+
   describe('tables', () => {
     beforeEach(() => {
       json = getJSONFixture('blob/notebook/markdown-table.json');
     });
 
     it('renders images and text', () => {
-      vm = new Component({
-        propsData: {
-          cell: json.cells[0],
-        },
-      }).$mount();
+      vm = buildCellComponent(json.cells[0]);
 
       return vm.$nextTick().then(() => {
         const images = vm.$el.querySelectorAll('img');
@@ -102,48 +139,28 @@ describe('Markdown component', () => {
     });
 
     it('renders multi-line katex', async () => {
-      vm = new Component({
-        propsData: {
-          cell: json.cells[0],
-        },
-      }).$mount();
+      vm = buildCellComponent(json.cells[0]);
 
       await vm.$nextTick();
       expect(vm.$el.querySelector('.katex')).not.toBeNull();
     });
 
     it('renders inline katex', async () => {
-      vm = new Component({
-        propsData: {
-          cell: json.cells[1],
-        },
-      }).$mount();
+      vm = buildCellComponent(json.cells[1]);
 
       await vm.$nextTick();
       expect(vm.$el.querySelector('p:first-child .katex')).not.toBeNull();
     });
 
     it('renders multiple inline katex', async () => {
-      vm = new Component({
-        propsData: {
-          cell: json.cells[1],
-        },
-      }).$mount();
+      vm = buildCellComponent(json.cells[1]);
 
       await vm.$nextTick();
       expect(vm.$el.querySelectorAll('p:nth-child(2) .katex')).toHaveLength(4);
     });
 
     it('output cell in case of katex error', async () => {
-      vm = new Component({
-        propsData: {
-          cell: {
-            cell_type: 'markdown',
-            metadata: {},
-            source: ['Some invalid $a & b$ inline formula $b & c$\n', '\n'],
-          },
-        },
-      }).$mount();
+      vm = buildMarkdownComponent(['Some invalid $a & b$ inline formula $b & c$\n', '\n']);
 
       await vm.$nextTick();
       // expect one paragraph with no katex formula in it
@@ -152,15 +169,10 @@ describe('Markdown component', () => {
     });
 
     it('output cell and render remaining formula in case of katex error', async () => {
-      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();
+      vm = buildMarkdownComponent([
+        'An invalid $a & b$ inline formula and a vaild one $b = c$\n',
+        '\n',
+      ]);
 
       await vm.$nextTick();
       // expect one paragraph with no katex formula in it
@@ -169,15 +181,7 @@ describe('Markdown component', () => {
     });
 
     it('renders math formula in list object', async () => {
-      vm = new Component({
-        propsData: {
-          cell: {
-            cell_type: 'markdown',
-            metadata: {},
-            source: ["- list with inline $a=2$ inline formula $a' + b = c$\n", '\n'],
-          },
-        },
-      }).$mount();
+      vm = buildMarkdownComponent(["- list with inline $a=2$ inline formula $a' + b = c$\n", '\n']);
 
       await vm.$nextTick();
       // expect one list with a katex formula in it
@@ -186,15 +190,7 @@ describe('Markdown component', () => {
     });
 
     it("renders math formula with tick ' in it", async () => {
-      vm = new Component({
-        propsData: {
-          cell: {
-            cell_type: 'markdown',
-            metadata: {},
-            source: ["- list with inline $a=2$ inline formula $a' + b = c$\n", '\n'],
-          },
-        },
-      }).$mount();
+      vm = buildMarkdownComponent(["- list with inline $a=2$ inline formula $a' + b = c$\n", '\n']);
 
       await vm.$nextTick();
       // expect one list with a katex formula in it
@@ -203,15 +199,7 @@ describe('Markdown component', () => {
     });
 
     it('renders math formula with less-than-operator < in it', async () => {
-      vm = new Component({
-        propsData: {
-          cell: {
-            cell_type: 'markdown',
-            metadata: {},
-            source: ['- list with inline $a=2$ inline formula $a + b < c$\n', '\n'],
-          },
-        },
-      }).$mount();
+      vm = buildMarkdownComponent(['- list with inline $a=2$ inline formula $a + b < c$\n', '\n']);
 
       await vm.$nextTick();
       // expect one list with a katex formula in it
@@ -220,15 +208,7 @@ describe('Markdown component', () => {
     });
 
     it('renders math formula with greater-than-operator > in it', async () => {
-      vm = new Component({
-        propsData: {
-          cell: {
-            cell_type: 'markdown',
-            metadata: {},
-            source: ['- list with inline $a=2$ inline formula $a + b > c$\n', '\n'],
-          },
-        },
-      }).$mount();
+      vm = buildMarkdownComponent(['- list with inline $a=2$ inline formula $a + b > c$\n', '\n']);
 
       await vm.$nextTick();
       // expect one list with a katex formula in it
diff --git a/spec/frontend/notebook/index_spec.js b/spec/frontend/notebook/index_spec.js
index 945af08e4d5..4d0dacaf37e 100644
--- a/spec/frontend/notebook/index_spec.js
+++ b/spec/frontend/notebook/index_spec.js
@@ -1,3 +1,4 @@
+import { mount } from '@vue/test-utils';
 import Vue from 'vue';
 import Notebook from '~/notebook/index.vue';
 
@@ -13,14 +14,16 @@ describe('Notebook component', () => {
     jsonWithWorksheet = getJSONFixture('blob/notebook/worksheets.json');
   });
 
+  function buildComponent(notebook) {
+    return mount(Component, {
+      propsData: { notebook, codeCssClass: 'js-code-class' },
+      provide: { relativeRawPath: '' },
+    }).vm;
+  }
+
   describe('without JSON', () => {
     beforeEach((done) => {
-      vm = new Component({
-        propsData: {
-          notebook: {},
-        },
-      });
-      vm.$mount();
+      vm = buildComponent({});
 
       setImmediate(() => {
         done();
@@ -34,13 +37,7 @@ describe('Notebook component', () => {
 
   describe('with JSON', () => {
     beforeEach((done) => {
-      vm = new Component({
-        propsData: {
-          notebook: json,
-          codeCssClass: 'js-code-class',
-        },
-      });
-      vm.$mount();
+      vm = buildComponent(json);
 
       setImmediate(() => {
         done();
@@ -66,13 +63,7 @@ describe('Notebook component', () => {
 
   describe('with worksheets', () => {
     beforeEach((done) => {
-      vm = new Component({
-        propsData: {
-          notebook: jsonWithWorksheet,
-          codeCssClass: 'js-code-class',
-        },
-      });
-      vm.$mount();
+      vm = buildComponent(jsonWithWorksheet);
 
       setImmediate(() => {
         done();
diff --git a/spec/frontend/repository/components/tree_content_spec.js b/spec/frontend/repository/components/tree_content_spec.js
index 1d1ec58100f..e36287eff29 100644
--- a/spec/frontend/repository/components/tree_content_spec.js
+++ b/spec/frontend/repository/components/tree_content_spec.js
@@ -1,5 +1,5 @@
 import { shallowMount } from '@vue/test-utils';
-import filesQuery from 'shared_queries/repository/files.query.graphql';
+import paginatedTreeQuery from 'shared_queries/repository/paginated_tree.query.graphql';
 import FilePreview from '~/repository/components/preview/index.vue';
 import FileTable from '~/repository/components/table/index.vue';
 import TreeContent from '~/repository/components/tree_content.vue';
@@ -22,6 +22,7 @@ function factory(path, data = () => ({})) {
     provide: {
       glFeatures: {
         increasePageSizeExponentially: true,
+        paginatedTreeGraphqlQuery: true,
       },
     },
   });
@@ -58,7 +59,7 @@ describe('Repository table component', () => {
     it('normalizes edge nodes', () => {
       factory('/');
 
-      const output = vm.vm.normalizeData('blobs', [{ node: '1' }, { node: '2' }]);
+      const output = vm.vm.normalizeData('blobs', { nodes: ['1', '2'] });
 
       expect(output).toEqual(['1', '2']);
     });
@@ -168,7 +169,7 @@ describe('Repository table component', () => {
       vm.vm.fetchFiles();
 
       expect($apollo.query).toHaveBeenCalledWith({
-        query: filesQuery,
+        query: paginatedTreeQuery,
         variables: {
           pageSize,
           nextPageCursor: '',