sd/akkoma-fe-chuckya
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

MFM only use sanitised data-* attribute values

Browse source 
We take the value from a data-* attribute and then add this to the style attribute.
This will probably be OK in most cases, but just to be sure, we check for "weird" characters first.
For now we only allow letters, numbers, dot, hash, and plus and minus sign, because those are the ones I currently know of who are used in MFM.
The data-* attribute remains because it was already considered proper HTML as-is.
This commit is contained in:
ilja 2024-08-11 17:48:36 +02:00
commit 6666a273a4
2 changed files with 35 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

29
test/unit/specs/components/rich_content.spec.js
View file

@ -40,6 +40,35 @@ describe('RichContent', () => {
expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(html))
})
it('does not allow injection through MFM data- attributes', () => {
const html_ok = '<span class="mfm-spin" data-mfm-speed="-0.2s" data-mfm-color="#000" data-mfm-deg="+30">brrr</span>'
const expected_ok = '<span class="mfm-spin" data-mfm-speed="-0.2s" data-mfm-color="#000" data-mfm-deg="+30" style="--mfm-speed: -0.2s; --mfm-color: #000; --mfm-deg: +30;">brrr</span>'
const wrapper_ok = shallowMount(RichContent, {
global,
props: {
attentions,
handleLinks: true,
greentext: true,
emoji: [],
html: html_ok
}
})
const html_nok = '<span class="mfm-spin" data-mfm-speed="<" data-mfm-color="\\">brrr</span>'
const wrapper_nok = shallowMount(RichContent, {
global,
props: {
attentions,
handleLinks: true,
greentext: true,
emoji: [],
html: html_nok
}
})
expect(wrapper_ok.html()).to.eql(compwrap(expected_ok))
expect(wrapper_nok.html()).to.eql(compwrap(html_nok))
})
it('unescapes everything as needed', () => {
const html = [
p('Testing &#39;em all'),