diff options
Diffstat (limited to 'spec/frontend/content_editor/components/bubble_menus/code_block_spec.js')
-rw-r--r-- | spec/frontend/content_editor/components/bubble_menus/code_block_spec.js | 25 |
1 files changed, 16 insertions, 9 deletions
diff --git a/spec/frontend/content_editor/components/bubble_menus/code_block_spec.js b/spec/frontend/content_editor/components/bubble_menus/code_block_spec.js index 646d068e795..154035a46ed 100644 --- a/spec/frontend/content_editor/components/bubble_menus/code_block_spec.js +++ b/spec/frontend/content_editor/components/bubble_menus/code_block_spec.js @@ -44,6 +44,12 @@ describe('content_editor/components/bubble_menus/code_block', () => { }); }; + const preTag = ({ language, content = 'test' } = {}) => { + const languageAttr = language ? ` lang="${language}"` : ''; + + return `<pre class="js-syntax-highlight"${languageAttr}>${content}</pre>`; + }; + const findDropdownItems = () => wrapper.findAllComponents(GlDropdownItem); const findDropdownItemsData = () => findDropdownItems().wrappers.map((x) => ({ @@ -62,7 +68,7 @@ describe('content_editor/components/bubble_menus/code_block', () => { }); it('renders bubble menu component', async () => { - tiptapEditor.commands.insertContent('<pre>test</pre>'); + tiptapEditor.commands.insertContent(preTag()); bubbleMenu = wrapper.findComponent(BubbleMenu); await emitEditorEvent({ event: 'transaction', tiptapEditor }); @@ -72,7 +78,7 @@ describe('content_editor/components/bubble_menus/code_block', () => { }); it('selects plaintext language by default', async () => { - tiptapEditor.commands.insertContent('<pre>test</pre>'); + tiptapEditor.commands.insertContent(preTag()); bubbleMenu = wrapper.findComponent(BubbleMenu); await emitEditorEvent({ event: 'transaction', tiptapEditor }); @@ -81,7 +87,7 @@ describe('content_editor/components/bubble_menus/code_block', () => { }); it('selects appropriate language based on the code block', async () => { - tiptapEditor.commands.insertContent('<pre lang="javascript">var a = 2;</pre>'); + tiptapEditor.commands.insertContent(preTag({ language: 'javascript' })); bubbleMenu = wrapper.findComponent(BubbleMenu); await emitEditorEvent({ event: 'transaction', tiptapEditor }); @@ -90,7 +96,7 @@ describe('content_editor/components/bubble_menus/code_block', () => { }); it('selects diagram sytnax for mermaid', async () => { - tiptapEditor.commands.insertContent('<pre lang="mermaid">test</pre>'); + tiptapEditor.commands.insertContent(preTag({ language: 'mermaid' })); bubbleMenu = wrapper.findComponent(BubbleMenu); await emitEditorEvent({ event: 'transaction', tiptapEditor }); @@ -99,7 +105,7 @@ describe('content_editor/components/bubble_menus/code_block', () => { }); it("selects Custom (syntax) if the language doesn't exist in the list", async () => { - tiptapEditor.commands.insertContent('<pre lang="nomnoml">test</pre>'); + tiptapEditor.commands.insertContent(preTag({ language: 'nomnoml' })); bubbleMenu = wrapper.findComponent(BubbleMenu); await emitEditorEvent({ event: 'transaction', tiptapEditor }); @@ -109,19 +115,20 @@ describe('content_editor/components/bubble_menus/code_block', () => { describe('copy button', () => { it('copies the text of the code block', async () => { + const content = 'var a = Math.PI / 2;'; jest.spyOn(navigator.clipboard, 'writeText'); - tiptapEditor.commands.insertContent('<pre lang="javascript">var a = Math.PI / 2;</pre>'); + tiptapEditor.commands.insertContent(preTag({ language: 'javascript', content })); await wrapper.findByTestId('copy-code-block').vm.$emit('click'); - expect(navigator.clipboard.writeText).toHaveBeenCalledWith('var a = Math.PI / 2;'); + expect(navigator.clipboard.writeText).toHaveBeenCalledWith(content); }); }); describe('delete button', () => { it('deletes the code block', async () => { - tiptapEditor.commands.insertContent('<pre lang="javascript">var a = 2;</pre>'); + tiptapEditor.commands.insertContent(preTag({ language: 'javascript' })); await wrapper.findByTestId('delete-code-block').vm.$emit('click'); @@ -164,7 +171,7 @@ describe('content_editor/components/bubble_menus/code_block', () => { describe('when opened and search is changed', () => { beforeEach(async () => { - tiptapEditor.commands.insertContent('<pre lang="javascript">var a = 2;</pre>'); + tiptapEditor.commands.insertContent(preTag({ language: 'javascript' })); wrapper.findComponent(GlSearchBoxByType).vm.$emit('input', 'js'); |