Skip to content

Commit

Permalink
Merge pull request #3481 from nextcloud/backport/3460
Browse files Browse the repository at this point in the history
[Stable25] Backport of #3460 -  Fix front matter rendering
  • Loading branch information
juliusknorr authored Nov 24, 2022
2 parents 64a168b + 7525500 commit fa45df9
Show file tree
Hide file tree
Showing 21 changed files with 64 additions and 31 deletions.
1 change: 1 addition & 0 deletions cypress/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ cy.getContent()
| `createFolder` | Create a folder | `dirName` |
| `shareFileToUser` | Share a file with user | `userId`, `password`, `path`, `targetUserId`|
| `openFile` | Open file in Viewer / Editor | `fileName`, `clickParams` |
| `closeFile` | Close the current file | |
| `getFile` | Get file list element of file | `fileName` |
| `deleteFile` | Remove a file | `fileName` |
| `reloadFileList` | Refresh the file list | |
Expand Down
22 changes: 21 additions & 1 deletion cypress/e2e/FrontMatter.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,10 @@ describe('Front matter support', function() {

it('Open file with front matter', function() {
cy.openFile('frontmatter.md').then(() => {
expect(cy.getContent().find('pre.frontmatter').length === 1)
cy.getContent().find('pre.frontmatter').should(pre => {
expect(pre.length === 1)
expect(pre[0].text === 'some: value\nother: 1.2')
})
})
})

Expand All @@ -59,4 +62,21 @@ describe('Front matter support', function() {
cy.getContent().find('hr').should(hr => expect(hr.length === 1))
})
})

it('Reopen front matter', function() {
cy.openFile('frontmatter.md').then(() => {
cy.getContent()
.type('{moveToEnd}New line{enter}')
.find('pre.frontmatter').should(pre => {
expect(pre.length === 1)
})
.closeFile().then(() => {
cy.openFile('frontmatter.md').then(() => {
cy.getContent().then(() => {
expect(cy.getContent().find('pre.frontmatter').length === 1)
})
})
})
})
})
})
4 changes: 4 additions & 0 deletions cypress/support/commands.js
Original file line number Diff line number Diff line change
Expand Up @@ -269,6 +269,10 @@ Cypress.Commands.add('openFile', (fileName, params = {}) => {
cy.get(`.files-fileList tr[data-file="${fileName}"] a.name`).click(params)
})

Cypress.Commands.add('closeFile', (fileName, params = {}) => {
cy.get('#viewer .modal-header button.header-close').click(params)
})

Cypress.Commands.add('getFile', fileName => {
return cy.get(`.files-fileList tr[data-file="${fileName}"]`)
})
Expand Down
4 changes: 2 additions & 2 deletions js/editor-rich.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion js/editor-rich.js.map

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions js/editor.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion js/editor.js.map

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions js/files-modal.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion js/files-modal.js.map

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 2 additions & 2 deletions js/text-files.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion js/text-files.js.map

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions js/text-public.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion js/text-public.js.map

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions js/text-text.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion js/text-text.js.map

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions js/text-viewer.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion js/text-viewer.js.map

Large diffs are not rendered by default.

9 changes: 2 additions & 7 deletions src/components/Editor.vue
Original file line number Diff line number Diff line change
Expand Up @@ -110,7 +110,6 @@ import { extensionHighlight } from '../helpers/mappings.js'
import { createEditor, serializePlainText, loadSyntaxHighlight } from './../EditorFactory.js'
import { createMarkdownSerializer } from './../extensions/Markdown.js'
import markdownit from './../markdownit/index.js'
import markdownitFrontMatter from 'markdown-it-front-matter'

import { Collaboration, Keymap, UserColor } from './../extensions/index.js'
import DocumentStatus from './Editor/DocumentStatus.vue'
Expand Down Expand Up @@ -496,15 +495,11 @@ export default {
},

onLoaded({ documentSource }) {
let frontMatter = ''
const rendered = !this.isRichEditor
const content = !this.isRichEditor
? `<pre>${escapeHtml(documentSource)}</pre>`
: markdownit.use(markdownitFrontMatter, (fm) => {
frontMatter = `<pre id="frontmatter"><code>${escapeHtml(fm)}</code></pre>`
}).render(documentSource)
: markdownit.render(documentSource)

this.hasConnectionIssue = false
const content = frontMatter + rendered
const language = extensionHighlight[this.fileExtension] || this.fileExtension;

(this.isRichEditor ? Promise.resolve() : loadSyntaxHighlight(language))
Expand Down
6 changes: 6 additions & 0 deletions src/markdownit/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,19 +5,25 @@ import underline from './underline.js'
import splitMixedLists from './splitMixedLists.js'
import callouts from './callouts.js'
import keepSyntax from './keepSyntax.js'
import frontMatter from 'markdown-it-front-matter'
import implicitFigures from 'markdown-it-image-figures'
import { escapeHtml } from 'markdown-it/lib/common/utils.js'

const markdownit = MarkdownIt('commonmark', { html: false, breaks: false })
.enable('strikethrough')
.enable('table')
.use(taskLists, { enable: true, labelAfter: true })
.use(frontMatter, (fm) => {})
.use(splitMixedLists)
.use(underline)
.use(callouts)
.use(keepSyntax)
.use(markdownitMentions)
.use(implicitFigures)

// Render front matter tokens
markdownit.renderer.rules.front_matter = (tokens, idx, options) => `<pre id="frontmatter"><code>${escapeHtml(tokens[idx].meta)}</code></pre>`

// Issue #3370: To preserve softbreaks within md files we preserve all whitespaces, so we must not introduce additional new lines after a <br> element
markdownit.renderer.rules.hardbreak = (tokens, idx, options) => (options.xhtmlOut ? '<br />' : '<br>')

Expand Down
2 changes: 1 addition & 1 deletion src/nodes/FrontMatter.js
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ const FrontMatter = TiptapCodeBlock.extend({
const text = node.textContent
// Make sure the front matter fences are longer than any dash sequence within it
const dashes = text.match(/-{3,}/gm)
const separator = '-'.repeat(dashes ? dashes.sort().slice(-1)[0].length + 1 : 3)
const separator = dashes ? (dashes.sort().slice(-1)[0] + '-') : '---'

state.write('')
state.out = ''
Expand Down
9 changes: 8 additions & 1 deletion src/tests/markdown.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,9 @@ describe('Commonmark', () => {

// failures because of some additional newline in markdownit
const skippedMarkdownTests = [
187, 209, 210
187, 209, 210,
// We interpret these as front matter
66, 68
];

const normalize = (str) => {
Expand Down Expand Up @@ -188,6 +190,11 @@ describe('Markdown though editor', () => {
})
})

test('front matter', () => {
expect(markdownThroughEditor('---\nhello: world\n---')).toBe('---\nhello: world\n---')
expect(markdownThroughEditor('---\n---')).toBe('---\n---')
})

test('mentions', () => {
expect(markdownThroughEditor('@[username](mention://user/id)')).toBe(' @[username](mention://user/id) ')
})
Expand Down

0 comments on commit fa45df9

Please sign in to comment.