fix(Markdown): render markdown in more secure way

This commit changes markdown sanitization behaviour in following way:

class, style and data-* attributes are removed by default. These attributes
open possible vulnerability vectors to attackers.

The original behavior of sanitizer (before this commit) can be enabled by *useUnsafeMarkdown* configuration option.
Use this configuration option with caution and only in cases when you know
what you're doing.
This commit is contained in:
Vladimir Gorej
2020-06-11 14:54:40 +02:00
parent 48a0b46942
commit a616cb471d
22 changed files with 83 additions and 33 deletions

View File

@@ -7,10 +7,18 @@ import { Markdown as OAS3Markdown } from "corePlugins/oas3/wrap-components/markd
describe("Markdown component", function() {
describe("Swagger 2.0", function() {
it("allows span elements with class attrib", function() {
const str = `<span class="method">ONE</span>`
const el = render(<Markdown source={str} />)
expect(el.html()).toEqual(`<div class="markdown"><p><span class="method">ONE</span></p>\n</div>`)
it("allows elements with class, style and data-* attribs", function() {
const getConfigs = () => ({ useUnsafeMarkdown: true })
const str = `<span class="method" style="border-width: 1px" data-attr="value">ONE</span>`
const el = render(<Markdown source={str} getConfigs={getConfigs} />)
expect(el.html()).toEqual(`<div class="markdown"><p><span data-attr="value" style="border-width: 1px" class="method">ONE</span></p>\n</div>`)
})
it("strips class, style and data-* attribs from elements", function() {
const getConfigs = () => ({ useUnsafeMarkdown: false })
const str = `<span class="method" style="border-width: 1px" data-attr="value">ONE</span>`
const el = render(<Markdown source={str} getConfigs={getConfigs} />)
expect(el.html()).toEqual(`<div class="markdown"><p><span>ONE</span></p>\n</div>`)
})
it("allows td elements with colspan attrib", function() {
@@ -57,6 +65,20 @@ describe("Markdown component", function() {
})
describe("OAS 3", function() {
it("allows elements with class, style and data-* attribs", function() {
const getConfigs = () => ({ useUnsafeMarkdown: true })
const str = `<span class="method" style="border-width: 1px" data-attr="value">ONE</span>`
const el = render(<OAS3Markdown source={str} getConfigs={getConfigs} />)
expect(el.html()).toEqual(`<div class="renderedMarkdown"><p><span data-attr="value" style="border-width: 1px" class="method">ONE</span></p></div>`)
})
it("strips class, style and data-* attribs from elements", function() {
const getConfigs = () => ({ useUnsafeMarkdown: false })
const str = `<span class="method" style="border-width: 1px" data-attr="value">ONE</span>`
const el = render(<OAS3Markdown source={str} getConfigs={getConfigs} />)
expect(el.html()).toEqual(`<div class="renderedMarkdown"><p><span>ONE</span></p></div>`)
})
it("allows image elements", function() {
const str = `![Image alt text](http://image.source "Image title")`
const el = render(<OAS3Markdown source={str} />)