fix links sticking to mentionsline

This commit is contained in:
Henry Jameson 2021-08-15 18:11:38 +03:00
parent f16658adfc
commit 8cc1ad67df
3 changed files with 10 additions and 3 deletions

View file

@ -4,7 +4,7 @@
color: var(--link); color: var(--link);
} }
.mention-link:not(:last-child) { .mention-link {
margin-right: 0.25em; margin-right: 0.25em;
} }
} }

View file

@ -121,6 +121,13 @@ export default Vue.component('RichContent', {
// in MentionsLine // in MentionsLine
return currentMentions !== null ? item.trim() : item return currentMentions !== null ? item.trim() : item
} }
// We add space with mentionsLine, otherwise non-text elements will
// stick to them.
if (currentMentions !== null) {
// single whitespace trim
item = item[0].match(/\s/) ? item.slice(1) : item
}
currentMentions = null currentMentions = null
if (item.includes(':')) { if (item.includes(':')) {
item = ['', processTextForEmoji( item = ['', processTextForEmoji(

View file

@ -59,7 +59,7 @@ describe('RichContent', () => {
it('replaces mention with mentionsline', () => { it('replaces mention with mentionsline', () => {
const html = p( const html = p(
makeMention('John'), makeMention('John'),
' how are you doing today?' ' how are you doing today?' // also testing single-trimming function
) )
const wrapper = shallowMount(RichContent, { const wrapper = shallowMount(RichContent, {
localVue, localVue,
@ -74,7 +74,7 @@ describe('RichContent', () => {
expect(wrapper.html()).to.eql(compwrap(p( expect(wrapper.html()).to.eql(compwrap(p(
mentionsLine(1), mentionsLine(1),
' how are you doing today?' ' how are you doing today?' // space removed to compensate for <ML> padding
))) )))
}) })