Remove line-breaks from message image markup

We use `white-space: pre-wrap` to render the messages, so line-breaks in
the markup add unnecessary space.
This commit is contained in:
JC Brand 2021-06-01 14:56:43 +02:00
parent 994e528b45
commit 1598640c80
2 changed files with 9 additions and 11 deletions

View File

@ -11,13 +11,13 @@ describe("XSS", function () {
await mock.openAndEnterChatRoom(_converse, 'lounge@montague.lit', 'romeo'); await mock.openAndEnterChatRoom(_converse, 'lounge@montague.lit', 'romeo');
/* <presence xmlns="jabber:client" to="jc@chat.example.org/converse.js-17184538" /* <presence xmlns="jabber:client" to="jc@chat.example.org/converse.js-17184538"
* from="oo@conference.chat.example.org/&lt;img src=&quot;x&quot; onerror=&quot;alert(123)&quot;/&gt;"> * from="oo@conference.chat.example.org/&lt;img src=&quot;x&quot; onerror=&quot;alert(123)&quot;/&gt;">
* <x xmlns="http://jabber.org/protocol/muc#user"> * <x xmlns="http://jabber.org/protocol/muc#user">
* <item jid="jc@chat.example.org/converse.js-17184538" affiliation="owner" role="moderator"/> * <item jid="jc@chat.example.org/converse.js-17184538" affiliation="owner" role="moderator"/>
* <status code="110"/> * <status code="110"/>
* </x> * </x>
* </presence>" * </presence>"
*/ */
const presence = $pres({ const presence = $pres({
to:'romeo@montague.lit/pda', to:'romeo@montague.lit/pda',
from:"lounge@montague.lit/&lt;img src=&quot;x&quot; onerror=&quot;alert(123)&quot;/&gt;" from:"lounge@montague.lit/&lt;img src=&quot;x&quot; onerror=&quot;alert(123)&quot;/&gt;"

View File

@ -6,16 +6,14 @@ import { html } from 'lit';
class ImageDirective extends AsyncDirective { class ImageDirective extends AsyncDirective {
render (src, href, onLoad, onClick) { render (src, href, onLoad, onClick) {
return html` return html`<a href="${href}" class="chat-image__link" target="_blank" rel="noopener"
<a href="${href}" class="chat-image__link" target="_blank" rel="noopener"
><img ><img
class="chat-image img-thumbnail" class="chat-image img-thumbnail"
src="${src}" src="${src}"
@click=${onClick} @click=${onClick}
@error=${() => this.onError(src, href, onLoad, onClick)} @error=${() => this.onError(src, href, onLoad, onClick)}
@load=${onLoad} @load=${onLoad}
/></a> /></a>`;
`;
} }
onError (src, href, onLoad, onClick) { onError (src, href, onLoad, onClick) {