diff --git a/docs/src/demos/Extensions/CodeBlock/index.spec.js b/docs/src/demos/Extensions/CodeBlock/index.spec.js index 746605c00..7da58542b 100644 --- a/docs/src/demos/Extensions/CodeBlock/index.spec.js +++ b/docs/src/demos/Extensions/CodeBlock/index.spec.js @@ -58,17 +58,6 @@ context('/api/extensions/code-block', () => { .should('not.exist') }) - it('should make a code block from markdown shortcuts', () => { - cy.get('.ProseMirror').then(([{ editor }]) => { - editor.clearContent() - - cy.get('.ProseMirror') - .type('``` Code') - .find('pre>code') - .should('contain', 'Code') - }) - }) - it('should parse the language from a HTML code block', () => { cy.get('.ProseMirror').then(([{ editor }]) => { editor.setContent('
body { display: none; }
') @@ -79,7 +68,29 @@ context('/api/extensions/code-block', () => { }) }) - it('should make a code block for js', () => { + it('should make a code block from backtick markdown shortcuts', () => { + cy.get('.ProseMirror').then(([{ editor }]) => { + editor.clearContent() + + cy.get('.ProseMirror') + .type('``` Code') + .find('pre>code') + .should('contain', 'Code') + }) + }) + + it('should make a code block from tilde markdown shortcuts', () => { + cy.get('.ProseMirror').then(([{ editor }]) => { + editor.clearContent() + + cy.get('.ProseMirror') + .type('~~~ Code') + .find('pre>code') + .should('contain', 'Code') + }) + }) + + it('should make a code block for js with backticks', () => { cy.get('.ProseMirror').then(([{ editor }]) => { editor.clearContent() @@ -89,4 +100,15 @@ context('/api/extensions/code-block', () => { .should('contain', 'Code') }) }) + + it('should make a code block for js with tildes', () => { + cy.get('.ProseMirror').then(([{ editor }]) => { + editor.clearContent() + + cy.get('.ProseMirror') + .type('~~~js Code') + .find('pre>code.language-js') + .should('contain', 'Code') + }) + }) }) diff --git a/packages/extension-code-block/index.ts b/packages/extension-code-block/index.ts index 4119e7ec7..9b69b8fb5 100644 --- a/packages/extension-code-block/index.ts +++ b/packages/extension-code-block/index.ts @@ -13,7 +13,8 @@ declare module '@tiptap/core/src/Editor' { } } -export const inputRegex = /^```(?[a-z]*)? $/ +export const backtickInputRegex = /^```(?[a-z]*)? $/ +export const tildeInputRegex = /^~~~(?[a-z]*)? $/ export default new Node() .name('code_block') @@ -62,6 +63,7 @@ export default new Node() 'Shift-Control-\\': () => editor.codeBlock(), })) .inputRules(({ type }) => [ - textblockTypeInputRule(inputRegex, type, ({ groups }: any) => groups), + textblockTypeInputRule(backtickInputRegex, type, ({ groups }: any) => groups), + textblockTypeInputRule(tildeInputRegex, type, ({ groups }: any) => groups), ]) .create()