feat: add doAfterRendering method to markdown renderer extension

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Tilman Vatteroth 2023-06-06 22:36:04 +02:00
parent 450d70961a
commit b04b5cc3e1
4 changed files with 21 additions and 2 deletions

View file

@ -32,4 +32,8 @@ export abstract class MarkdownRendererExtension {
public buildTagNameAllowList(): string[] { public buildTagNameAllowList(): string[] {
return [] return []
} }
public doAfterRendering(): void {
return
}
} }

View file

@ -55,14 +55,17 @@ describe('markdown to react', () => {
}) })
it('will use markdown render extensions', () => { it('will use markdown render extensions', () => {
const doAfterCallback = jest.fn()
const view = render( const view = render(
<MarkdownToReact <MarkdownToReact
markdownContentLines={['<span>test</span>']} markdownContentLines={['<span>test</span>']}
markdownRenderExtensions={[new TestMarkdownRendererExtension()]} markdownRenderExtensions={[new TestMarkdownRendererExtension(doAfterCallback)]}
newlinesAreBreaks={true} newlinesAreBreaks={true}
allowHtml={false} allowHtml={false}
/> />
) )
expect(view.container).toMatchSnapshot() expect(view.container).toMatchSnapshot()
expect(doAfterCallback).toBeCalled()
}) })
}) })

View file

@ -11,7 +11,7 @@ import { LineContentToLineIdMapper } from './utils/line-content-to-line-id-mappe
import { NodeToReactTransformer } from './utils/node-to-react-transformer' import { NodeToReactTransformer } from './utils/node-to-react-transformer'
import type { ParserOptions } from '@hedgedoc/html-to-react' import type { ParserOptions } from '@hedgedoc/html-to-react'
import type DOMPurify from 'dompurify' import type DOMPurify from 'dompurify'
import React, { useMemo } from 'react' import React, { useEffect, useMemo } from 'react'
export interface MarkdownToReactProps { export interface MarkdownToReactProps {
markdownContentLines: string[] markdownContentLines: string[]
@ -68,5 +68,9 @@ export const MarkdownToReact: React.FC<MarkdownToReactProps> = ({
[markdownRenderExtensions] [markdownRenderExtensions]
) )
useEffect(() => {
markdownRenderExtensions.forEach((extension) => extension.doAfterRendering())
}, [html, markdownRenderExtensions])
return <HtmlToReact htmlCode={html} parserOptions={parserOptions} domPurifyConfig={domPurifyConfig} /> return <HtmlToReact htmlCode={html} parserOptions={parserOptions} domPurifyConfig={domPurifyConfig} />
} }

View file

@ -12,6 +12,10 @@ import type MarkdownIt from 'markdown-it'
import Token from 'markdown-it/lib/token' import Token from 'markdown-it/lib/token'
export class TestMarkdownRendererExtension extends MarkdownRendererExtension { export class TestMarkdownRendererExtension extends MarkdownRendererExtension {
constructor(private doAfterCallback: () => void) {
super()
}
buildNodeProcessors(): NodeProcessor[] { buildNodeProcessors(): NodeProcessor[] {
return [new TestNodeProcessor()] return [new TestNodeProcessor()]
} }
@ -37,4 +41,8 @@ export class TestMarkdownRendererExtension extends MarkdownRendererExtension {
markdownIt.renderer.rules.post = () => '<span>post</span>' markdownIt.renderer.rules.post = () => '<span>post</span>'
}) })
} }
doAfterRendering() {
this.doAfterCallback()
}
} }