Broken Comment User CSS Avatar When Logged In vs Not Logged In

[Torqu3Wr3nch]

Hi everyone,

I believe I've identified an issue with this plug in when used with the Ghost platform. When logged into nodebb and viewing comments on a Ghost blog, if the user has not uploaded an avatar (which most users haven't), the "image" next to their comment displays as a broken image. If you are not logged in, the CSS avatar displays correctly.

This can be seen on my blog in the comments at https://engineerworkshop.com/2019/08/14/how-to-set-up-vlans-on-an-l3-switch-hp-1910-with-pfsense/

Looking at the page with developer tools, it appears that, when logged in, the script is trying to populate the user comment image with an img tag. However, when not logged in, the script uses the more appropriate inline styling since the user doesn't have an uploaded image avatar:

I did some preliminary investigation and I believe the source of this problem is coming from the template:

nodebb-plugin-blog-comments/public/templates/comments/comments.tpl

Lines 32 to 40 in ed01565

	<div class="topic-profile-pic">
	<a href="{relative_path}/user/{user.userslug}">
	<!-- IF user.picture -->
	<img src="{user.picture}" alt="{user.username}" class="profile-image" title="{user.username}">
	<!-- ELSE -->
	<div class="profile-image" style="background-color: {user.icon:bgColor}" title="{user.username}" alt="{user.username}">{user.icon:text}</div>
	<!-- ENDIF user.picture -->
	</a>
	</div>

Is user.picture not null for some reason when logged in (even as a different user) and therefore the template is attempting to insert an img tag?

It makes the comments section look clunky to registered users so thank you for your help in advance!

[simontaosim]

same problem!