Add latest changes from gitlab-org/gitlab@master

4 files changed, 78 insertions, 45 deletions

diff --git a/spec/frontend/vue_shared/components/rich_content_editor/services/renderers/build_uneditable_token_spec.js b/spec/frontend/vue_shared/components/rich_content_editor/services/renderers/build_uneditable_token_spec.js
index 2253db7cbd0..0007aed5c4d 100644
--- a/spec/frontend/vue_shared/components/rich_content_editor/services/renderers/build_uneditable_token_spec.js
+++ b/spec/frontend/vue_shared/components/rich_content_editor/services/renderers/build_uneditable_token_spec.js
@@ -2,8 +2,9 @@ import {
   buildUneditableOpenTokens,
   buildUneditableCloseToken,
   buildUneditableCloseTokens,
-  buildUneditableInlineTokens,
   buildUneditableTokens,
+  buildUneditableInlineTokens,
+  buildUneditableHtmlAsTextTokens,
 } from '~/vue_shared/components/rich_content_editor/services/renderers/build_uneditable_token';
 
 import {
@@ -12,6 +13,7 @@ import {
   uneditableOpenTokens,
   uneditableCloseToken,
   uneditableCloseTokens,
+  uneditableBlockTokens,
   uneditableInlineTokens,
   uneditableTokens,
 } from './mock_data';
@@ -41,6 +43,15 @@ describe('Build Uneditable Token renderer helper', () => {
     });
   });
 
+  describe('buildUneditableTokens', () => {
+    it('returns a 3-item array of tokens with the originToken wrapped in the middle of block tokens', () => {
+      const result = buildUneditableTokens(originToken);
+
+      expect(result).toHaveLength(3);
+      expect(result).toStrictEqual(uneditableTokens);
+    });
+  });
+
   describe('buildUneditableInlineTokens', () => {
     it('returns a 3-item array of tokens with the originInlineToken wrapped in the middle of inline tokens', () => {
       const result = buildUneditableInlineTokens(originInlineToken);
@@ -50,12 +61,20 @@ describe('Build Uneditable Token renderer helper', () => {
     });
   });
 
-  describe('buildUneditableTokens', () => {
-    it('returns a 3-item array of tokens with the originToken wrapped in the middle of block tokens', () => {
-      const result = buildUneditableTokens(originToken);
+  describe('buildUneditableHtmlAsTextTokens', () => {
+    it('returns a 3-item array of tokens with the htmlBlockNode wrapped as a text token in the middle of block tokens', () => {
+      const htmlBlockNode = {
+        type: 'htmlBlock',
+        literal: '<div data-tomark-pass ><h1>Some header</h1><p>Some paragraph</p></div>',
+      };
+      const result = buildUneditableHtmlAsTextTokens(htmlBlockNode);
+      const { type, content } = result[1];
+
+      expect(type).toBe('text');
+      expect(content).not.toMatch(/ data-tomark-pass /);
 
       expect(result).toHaveLength(3);
-      expect(result).toStrictEqual(uneditableTokens);
+      expect(result).toStrictEqual(uneditableBlockTokens);
     });
   });
 });
diff --git a/spec/frontend/vue_shared/components/rich_content_editor/services/renderers/mock_data.js b/spec/frontend/vue_shared/components/rich_content_editor/services/renderers/mock_data.js
index 0c010a20d98..433f41774b4 100644
--- a/spec/frontend/vue_shared/components/rich_content_editor/services/renderers/mock_data.js
+++ b/spec/frontend/vue_shared/components/rich_content_editor/services/renderers/mock_data.js
@@ -12,7 +12,7 @@ export const normalTextNode = buildMockTextNode('This is just normal text.');
 
 // Token spec helpers
 
-const buildUneditableOpenToken = type => {
+const buildMockUneditableOpenToken = type => {
   return {
     type: 'openTag',
     tagName: type,
@@ -23,7 +23,7 @@ const buildUneditableOpenToken = type => {
   };
 };
 
-const buildUneditableCloseToken = type => {
+const buildMockUneditableCloseToken = type => {
   return { type: 'closeTag', tagName: type };
 };
 
@@ -31,8 +31,8 @@ export const originToken = {
   type: 'text',
   content: '{:.no_toc .hidden-md .hidden-lg}',
 };
-export const uneditableCloseToken = buildUneditableCloseToken('div');
-export const uneditableOpenTokens = [buildUneditableOpenToken('div'), originToken];
+export const uneditableCloseToken = buildMockUneditableCloseToken('div');
+export const uneditableOpenTokens = [buildMockUneditableOpenToken('div'), originToken];
 export const uneditableCloseTokens = [originToken, uneditableCloseToken];
 export const uneditableTokens = [...uneditableOpenTokens, uneditableCloseToken];
 
@@ -41,7 +41,17 @@ export const originInlineToken = {
   content: '<i>Inline</i> content',
 };
 export const uneditableInlineTokens = [
-  buildUneditableOpenToken('span'),
+  buildMockUneditableOpenToken('a'),
   originInlineToken,
-  buildUneditableCloseToken('span'),
+  buildMockUneditableCloseToken('a'),
+];
+
+export const uneditableBlockTokens = [
+  buildMockUneditableOpenToken('div'),
+  {
+    type: 'text',
+    tagName: null,
+    content: '<div><h1>Some header</h1><p>Some paragraph</p></div>',
+  },
+  buildMockUneditableCloseToken('div'),
 ];
diff --git a/spec/frontend/vue_shared/components/rich_content_editor/services/renderers/render_html_block_spec.js b/spec/frontend/vue_shared/components/rich_content_editor/services/renderers/render_html_block_spec.js
new file mode 100644
index 00000000000..a6c712eeb31
--- /dev/null
+++ b/spec/frontend/vue_shared/components/rich_content_editor/services/renderers/render_html_block_spec.js
@@ -0,0 +1,38 @@
+import renderer from '~/vue_shared/components/rich_content_editor/services/renderers/render_html_block';
+import { buildUneditableHtmlAsTextTokens } from '~/vue_shared/components/rich_content_editor/services/renderers/build_uneditable_token';
+
+import { normalTextNode } from './mock_data';
+
+const htmlBlockNode = {
+  firstChild: null,
+  literal: '<div><h1>Heading</h1><p>Paragraph.</p></div>',
+  type: 'htmlBlock',
+};
+
+describe('Render HTML renderer', () => {
+  describe('canRender', () => {
+    it('should return true when the argument is an html block', () => {
+      expect(renderer.canRender(htmlBlockNode)).toBe(true);
+    });
+
+    it('should return false when the argument is not an html block', () => {
+      expect(renderer.canRender(normalTextNode)).toBe(false);
+    });
+  });
+
+  describe('render', () => {
+    const htmlBlockNodeToMark = {
+      firstChild: null,
+      literal: '<div data-to-mark ></div>',
+      type: 'htmlBlock',
+    };
+
+    it.each`
+      node
+      ${htmlBlockNode}
+      ${htmlBlockNodeToMark}
+    `('should return uneditable tokens wrapping the $node as a token', ({ node }) => {
+      expect(renderer.render(node)).toStrictEqual(buildUneditableHtmlAsTextTokens(node));
+    });
+  });
+});
diff --git a/spec/frontend/vue_shared/components/rich_content_editor/services/renderers/render_html_spec.js b/spec/frontend/vue_shared/components/rich_content_editor/services/renderers/render_html_spec.js
deleted file mode 100644
index c863b86ebf6..00000000000
--- a/spec/frontend/vue_shared/components/rich_content_editor/services/renderers/render_html_spec.js
+++ /dev/null
@@ -1,34 +0,0 @@
-import renderer from '~/vue_shared/components/rich_content_editor/services/renderers/render_html';
-import { buildUneditableTokens } from '~/vue_shared/components/rich_content_editor/services/renderers/build_uneditable_token';
-
-import { normalTextNode } from './mock_data';
-
-const htmlLiteral = '<div><h1>Heading</h1><p>Paragraph.</p></div>';
-const htmlBlockNode = {
-  firstChild: null,
-  literal: htmlLiteral,
-  type: 'htmlBlock',
-};
-
-describe('Render HTML renderer', () => {
-  describe('canRender', () => {
-    it('should return true when the argument is an html block', () => {
-      expect(renderer.canRender(htmlBlockNode)).toBe(true);
-    });
-
-    it('should return false when the argument is not an html block', () => {
-      expect(renderer.canRender(normalTextNode)).toBe(false);
-    });
-  });
-
-  describe('render', () => {
-    it('should return uneditable tokens wrapping the origin token', () => {
-      const origin = jest.fn();
-      const context = { origin };
-
-      expect(renderer.render(htmlBlockNode, context)).toStrictEqual(
-        buildUneditableTokens(origin()),
-      );
-    });
-  });
-});