diff --git a/src/plugins/muc-views/templates/mep-message.js b/src/plugins/muc-views/templates/mep-message.js index 2d233e7fa..9fca6b7a0 100644 --- a/src/plugins/muc-views/templates/mep-message.js +++ b/src/plugins/muc-views/templates/mep-message.js @@ -20,7 +20,8 @@ export default (el) => { render_styling text=${el.model.getMessageText()}> - ${ el.model.get('reason') ? html`${el.model.get('reason')}` : `` } + ${ el.model.get('reason') ? + html`` : `` } `} + + + + + + + ${msg} + + ${reason} + + + + + + `); + _converse.connection._dataRecv(mock.createRequest(message)); + await u.waitUntil(() => model.messages.length === 1); + + const view = await u.waitUntil(() => _converse.chatboxviews.get(muc_jid)); + await u.waitUntil(() => view.querySelectorAll('.chat-info').length === 1, 1000); + expect(view.querySelector('.chat-info__message converse-rich-text').textContent.trim()).toBe(msg); + expect(view.querySelector('.reason converse-rich-text').innerHTML.replace(//g, '').trim()).toBe( + 'Check out https://conversejs.org'); + })); + it("can be retracted by a moderator", mock.initConverse(['chatBoxesFetched'], {}, async function (_converse) { diff --git a/src/shared/components/styles/rich-text.scss b/src/shared/components/styles/rich-text.scss index 14e3d8af8..07f50c02e 100644 --- a/src/shared/components/styles/rich-text.scss +++ b/src/shared/components/styles/rich-text.scss @@ -1,3 +1,9 @@ converse-rich-text { display: block; } + +.reason { + converse-rich-text { + display: inline-block; + } +}