Skip to content

C
converse.js
Commit 876a07b3 authored by JC Brand's avatar JC Brand
Browse files
Options

Fix the failing tests

parent 1405d9cb
Show whitespace changes
Inline Side-by-side
Showing with 205 additions and 163 deletions
css/converse.css
View file @ 876a07b3
...@@ -8360,7 +8360,7 @@ body.reset { ...@@ -8360,7 +8360,7 @@ body.reset {
color: #3AA569; color: #3AA569;
font-size: 14px; font-size: 14px;
line-height: 14px; line-height: 14px;
padding: 0.5rem 1rem; } padding: 0.35rem 1rem; }
#conversejs .message.chat-info.badge { #conversejs .message.chat-info.badge {
color: white; } color: white; }
#conversejs .message.chat-info.chat-state-notification { #conversejs .message.chat-info.chat-state-notification {
...@@ -8408,9 +8408,13 @@ body.reset { ...@@ -8408,9 +8408,13 @@ body.reset {
margin-left: 0; } margin-left: 0; }
#conversejs .message.chat-msg .chat-msg-text { #conversejs .message.chat-msg .chat-msg-text {
padding: 0; padding: 0;
color: #666; } color: #666;
word-wrap: break-word;
word-break: break-all; }
#conversejs .message.chat-msg .chat-msg-text .emojione { #conversejs .message.chat-msg .chat-msg-text .emojione {
margin-bottom: -6px; } margin-bottom: -6px; }
#conversejs .message.chat-msg .chat-msg-media audio {
width: 100%; }
#conversejs .message.chat-msg .avatar { #conversejs .message.chat-msg .avatar {
margin-top: 0.5em; margin-top: 0.5em;
background: #818479; background: #818479;
...@@ -8425,7 +8429,8 @@ body.reset { ...@@ -8425,7 +8429,8 @@ body.reset {
#conversejs .message.chat-msg .chat-msg-heading .chat-msg-author { #conversejs .message.chat-msg .chat-msg-heading .chat-msg-author {
font-weight: bold; } font-weight: bold; }
#conversejs .message.chat-msg .chat-msg-heading .chat-msg-time { #conversejs .message.chat-msg .chat-msg-heading .chat-msg-time {
padding-left: 0.5em; } padding-left: 0.25em;
color: #9d9d9d; }
#conversejs .message.chat-msg.chat-action .chat-msg-heading { #conversejs .message.chat-msg.chat-action .chat-msg-heading {
margin-top: 0; } margin-top: 0; }
#conversejs .message.chat-msg.chat-msg-followup { #conversejs .message.chat-msg.chat-msg-followup {
......
css/inverse.css
View file @ 876a07b3
...@@ -8548,7 +8548,7 @@ body { ...@@ -8548,7 +8548,7 @@ body {
color: #3AA569; color: #3AA569;
font-size: 14px; font-size: 14px;
line-height: 20px; line-height: 20px;
padding: 0.5rem 1rem; } padding: 0.35rem 1rem; }
#conversejs .message.chat-info.badge { #conversejs .message.chat-info.badge {
color: white; } color: white; }
#conversejs .message.chat-info.chat-state-notification { #conversejs .message.chat-info.chat-state-notification {
...@@ -8596,9 +8596,13 @@ body { ...@@ -8596,9 +8596,13 @@ body {
margin-left: 0; } margin-left: 0; }
#conversejs .message.chat-msg .chat-msg-text { #conversejs .message.chat-msg .chat-msg-text {
padding: 0; padding: 0;
color: #666; } color: #666;
word-wrap: break-word;
word-break: break-all; }
#conversejs .message.chat-msg .chat-msg-text .emojione { #conversejs .message.chat-msg .chat-msg-text .emojione {
margin-bottom: -6px; } margin-bottom: -6px; }
#conversejs .message.chat-msg .chat-msg-media audio {
width: 100%; }
#conversejs .message.chat-msg .avatar { #conversejs .message.chat-msg .avatar {
margin-top: 0.5em; margin-top: 0.5em;
background: #818479; background: #818479;
...@@ -8613,7 +8617,8 @@ body { ...@@ -8613,7 +8617,8 @@ body {
#conversejs .message.chat-msg .chat-msg-heading .chat-msg-author { #conversejs .message.chat-msg .chat-msg-heading .chat-msg-author {
font-weight: bold; } font-weight: bold; }
#conversejs .message.chat-msg .chat-msg-heading .chat-msg-time { #conversejs .message.chat-msg .chat-msg-heading .chat-msg-time {
padding-left: 0.5em; } padding-left: 0.25em;
color: #9d9d9d; }
#conversejs .message.chat-msg.chat-action .chat-msg-heading { #conversejs .message.chat-msg.chat-action .chat-msg-heading {
margin-top: 0; } margin-top: 0; }
#conversejs .message.chat-msg.chat-msg-followup { #conversejs .message.chat-msg.chat-msg-followup {
......
mockup/chatbox.html
View file @ 876a07b3
...@@ -46,11 +46,11 @@ ...@@ -46,11 +46,11 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">Romeo Montague</span> <span class="chat-msg-author">Romeo Montague</span>
<span class="chat-msg-time text-muted">15:31</span> <span class="chat-msg-time">15:31</span>
</span> </span>
<p class="chat-msg-text"> <span class="chat-msg-text">
He jests at scars that never felt a wound. He jests at scars that never felt a wound.
</p> </span>
</div> </div>
</div> </div>
...@@ -64,11 +64,11 @@ ...@@ -64,11 +64,11 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">Romeo Montague</span> <span class="chat-msg-author">Romeo Montague</span>
<span class="chat-msg-time text-muted">15:31</span> <span class="chat-msg-time">15:31</span>
</span> </span>
<p class="chat-msg-text"> <span class="chat-msg-text">
But soft, what light through yonder window breaks? But soft, what light through yonder window breaks?
</p> </span>
</div> </div>
</div> </div>
...@@ -77,11 +77,11 @@ ...@@ -77,11 +77,11 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">Romeo Montague</span> <span class="chat-msg-author">Romeo Montague</span>
<span class="chat-msg-time text-muted">15:31</span> <span class="chat-msg-time">15:31</span>
</span> </span>
<p class="chat-msg-text"> <span class="chat-msg-text">
It is the east and Juliet is the sun! It is the east and Juliet is the sun!
</p> </span>
</div> </div>
</div> </div>
...@@ -90,11 +90,11 @@ ...@@ -90,11 +90,11 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">Romeo Montague</span> <span class="chat-msg-author">Romeo Montague</span>
<span class="chat-msg-time text-muted">15:31</span> <span class="chat-msg-time">15:31</span>
</span> </span>
<p class="chat-msg-text"> <span class="chat-msg-text">
Arise, fair sun, and kill the envious moon, Arise, fair sun, and kill the envious moon,
</p> </span>
</div> </div>
</div> </div>
...@@ -105,14 +105,14 @@ ...@@ -105,14 +105,14 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">Juliet Capulet</span> <span class="chat-msg-author">Juliet Capulet</span>
<span class="chat-msg-time text-muted">15:31</span> <span class="chat-msg-time">15:31</span>
</span> </span>
<p class="chat-msg-text"> <span class="chat-msg-text">
O Romeo, Romeo! wherefore art thou Romeo? O Romeo, Romeo! wherefore art thou Romeo?
Deny thy father and refuse thy name; Deny thy father and refuse thy name;
Or, if thou wilt not, be but sworn my love, Or, if thou wilt not, be but sworn my love,
And I'll no longer be a Capulet. And I'll no longer be a Capulet.
</p> </span>
</div> </div>
</div> </div>
</div> </div>
......
mockup/chatroom.html
View file @ 876a07b3
...@@ -49,7 +49,7 @@ ...@@ -49,7 +49,7 @@
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">**Romeo Montague</span> <span class="chat-msg-author">**Romeo Montague</span>
</span> </span>
<p class="chat-msg-text">looks around</p> <span class="chat-msg-text">looks around</span>
</div> </div>
<div class="message chat-msg"> <div class="message chat-msg">
...@@ -57,9 +57,9 @@ ...@@ -57,9 +57,9 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">Romeo Montague</span> <span class="chat-msg-author">Romeo Montague</span>
<span class="chat-msg-time text-muted">15:31</span> <span class="chat-msg-time">15:31</span>
</span> </span>
<p class="chat-msg-text">He jests at scars that never felt a wound.</p> <span class="chat-msg-text">He jests at scars that never felt a wound.</span>
</div> </div>
</div> </div>
...@@ -76,11 +76,11 @@ ...@@ -76,11 +76,11 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">Romeo Montague</span> <span class="chat-msg-author">Romeo Montague</span>
<span class="chat-msg-time text-muted">19:36</span> <span class="chat-msg-time">19:36</span>
</span> </span>
<p class="chat-msg-text"> <span class="chat-msg-text">
But, soft! what light through yonder window breaks? But, soft! what light through yonder window breaks?
</p> </span>
</div> </div>
</div> </div>
<div class="message chat-msg chat-msg-followup"> <div class="message chat-msg chat-msg-followup">
...@@ -88,9 +88,9 @@ ...@@ -88,9 +88,9 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">Romeo Montague</span> <span class="chat-msg-author">Romeo Montague</span>
<span class="chat-msg-time text-muted">19:36</span> <span class="chat-msg-time">19:36</span>
</span> </span>
<p class="chat-msg-text">It is the east, and Juliet is the sun.</p> <span class="chat-msg-text">It is the east, and Juliet is the sun.</span>
</div> </div>
</div> </div>
<div class="message chat-msg chat-msg-followup"> <div class="message chat-msg chat-msg-followup">
...@@ -98,9 +98,9 @@ ...@@ -98,9 +98,9 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">Romeo Montague</span> <span class="chat-msg-author">Romeo Montague</span>
<span class="chat-msg-time text-muted">19:36</span> <span class="chat-msg-time">19:36</span>
</span> </span>
<p class="chat-msg-text">Arise, fair sun, and kill the envious moon, Who is already sick and pale with grief</p> <span class="chat-msg-text">Arise, fair sun, and kill the envious moon, Who is already sick and pale with grief</span>
</div> </div>
</div> </div>
...@@ -109,14 +109,14 @@ ...@@ -109,14 +109,14 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">Juliet Capulet</span> <span class="chat-msg-author">Juliet Capulet</span>
<span class="chat-msg-time text-muted">19:43</span> <span class="chat-msg-time">19:43</span>
</span> </span>
<p class="chat-msg-text"> <span class="chat-msg-text">
O Romeo, Romeo! wherefore art thou Romeo? O Romeo, Romeo! wherefore art thou Romeo?
Deny thy father and refuse thy name; Deny thy father and refuse thy name;
Or, if thou wilt not, be but sworn my love, Or, if thou wilt not, be but sworn my love,
And I'll no longer be a Capulet. And I'll no longer be a Capulet.
</p> </span>
<div class="chat-msg-media"></div> <div class="chat-msg-media"></div>
</div> </div>
</div> </div>
...@@ -126,7 +126,7 @@ ...@@ -126,7 +126,7 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">Romeo Montague</span> <span class="chat-msg-author">Romeo Montague</span>
<span class="chat-msg-time text-muted">19:36</span> <span class="chat-msg-time">19:36</span>
</span> </span>
<span class="chat-msg-text">Uploading file: <strong>juliet.jpg</strong>, 120kb</span> <span class="chat-msg-text">Uploading file: <strong>juliet.jpg</strong>, 120kb</span>
<progress value="50" max="100"/> <progress value="50" max="100"/>
...@@ -138,9 +138,9 @@ ...@@ -138,9 +138,9 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">Juliet Capulet</span> <span class="chat-msg-author">Juliet Capulet</span>
<span class="chat-msg-time text-muted">19:45</span> <span class="chat-msg-time">19:45</span>
</span> </span>
<p class="chat-msg-text"></p> <span class="chat-msg-text"></span>
<div class="chat-msg-media"> <div class="chat-msg-media">
<a href="https://images.unsplash.com/photo-1496660067708-010ebdd7ce72?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=ea3514e6e00d8ce25c24d992b97929d9&dpr=1&auto=format&fit=crop&w=1000&q=80&cs=tinysrgb" <a href="https://images.unsplash.com/photo-1496660067708-010ebdd7ce72?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=ea3514e6e00d8ce25c24d992b97929d9&dpr=1&auto=format&fit=crop&w=1000&q=80&cs=tinysrgb"
target="_blank" rel="noopener"> target="_blank" rel="noopener">
...@@ -155,7 +155,7 @@ ...@@ -155,7 +155,7 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">Romeo Montague</span> <span class="chat-msg-author">Romeo Montague</span>
<span class="chat-msg-time text-muted">19:36</span> <span class="chat-msg-time">19:36</span>
</span> </span>
<div> <div>
<span class="spoiler-hint">By a name</span> <span class="spoiler-hint">By a name</span>
...@@ -179,9 +179,9 @@ ...@@ -179,9 +179,9 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">Mercutio</span> <span class="chat-msg-author">Mercutio</span>
<span class="chat-msg-time text-muted">19:49</span> <span class="chat-msg-time">19:49</span>
</span> </span>
<p class="chat-msg-text">I mean, sir, in delay We waste our lights in vain, like lamps by day.</p> <span class="chat-msg-text">I mean, sir, in delay We waste our lights in vain, like lamps by day.</span>
</div> </div>
</div> </div>
...@@ -190,11 +190,11 @@ ...@@ -190,11 +190,11 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">Mercutio</span> <span class="chat-msg-author">Mercutio</span>
<span class="chat-msg-time text-muted">19:49</span> <span class="chat-msg-time">19:49</span>
</span> </span>
<p class="chat-msg-text"> <span class="chat-msg-text">
Take our good meaning, for our judgment sits. Take our good meaning, for our judgment sits.
Five times in that ere once in our five wits.</p> Five times in that ere once in our five wits.</span>
</div> </div>
</div> </div>
...@@ -203,13 +203,13 @@ ...@@ -203,13 +203,13 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">Mercutio</span> <span class="chat-msg-author">Mercutio</span>
<span class="chat-msg-time text-muted">19:49</span> <span class="chat-msg-time">19:49</span>
</span> </span>
<p class="chat-msg-text"> <span class="chat-msg-text">
True, I talk of dreams, Which are the children of an idle brain, Begot of nothing but vain fantasy, True, I talk of dreams, Which are the children of an idle brain, Begot of nothing but vain fantasy,
Which is as thin of substance as the air And more inconstant than the wind, who wooes Which is as thin of substance as the air And more inconstant than the wind, who wooes
Even now the frozen bosom of the north, And, being anger'd, puffs away from thence, Even now the frozen bosom of the north, And, being anger'd, puffs away from thence,
Turning his face to the dew-dropping south. Turning his face to the dew-dropping south.</span>
</div> </div>
</div> </div>
......
sass/_messages.scss
View file @ 876a07b3
...@@ -32,7 +32,7 @@ ...@@ -32,7 +32,7 @@
color: $chat-head-color; color: $chat-head-color;
font-size: $message-font-size; font-size: $message-font-size;
line-height: $line-height-small; line-height: $line-height-small;
padding: 0.5rem 1rem; padding: 0.35rem 1rem;
&.badge { &.badge {
color: $chat-head-text-color; color: $chat-head-text-color;
...@@ -105,11 +105,20 @@ ...@@ -105,11 +105,20 @@
.chat-msg-text { .chat-msg-text {
padding: 0; padding: 0;
color: $message-text-color; color: $message-text-color;
word-wrap: break-word;
word-break: break-all;
.emojione { .emojione {
margin-bottom: -6px; margin-bottom: -6px;
} }
} }
.chat-msg-media {
audio {
width: 100%;
}
}
.avatar { .avatar {
margin-top: 0.5em; margin-top: 0.5em;
background: $gray-color; background: $gray-color;
...@@ -127,7 +136,8 @@ ...@@ -127,7 +136,8 @@
font-weight: bold; font-weight: bold;
} }
.chat-msg-time { .chat-msg-time {
padding-left: 0.5em; padding-left: 0.25em;
color: lighten($text-color, 15%);
} }
} }
&.chat-action { &.chat-action {
......
spec/chatbox.js
View file @ 876a07b3
...@@ -593,11 +593,10 @@ ...@@ -593,11 +593,10 @@
expect(msg_obj.get('sender')).toEqual('them'); expect(msg_obj.get('sender')).toEqual('them');
expect(msg_obj.get('delayed')).toEqual(false); expect(msg_obj.get('delayed')).toEqual(false);
// Now check that the message appears inside the chatbox in the DOM // Now check that the message appears inside the chatbox in the DOM
var $chat_content = $(chatboxview.el).find('.chat-content'); var chat_content = chatboxview.el.querySelector('.chat-content');
var msg_txt = $chat_content.find('.chat-msg').find('.chat-msg-text').text(); expect(chat_content.querySelector('.chat-msg .chat-msg-text').textContent).toEqual(message);
expect(msg_txt).toEqual(message); expect(chat_content.querySelector('.chat-msg-time').textContent.match(/^[0-9][0-9]:[0-9][0-9]/)).toBeTruthy();
var sender_txt = $chat_content.find('span.chat-msg-them').text(); expect(chat_content.querySelector('span.chat-msg-author').textContent).toBe('Max Frankfurter');
expect(sender_txt.match(/^[0-9][0-9]:[0-9][0-9] /)).toBeTruthy();
done(); done();
}); });
})); }));
...@@ -709,12 +708,10 @@ ...@@ -709,12 +708,10 @@
expect(msg_obj.get('sender')).toEqual('them'); expect(msg_obj.get('sender')).toEqual('them');
expect(msg_obj.get('delayed')).toEqual(false); expect(msg_obj.get('delayed')).toEqual(false);
// Now check that the message appears inside the chatbox in the DOM // Now check that the message appears inside the chatbox in the DOM
var $chat_content = $(chatboxview.el).find('.chat-content'); var chat_content = chatboxview.el.querySelector('.chat-content');
var msg_txt = $chat_content.find('.chat-msg .chat-msg-text').text(); expect(chat_content.querySelector('.chat-msg .chat-msg-text').textContent).toEqual(message);
expect(msg_txt).toEqual(message); expect(chat_content.querySelector('.chat-msg-time').textContent.match(/^[0-9][0-9]:[0-9][0-9]/)).toBeTruthy();
var sender_txt = $chat_content.find('span.chat-msg-them').text(); expect(chat_content.querySelector('span.chat-msg-author').textContent).toBe('max.frankfurter@localhost');
expect(sender_txt.match(/^[0-9][0-9]:[0-9][0-9] /)).toBeTruthy();
expect(sender_txt.indexOf('max.frankfurter@localhost')).not.toBe(-1);
done(); done();
})); }));
}); });
...@@ -1095,20 +1092,27 @@ ...@@ -1095,20 +1092,27 @@
var $chat_content = $(chatboxview.el).find('.chat-content'); var $chat_content = $(chatboxview.el).find('.chat-content');
chatboxview.clearSpinner(); //cleanup chatboxview.clearSpinner(); //cleanup
var $time = $chat_content.find('time'); expect($chat_content[0].querySelectorAll('.date-separator').length).toEqual(4);
expect($time.length).toEqual(4);
$time = $chat_content.find('time:first'); var $day = $chat_content.find('.date-separator:first');
expect($time.data('isodate')).toEqual(moment('2017-12-31T00:00:00').format()); expect($day.data('isodate')).toEqual(moment('2017-12-31T00:00:00').format());
var $time = $chat_content.find('time:first');
expect($time.text()).toEqual('Sunday Dec 31st 2017') expect($time.text()).toEqual('Sunday Dec 31st 2017')
expect($time[0].nextElementSibling.querySelector('.chat-msg-text').textContent).toBe('Older message'); $day = $chat_content.find('.date-separator:first');
expect($day[0].nextElementSibling.querySelector('.chat-msg-text').textContent).toBe('Older message');
var $el = $chat_content.find('.chat-msg:first').find('.chat-msg-text') var $el = $chat_content.find('.chat-msg:first').find('.chat-msg-text')
expect($el.text()).toEqual('Older message'); expect($el.text()).toEqual('Older message');
$time = $chat_content.find('time:eq(1)'); $time = $chat_content.find('time:eq(1)');
expect($time.data('isodate')).toEqual(moment('2018-01-01T00:00:00').format());
expect($time.text()).toEqual("Monday Jan 1st 2018"); expect($time.text()).toEqual("Monday Jan 1st 2018");
expect($time[0].nextElementSibling.querySelector('.chat-msg-text').textContent).toBe('Inbetween message');
$day = $chat_content.find('.date-separator:eq(1)');
expect($day.data('isodate')).toEqual(moment('2018-01-01T00:00:00').format());
expect($day[0].nextElementSibling.querySelector('.chat-msg-text').textContent).toBe('Inbetween message');
$el = $chat_content.find('.chat-msg:eq(1)'); $el = $chat_content.find('.chat-msg:eq(1)');
expect($el.find('.chat-msg-text').text()).toEqual('Inbetween message'); expect($el.find('.chat-msg-text').text()).toEqual('Inbetween message');
expect($el[0].nextElementSibling.querySelector('.chat-msg-text').textContent).toEqual('another inbetween message'); expect($el[0].nextElementSibling.querySelector('.chat-msg-text').textContent).toEqual('another inbetween message');
...@@ -1116,9 +1120,12 @@ ...@@ -1116,9 +1120,12 @@
expect($el.find('.chat-msg-text').text()).toEqual('another inbetween message'); expect($el.find('.chat-msg-text').text()).toEqual('another inbetween message');
$time = $chat_content.find('time:nth(2)'); $time = $chat_content.find('time:nth(2)');
expect($time.data('isodate')).toEqual(moment('2018-01-02T00:00:00').format());
expect($time.text()).toEqual("Tuesday Jan 2nd 2018"); expect($time.text()).toEqual("Tuesday Jan 2nd 2018");
expect($time[0].nextElementSibling.querySelector('.chat-msg-text').textContent).toBe('An earlier message on the next day');
$day = $chat_content.find('.date-separator:nth(2)');
expect($day.data('isodate')).toEqual(moment('2018-01-02T00:00:00').format());
expect($day[0].nextElementSibling.querySelector('.chat-msg-text').textContent).toBe('An earlier message on the next day');
$el = $chat_content.find('.chat-msg:eq(3)'); $el = $chat_content.find('.chat-msg:eq(3)');
expect($el.find('.chat-msg-text').text()).toEqual('An earlier message on the next day'); expect($el.find('.chat-msg-text').text()).toEqual('An earlier message on the next day');
...@@ -1126,9 +1133,9 @@ ...@@ -1126,9 +1133,9 @@
expect($el.find('.chat-msg-text').text()).toEqual('message'); expect($el.find('.chat-msg-text').text()).toEqual('message');
expect($el[0].nextElementSibling.querySelector('.chat-msg-text').textContent).toEqual('newer message from the next day'); expect($el[0].nextElementSibling.querySelector('.chat-msg-text').textContent).toEqual('newer message from the next day');
$time = $chat_content.find('time:last'); $day = $chat_content.find('.date-separator:last');
expect($time.data('isodate')).toEqual(moment().startOf('day').format()); expect($day.data('isodate')).toEqual(moment().startOf('day').format());
expect($time[0].nextElementSibling.querySelector('.chat-msg-text').textContent).toBe('latest message'); expect($day[0].nextElementSibling.querySelector('.chat-msg-text').textContent).toBe('latest message');
done(); done();
}); });
})); }));
...@@ -1210,11 +1217,10 @@ ...@@ -1210,11 +1217,10 @@
expect(msg_obj.get('sender')).toEqual('them'); expect(msg_obj.get('sender')).toEqual('them');
expect(msg_obj.get('delayed')).toEqual(false); expect(msg_obj.get('delayed')).toEqual(false);
// Now check that the message appears inside the chatbox in the DOM // Now check that the message appears inside the chatbox in the DOM
var $chat_content = $(chatboxview.el).find('.chat-content'); var chat_content = chatboxview.el.querySelector('.chat-content');
var msg_txt = $chat_content.find('.chat-msg').find('.chat-msg-text').text(); expect(chat_content.querySelector('.chat-msg .chat-msg-text').textContent).toEqual(msgtext);
expect(msg_txt).toEqual(msgtext); expect(chat_content.querySelector('.chat-msg-time').textContent.match(/^[0-9][0-9]:[0-9][0-9]/)).toBeTruthy();
var sender_txt = $chat_content.find('span.chat-msg-them').text(); expect(chat_content.querySelector('span.chat-msg-author').textContent).toBe('Candice van der Knijff');
expect(sender_txt.match(/^[0-9][0-9]:[0-9][0-9] /)).toBeTruthy();
done(); done();
})); }));
...@@ -1421,15 +1427,18 @@ ...@@ -1421,15 +1427,18 @@
expect(msg_obj.get('fullname')).toEqual(contact_name); expect(msg_obj.get('fullname')).toEqual(contact_name);
expect(msg_obj.get('sender')).toEqual('them'); expect(msg_obj.get('sender')).toEqual('them');
expect(msg_obj.get('delayed')).toEqual(true); expect(msg_obj.get('delayed')).toEqual(true);
msg_txt = $chat_content.find('.chat-msg').find('.chat-msg-text').text();
expect(msg_txt).toEqual(message);
sender_txt = $chat_content.find('span.chat-msg-them').text();
expect(sender_txt.match(/^[0-9][0-9]:[0-9][0-9] /)).toBeTruthy();
var $time = $chat_content.find('time'); var chat_content = chatboxview.el.querySelector('.chat-content');
expect($time.length).toEqual(1); expect(chat_content.querySelector('.chat-msg .chat-msg-text').textContent).toEqual(message);
expect($time.attr('class')).toEqual('message chat-info chat-date badge badge-info'); expect(chat_content.querySelector('.chat-msg-time').textContent.match(/^[0-9][0-9]:[0-9][0-9]/)).toBeTruthy();
expect($time.data('isodate')).toEqual(moment(one_day_ago.startOf('day')).format()); expect(chat_content.querySelector('span.chat-msg-author').textContent).toBe('Candice van der Knijff');
var $day = $chat_content.find('.date-separator');
expect($day.length).toEqual(1);
expect($day.attr('class')).toEqual('message date-separator');
expect($day.data('isodate')).toEqual(moment(one_day_ago.startOf('day')).format());
var $time = $chat_content.find('time.separator-text');
expect($time.text()).toEqual(moment(one_day_ago.startOf('day')).format("dddd MMM Do YYYY")); expect($time.text()).toEqual(moment(one_day_ago.startOf('day')).format("dddd MMM Do YYYY"));
message = 'This is a current message'; message = 'This is a current message';
...@@ -1444,12 +1453,15 @@ ...@@ -1444,12 +1453,15 @@
expect(_converse.emit).toHaveBeenCalledWith('message', jasmine.any(Object)); expect(_converse.emit).toHaveBeenCalledWith('message', jasmine.any(Object));
// Check that there is a <time> element, with the required // Check that there is a <time> element, with the required
// props. // props.
$time = $chat_content.find('time'); expect($chat_content[0].querySelectorAll('time').length).toEqual(2); // There are now two time elements
expect($time.length).toEqual(2); // There are now two time elements
$time = $chat_content.find('time:last'); // We check the last one
var message_date = new Date(); var message_date = new Date();
expect($time.attr('class')).toEqual('message chat-info chat-date badge badge-info'); $day = $chat_content.find('.date-separator:last');
expect($time.data('isodate')).toEqual(moment(message_date).startOf('day').format()); expect($day.length).toEqual(1);
expect($day.attr('class')).toEqual('message date-separator');
expect($day.data('isodate')).toEqual(moment(message_date).startOf('day').format());
$time = $chat_content.find('time.separator-text:last');
expect($time.text()).toEqual(moment(message_date).startOf('day').format("dddd MMM Do YYYY")); expect($time.text()).toEqual(moment(message_date).startOf('day').format("dddd MMM Do YYYY"));
// Normal checks for the 2nd message // Normal checks for the 2nd message
...@@ -1461,8 +1473,10 @@ ...@@ -1461,8 +1473,10 @@
expect(msg_obj.get('delayed')).toEqual(false); expect(msg_obj.get('delayed')).toEqual(false);
msg_txt = $chat_content.find('.chat-msg').last().find('.chat-msg-text').text(); msg_txt = $chat_content.find('.chat-msg').last().find('.chat-msg-text').text();
expect(msg_txt).toEqual(message); expect(msg_txt).toEqual(message);
sender_txt = $chat_content.find('span.chat-msg-them').last().text();
expect(sender_txt.match(/^[0-9][0-9]:[0-9][0-9] /)).toBeTruthy(); expect(chat_content.querySelector('.chat-msg:last-child .chat-msg-text').textContent).toEqual(message);
expect(chat_content.querySelector('.chat-msg:last-child .chat-msg-time').textContent.match(/^[0-9][0-9]:[0-9][0-9]/)).toBeTruthy();
expect(chat_content.querySelector('.chat-msg:last-child .chat-msg-author').textContent).toBe('Candice van der Knijff');
done(); done();
}); });
})); }));
...@@ -1551,7 +1565,6 @@ ...@@ -1551,7 +1565,6 @@
msg = $(view.el).find('.chat-content').find('.chat-msg').last().find('.chat-msg-text'); msg = $(view.el).find('.chat-content').find('.chat-msg').last().find('.chat-msg-text');
expect(msg.text()).toEqual(message); expect(msg.text()).toEqual(message);
expect(msg.html()).toEqual('<a target="_blank" rel="noopener" href="http://www.opkode.com/%27onmouseover=%27alert%281%29%27whatever">http://www.opkode.com/\'onmouseover=\'alert(1)\'whatever</a>'); expect(msg.html()).toEqual('<a target="_blank" rel="noopener" href="http://www.opkode.com/%27onmouseover=%27alert%281%29%27whatever">http://www.opkode.com/\'onmouseover=\'alert(1)\'whatever</a>');
message = 'http://www.opkode.com/"onmouseover="alert(1)"whatever'; message = 'http://www.opkode.com/"onmouseover="alert(1)"whatever';
test_utils.sendMessage(view, message); test_utils.sendMessage(view, message);
...@@ -1566,15 +1579,15 @@ ...@@ -1566,15 +1579,15 @@
expect(view.model.sendMessage).toHaveBeenCalled(); expect(view.model.sendMessage).toHaveBeenCalled();
msg = $(view.el).find('.chat-content').find('.chat-msg').last().find('.chat-msg-text'); msg = $(view.el).find('.chat-content').find('.chat-msg').last().find('.chat-msg-text');
expect(msg.text()).toEqual(message); expect(msg.text()).toEqual(message);
expect(msg.html()).toEqual('<a target="_blank" rel="noopener" href="https://en.wikipedia.org/wiki/Ender%27s_Game">https://en.wikipedia.org/wiki/Ender\'s_Game</a>'); expect(msg.html()).toEqual('<a target="_blank" rel="noopener" href="https://en.wikipedia.org/wiki/Ender%27s_Game">'+message+'</a>');
message = "https://en.wikipedia.org/wiki/Ender%27s_Game"; message = "https://en.wikipedia.org/wiki/Ender's_Game";
test_utils.sendMessage(view, message); test_utils.sendMessage(view, message);
expect(view.model.sendMessage).toHaveBeenCalled(); expect(view.model.sendMessage).toHaveBeenCalled();
msg = $(view.el).find('.chat-content').find('.chat-msg').last().find('.chat-msg-text'); msg = $(view.el).find('.chat-content').find('.chat-msg').last().find('.chat-msg-text');
expect(msg.text()).toEqual(message); expect(msg.text()).toEqual(message);
expect(msg.html()).toEqual('<a target="_blank" rel="noopener" href="https://en.wikipedia.org/wiki/Ender%27s_Game">https://en.wikipedia.org/wiki/Ender%27s_Game</a>'); expect(msg.html()).toEqual('<a target="_blank" rel="noopener" href="https://en.wikipedia.org/wiki/Ender%27s_Game">'+message+'</a>');
done(); done();
})); }));
...@@ -1650,7 +1663,7 @@ ...@@ -1650,7 +1663,7 @@
test_utils.waitUntil(function () { test_utils.waitUntil(function () {
return view.el.querySelectorAll('.chat-content .chat-msg video').length; return view.el.querySelectorAll('.chat-content .chat-msg video').length;
}, 1000).then(function () { }, 2000).then(function () {
var msg = view.el.querySelector('.chat-msg .chat-msg-text'); var msg = view.el.querySelector('.chat-msg .chat-msg-text');
expect(msg.outerHTML).toEqual('<span class="chat-msg-text">Have you seen this funny video?</span>'); expect(msg.outerHTML).toEqual('<span class="chat-msg-text">Have you seen this funny video?</span>');
var media = view.el.querySelector('.chat-msg .chat-msg-media'); var media = view.el.querySelector('.chat-msg .chat-msg-media');
...@@ -1705,7 +1718,7 @@ ...@@ -1705,7 +1718,7 @@
expect(msg.outerHTML).toEqual('<span class="chat-msg-text">Have you downloaded this funny file?</span>'); expect(msg.outerHTML).toEqual('<span class="chat-msg-text">Have you downloaded this funny file?</span>');
var media = view.el.querySelector('.chat-msg .chat-msg-media'); var media = view.el.querySelector('.chat-msg .chat-msg-media');
expect(media.innerHTML.replace(/(\r\n|\n|\r)/gm, "")).toEqual( expect(media.innerHTML.replace(/(\r\n|\n|\r)/gm, "")).toEqual(
'<a target="_blank" rel="noopener" href="http://localhost/funny.pdf">Download file: "funny.pdf</a>'); '<a target="_blank" rel="noopener" href="http://localhost/funny.pdf">Download: "funny.pdf</a>');
done(); done();
}); });
})); }));
...@@ -1734,12 +1747,14 @@ ...@@ -1734,12 +1747,14 @@
test_utils.waitUntil(function () { test_utils.waitUntil(function () {
return view.el.querySelectorAll('.chat-content .chat-msg img').length; return view.el.querySelectorAll('.chat-content .chat-msg img').length;
}, 1000).then(function () { }, 2000).then(function () {
var msg = view.el.querySelector('.chat-msg .chat-msg-text'); var msg = view.el.querySelector('.chat-msg .chat-msg-text');
expect(msg.outerHTML).toEqual('<span class="chat-msg-text">Have you seen this funny image?</span>'); expect(msg.outerHTML).toEqual('<span class="chat-msg-text">Have you seen this funny image?</span>');
var media = view.el.querySelector('.chat-msg .chat-msg-media'); var media = view.el.querySelector('.chat-msg .chat-msg-media');
expect(media.innerHTML.replace(/(\r\n|\n|\r)/gm, "")).toEqual( expect(media.innerHTML.replace(/(\r\n|\n|\r)/gm, "")).toEqual(
'<img class="chat-image" src="http://localhost:8000/logo/conversejs-filled.svg">'); '<a href="http://localhost:8000/logo/conversejs-filled.svg" target="_blank" rel="noopener">'+
'<img class="chat-image img-thumbnail" src="http://localhost:8000/logo/conversejs-filled.svg">'+
'</a>');
done(); done();
}); });
})); }));
...@@ -1759,40 +1774,36 @@ ...@@ -1759,40 +1774,36 @@
test_utils.sendMessage(view, message); test_utils.sendMessage(view, message);
test_utils.waitUntil(function () { test_utils.waitUntil(function () {
return $(view.el).find('.chat-content').find('.chat-msg img').length; return view.el.querySelectorAll('.chat-content .chat-image').length;
}, 1000).then(function () { }, 1000).then(function () {
expect(view.model.sendMessage).toHaveBeenCalled(); expect(view.model.sendMessage).toHaveBeenCalled();
var msg = $(view.el).find('.chat-content').find('.chat-msg').last().find('.chat-msg-text'); var msg = $(view.el).find('.chat-content .chat-msg').last().find('.chat-msg-text');
expect(msg.html()).toEqual( expect(msg.html().trim()).toEqual(
'<a target="_blank" rel="noopener" href="'+base_url+'/logo/conversejs-filled.svg"><img class="chat-image"'+ '<a href="'+base_url+'/logo/conversejs-filled.svg" target="_blank" rel="noopener"><img class="chat-image img-thumbnail"'+
' src="' + message + '"></a>'); ' src="' + message + '"></a>');
message += "?param1=val1&param2=val2"; message += "?param1=val1&param2=val2";
test_utils.sendMessage(view, message); test_utils.sendMessage(view, message);
return test_utils.waitUntil(function () { return test_utils.waitUntil(function () {
return $(view.el).find('.chat-content').find('.chat-msg img').length === 2; return view.el.querySelectorAll('.chat-content .chat-image').length === 2;
}, 1000); }, 1000);
}).then(function () { }).then(function () {
expect(view.model.sendMessage).toHaveBeenCalled(); expect(view.model.sendMessage).toHaveBeenCalled();
var msg = $(view.el).find('.chat-content').find('.chat-msg').last().find('.chat-msg-text'); var msg = $(view.el).find('.chat-content').find('.chat-msg').last().find('.chat-msg-text');
expect(msg.html()).toEqual( expect(msg.html().trim()).toEqual(
'<a target="_blank" rel="noopener" href="'+base_url+'/logo/conversejs-filled.svg?param1=val1&amp;param2=val2"><img'+ '<a href="'+base_url+'/logo/conversejs-filled.svg?param1=val1&amp;param2=val2" target="_blank" rel="noopener"><img'+
' class="chat-image" src="'+message.replace(/&/g, '&amp;')+'"></a>') ' class="chat-image img-thumbnail" src="'+message.replace(/&/g, '&amp;')+'"></a>')
// Test now with two images in one message // Test now with two images in one message
message += ' hello world '+base_url+"/logo/conversejs-filled.svg"; message += ' hello world '+base_url+"/logo/conversejs-filled.svg";
test_utils.sendMessage(view, message); test_utils.sendMessage(view, message);
return test_utils.waitUntil(function () { return test_utils.waitUntil(function () {
return $(view.el).find('.chat-content').find('.chat-msg img').length === 4; return view.el.querySelectorAll('.chat-content .chat-image').length === 4;
}, 1000); }, 1000);
}).then(function () { }).then(function () {
expect(view.model.sendMessage).toHaveBeenCalled(); expect(view.model.sendMessage).toHaveBeenCalled();
var msg = $(view.el).find('.chat-content').find('.chat-msg').last().find('.chat-msg-text'); var msg = $(view.el).find('.chat-content').find('.chat-msg').last().find('.chat-msg-text');
expect(msg.html()).toEqual( expect(msg[0].textContent.trim()).toEqual('hello world');
'<a target="_blank" rel="noopener" href="'+base_url+'/logo/conversejs-filled.svg?param1=val1&amp;param2=val2">'+ expect(msg[0].querySelectorAll('img').length).toEqual(2);
'<img class="chat-image" src="'+base_url+'/logo/conversejs-filled.svg?param1=val1&amp;param2=val2"></a> hello world '+
'<a target="_blank" rel="noopener" href="'+base_url+'/logo/conversejs-filled.svg">'+
'<img class="chat-image" src="'+base_url+'/logo/conversejs-filled.svg"></a>'
)
done(); done();
}); });
})); }));
...@@ -1814,11 +1825,13 @@ ...@@ -1814,11 +1825,13 @@
var chatbox = _converse.chatboxes.get(contact_jid); var chatbox = _converse.chatboxes.get(contact_jid);
expect(chatbox.messages.models.length, 1); expect(chatbox.messages.models.length, 1);
var msg_object = chatbox.messages.models[0]; var msg_object = chatbox.messages.models[0];
var msg_time_author = $(view.el).find('.chat-content').find('.chat-msg')
.last().find('.chat-msg-author.chat-msg-me').text(); var msg_author = view.el.querySelector('.chat-content .chat-msg:last-child .chat-msg-author');
var msg_time_rendered = msg_time_author.split(" ",1); expect(msg_author.textContent).toBe('dummy@localhost');
var msg_time = moment(msg_object.get('time')).format(_converse.time_format);
expect(msg_time_rendered[0]).toBe(msg_time); var msg_time = view.el.querySelector('.chat-content .chat-msg:last-child .chat-msg-time');
var time = moment(msg_object.get('time')).format(_converse.time_format);
expect(msg_time.textContent).toBe(time);
done(); done();
})); }));
}); });
......
spec/chatroom.js
View file @ 876a07b3
...@@ -619,11 +619,11 @@ ...@@ -619,11 +619,11 @@
var view = _converse.chatboxviews.get('coven@chat.shakespeare.lit'); var view = _converse.chatboxviews.get('coven@chat.shakespeare.lit');
var chat_content = view.el.querySelector('.chat-content'); var chat_content = view.el.querySelector('.chat-content');
var $chat_content = $(chat_content); var $chat_content = $(chat_content);
var time = chat_content.querySelector('time'); var indicator = chat_content.querySelector('.date-separator');
expect(time).not.toBe(null); expect(indicator).not.toBe(null);
expect(time.getAttribute('class')).toEqual('message chat-info chat-date badge badge-info'); expect(indicator.getAttribute('class')).toEqual('message date-separator');
expect(time.getAttribute('data-isodate')).toEqual(moment().startOf('day').format()); expect(indicator.getAttribute('data-isodate')).toEqual(moment().startOf('day').format());
expect(time.textContent).toEqual(moment().startOf('day').format("dddd MMM Do YYYY")); expect(indicator.querySelector('time').textContent).toEqual(moment().startOf('day').format("dddd MMM Do YYYY"));
expect(chat_content.querySelectorAll('div.chat-info').length).toBe(1); expect(chat_content.querySelectorAll('div.chat-info').length).toBe(1);
expect(chat_content.querySelector('div.chat-info').textContent).toBe( expect(chat_content.querySelector('div.chat-info').textContent).toBe(
"dummy has entered the room" "dummy has entered the room"
...@@ -654,11 +654,13 @@ ...@@ -654,11 +654,13 @@
}); });
_converse.connection._dataRecv(test_utils.createRequest(presence)); _converse.connection._dataRecv(test_utils.createRequest(presence));
time = chat_content.querySelector('time[data-isodate="'+moment().startOf('day').format()+'"]'); indicator = chat_content.querySelector('.date-separator[data-isodate="'+moment().startOf('day').format()+'"]');
expect(time).not.toBe(null); expect(indicator).not.toBe(null);
expect(time.getAttribute('class')).toEqual('message chat-info chat-date badge badge-info');
expect(time.getAttribute('data-isodate')).toEqual(moment().startOf('day').format()); expect(indicator.getAttribute('class')).toEqual('message date-separator');
expect(time.textContent).toEqual(moment().startOf('day').format("dddd MMM Do YYYY")); expect(indicator.getAttribute('data-isodate')).toEqual(moment().startOf('day').format());
expect(indicator.querySelector('time').getAttribute('class')).toEqual('separator-text');
expect(indicator.querySelector('time').textContent).toEqual(moment().startOf('day').format("dddd MMM Do YYYY"));
expect(chat_content.querySelector('div.chat-info:last-child').textContent).toBe( expect(chat_content.querySelector('div.chat-info:last-child').textContent).toBe(
"some1 has entered the room" "some1 has entered the room"
); );
...@@ -680,11 +682,13 @@ ...@@ -680,11 +682,13 @@
}); });
_converse.connection._dataRecv(test_utils.createRequest(presence)); _converse.connection._dataRecv(test_utils.createRequest(presence));
time = chat_content.querySelector('time[data-isodate="'+moment().startOf('day').format()+'"]'); indicator = chat_content.querySelector('.date-separator[data-isodate="'+moment().startOf('day').format()+'"]');
expect(time).not.toBe(null);
expect(time.getAttribute('class')).toEqual('message chat-info chat-date badge badge-info'); expect(indicator).not.toBe(null);
expect(time.getAttribute('data-isodate')).toEqual(moment().startOf('day').format()); expect(indicator.getAttribute('class')).toEqual('message date-separator');
expect(time.textContent).toEqual(moment().startOf('day').format("dddd MMM Do YYYY")); expect(indicator.getAttribute('data-isodate')).toEqual(moment().startOf('day').format());
expect(indicator.querySelector('time').textContent).toEqual(moment().startOf('day').format("dddd MMM Do YYYY"));
expect($(chat_content).find('div.chat-info').length).toBe(4); expect($(chat_content).find('div.chat-info').length).toBe(4);
expect($(chat_content).find('div.chat-info:last').html()).toBe( expect($(chat_content).find('div.chat-info:last').html()).toBe(
'some1 has left the room. '+ 'some1 has left the room. '+
...@@ -716,10 +720,10 @@ ...@@ -716,10 +720,10 @@
var $time = $chat_content.find('time'); var $time = $chat_content.find('time');
expect($time.length).toEqual(4); expect($time.length).toEqual(4);
$time = $chat_content.find('time:eq(3)'); var $indicator = $chat_content.find('.date-separator:eq(3)');
expect($time.attr('class')).toEqual('message chat-info chat-date badge badge-info'); expect($indicator.attr('class')).toEqual('message date-separator');
expect($time.data('isodate')).toEqual(moment().startOf('day').format()); expect($indicator.data('isodate')).toEqual(moment().startOf('day').format());
expect($time.text()).toEqual(moment().startOf('day').format("dddd MMM Do YYYY")); expect($indicator.find('time').text()).toEqual(moment().startOf('day').format("dddd MMM Do YYYY"));
expect($chat_content.find('div.chat-info').length).toBe(5); expect($chat_content.find('div.chat-info').length).toBe(5);
expect($chat_content.find('div.chat-info:last').html()).toBe("newguy has entered the room"); expect($chat_content.find('div.chat-info:last').html()).toBe("newguy has entered the room");
...@@ -755,10 +759,11 @@ ...@@ -755,10 +759,11 @@
$time = $chat_content.find('time'); $time = $chat_content.find('time');
expect($time.length).toEqual(6); expect($time.length).toEqual(6);
$time = $chat_content.find('time:eq(5)'); $indicator = $chat_content.find('.date-separator:eq(5)');
expect($time.attr('class')).toEqual('message chat-info chat-date badge badge-info'); expect($indicator.attr('class')).toEqual('message date-separator');
expect($time.data('isodate')).toEqual(moment().startOf('day').format()); expect($indicator.data('isodate')).toEqual(moment().startOf('day').format());
expect($time.text()).toEqual(moment().startOf('day').format("dddd MMM Do YYYY"));
expect($indicator.find('time').text()).toEqual(moment().startOf('day').format("dddd MMM Do YYYY"));
expect($chat_content.find('div.chat-info').length).toBe(6); expect($chat_content.find('div.chat-info').length).toBe(6);
expect($chat_content.find('div.chat-info:last').html()).toBe( expect($chat_content.find('div.chat-info:last').html()).toBe(
'newguy has left the room. '+ 'newguy has left the room. '+
...@@ -2298,7 +2303,7 @@ ...@@ -2298,7 +2303,7 @@
.c('status', {'code': '307'}); .c('status', {'code': '307'});
_converse.connection._dataRecv(test_utils.createRequest(presence)); _converse.connection._dataRecv(test_utils.createRequest(presence));
expect( expect(
view.el.querySelectorAll('.chat-info')[3].textContent).toBe( view.el.querySelectorAll('.chat-info')[2].textContent).toBe(
"annoyingGuy has been kicked out"); "annoyingGuy has been kicked out");
done(); done();
}).catch(_.partial(console.error, _)); }).catch(_.partial(console.error, _));
......
src/templates/message.html
View file @ 876a07b3
...@@ -5,9 +5,9 @@ ...@@ -5,9 +5,9 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">{{{o.username}}}</span> <span class="chat-msg-author">{{{o.username}}}</span>
<span class="chat-msg-time tex{{{o.username}}}t-muted">{{{o.pretty_time}}}</span> <span class="chat-msg-time">{{{o.pretty_time}}}</span>
</span> </span>
<p class="chat-msg-text"> <span class="chat-msg-text"></span>
<div class="chat-msg-media"></div> <div class="chat-msg-media"></div>
</div> </div>
</div> </div>
src/templates/new_day.html
View file @ 876a07b3
<div class="message date-separator"> <div class="message date-separator" data-isodate="{{{o.isodate}}}">
<hr class="separator"> <hr class="separator">
<time class="separator-text" datetime="{{{o.isodate}}}"><span>{{{o.datestring}}}</span></time> <time class="separator-text" datetime="{{{o.isodate}}}"><span>{{{o.datestring}}}</span></time>
</div> </div>
src/templates/spoiler_message.html
View file @ 876a07b3
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<div class="chat-msg-content"> <div class="chat-msg-content">
<span class="chat-msg-heading"> <span class="chat-msg-heading">
<span class="chat-msg-author">{{{o.username}}}</span> <span class="chat-msg-author">{{{o.username}}}</span>
<span class="chat-msg-time text-muted">{{{o.pretty_time}}}</span> <span class="chat-msg-time">{{{o.pretty_time}}}</span>
</span> </span>
<div> <div>
<span class="spoiler-hint">{{{o.spoiler_hint}}}</span> <span class="spoiler-hint">{{{o.spoiler_hint}}}</span>
......
src/utils/core.js
View file @ 876a07b3
...@@ -66,18 +66,6 @@ ...@@ -66,18 +66,6 @@
'warn': _.get(console, 'log') ? console.log.bind(console) : _.noop 'warn': _.get(console, 'log') ? console.log.bind(console) : _.noop
}, console); }, console);
var unescapeHTML = function (htmlEscapedText) {
/* Helper method that replace HTML-escaped symbols with equivalent characters
* (e.g. transform occurrences of '&amp;' to '&')
*
* Parameters:
* (String) htmlEscapedText: a String containing the HTML-escaped symbols.
*/
var div = document.createElement('div');
div.innerHTML = htmlEscapedText;
return div.innerText;
};
var isImage = function (url) { var isImage = function (url) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
var img = new Image(); var img = new Image();
...@@ -200,6 +188,18 @@ ...@@ -200,6 +188,18 @@
return matches; return matches;
} }
u.unescapeHTML = function (htmlEscapedText) {
/* Helper method that replace HTML-escaped symbols with equivalent characters
* (e.g. transform occurrences of '&amp;' to '&')
*
* Parameters:
* (String) htmlEscapedText: a String containing the HTML-escaped symbols.
*/
var div = document.createElement('div');
div.innerHTML = htmlEscapedText;
return div.innerText;
};
u.escapeHTML = function (string) { u.escapeHTML = function (string) {
return string return string
.replace(/&/g, "&amp;") .replace(/&/g, "&amp;")
...@@ -212,7 +212,11 @@ ...@@ -212,7 +212,11 @@
return URI.withinString(text, function (url) { return URI.withinString(text, function (url) {
var uri = new URI(url); var uri = new URI(url);
uri.normalize(); uri.normalize();
return `<a href="${u.escapeHTML(url)}">${u.escapeHTML(uri.readable())}</a>`; if (!url.startsWith('http://') && !url.startsWith('https://')) {
url = 'http://' + url;
}
url = encodeURI(decodeURI(url)).replace(/[!'()]/g, escape).replace(/\*/g, "%2A");
return `<a target="_blank" rel="noopener" href="${u.escapeHTML(url)}">${u.escapeHTML(uri.readable())}</a>`;
}); });
}; };
...@@ -233,9 +237,9 @@ ...@@ -233,9 +237,9 @@
i.addEventListener('error', resolve); i.addEventListener('error', resolve);
_.each(sizzle(`a[href="${url}"]`, obj), (a) => { _.each(sizzle(`a[href="${url}"]`, obj), (a) => {
a.innerHTML = tpl_image({ a.outerHTML= tpl_image({
'url': url, 'url': url,
'label_download': __('Download image file') 'label_download': __('Download')
}) })
}); });
}).catch(resolve) }).catch(resolve)
...@@ -268,7 +272,7 @@ ...@@ -268,7 +272,7 @@
return tpl_image({ return tpl_image({
'url': url, 'url': url,
'label_download': __('Download image file') 'label_download': __('Download')
}) })
} }
return url; return url;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7