1 files changed, 54 insertions, 14 deletions

diff --git a/spec/frontend_integration/content_editor/content_editor_integration_spec.js b/spec/frontend_integration/content_editor/content_editor_integration_spec.js
index 89b8d8d6d94..12cd6dcad83 100644
--- a/spec/frontend_integration/content_editor/content_editor_integration_spec.js
+++ b/spec/frontend_integration/content_editor/content_editor_integration_spec.js
@@ -61,29 +61,69 @@ describe('content_editor', () => {
     });
   });
 
-  it('renders footnote ids alongside the footnote definition', async () => {
+  describe('when preserveUnchangedMarkdown feature flag is enabled', () => {
+    beforeEach(() => {
+      gon.features = { preserveUnchangedMarkdown: true };
+    });
+    afterEach(() => {
+      gon.features = { preserveUnchangedMarkdown: false };
+    });
+
+    it('processes and renders footnote ids alongside the footnote definition', async () => {
+      buildWrapper();
+
+      await contentEditorService.setSerializedContent(`
+This reference tag is a mix of letters and numbers [^footnote].
+
+[^footnote]: This is another footnote.
+    `);
+      await nextTick();
+
+      expect(wrapper.text()).toContain('footnote: This is another footnote');
+    });
+
+    it('processes and displays reference definitions', async () => {
+      buildWrapper();
+
+      await contentEditorService.setSerializedContent(`
+[GitLab][gitlab]
+
+[gitlab]: https://gitlab.com
+      `);
+      await nextTick();
+
+      expect(wrapper.find('pre').text()).toContain('[gitlab]: https://gitlab.com');
+    });
+  });
+
+  it('renders table of contents', async () => {
+    jest.useFakeTimers();
+
     buildWrapper();
 
     renderMarkdown.mockResolvedValue(`
-    <p data-sourcepos="3:1-3:56" dir="auto">
-      This reference tag is a mix of letters and numbers. <sup class="footnote-ref"><a href="#fn-footnote-2717" id="fnref-footnote-2717" data-footnote-ref="">2</a></sup>
-    </p>
-    <section class="footnotes" data-footnotes>
-      <ol>
-        <li id="fn-footnote-2717">
-        <p data-sourcepos="6:7-6:31">This is another footnote. <a href="#fnref-footnote-2717" aria-label="Back to content" class="footnote-backref" data-footnote-backref=""><gl-emoji title="leftwards arrow with hook" data-name="leftwards_arrow_with_hook" data-unicode-version="1.1">↩</gl-emoji></a></p>
-        </li>
-      </ol>
-    </section>
+<ul class="section-nav">
+</ul>
+<h1 dir="auto" data-sourcepos="3:1-3:11">
+  Heading 1
+</h1>
+<h2 dir="auto" data-sourcepos="5:1-5:12">
+  Heading 2
+</h2>
     `);
 
     await contentEditorService.setSerializedContent(`
-    This reference tag is a mix of letters and numbers [^footnote].
+[TOC]
 
-    [^footnote]: This is another footnote.
+# Heading 1
+
+## Heading 2
     `);
+
     await nextTick();
+    jest.runAllTimers();
 
-    expect(wrapper.text()).toContain('footnote: This is another footnote');
+    expect(wrapper.findByTestId('table-of-contents').text()).toContain('Heading 1');
+    expect(wrapper.findByTestId('table-of-contents').text()).toContain('Heading 2');
   });
 });