Fix rendering of entry title in Twig views

This commit provides some improvements on the rendering of entry title
on entries list and entry views and refactors filter calls:
- Remove escape filter from apparent title, striptags is enough
- Move raw filter to the end of apparent title as it's ignored if not
  placed as the last filter
- Replace raw filter with e('html_attr') for title used in attributes,
  fixing possible issue and/or glitch
- Add striptags to entry.title used for link sharing to respect the
  apparent title

Fixes #2802

Signed-off-by: Kevin Decherf <kevin@kdecherf.com>

5 files changed, 19 insertions, 19 deletions

diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_full_image.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_full_image.html.twig
index 91a1bac0..58757158 100644
--- a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_full_image.html.twig
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_full_image.html.twig
@@ -11,8 +11,8 @@
 
         <div class="card-content">
             <span class="card-title dot-ellipsis dot-resize-update">
-                <a href="{{ path('view', { 'id': entry.id }) }}" title="{{ entry.title| e | raw | striptags }}">
-                    {{ entry.title | e | raw | striptags | truncate(80, true, '…') }}
+                <a href="{{ path('view', { 'id': entry.id }) }}" title="{{ entry.title| striptags | e('html_attr') }}">
+                    {{ entry.title | striptags | truncate(80, true, '…') | raw }}
                 </a>
             </span>
 
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_list.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_list.html.twig
index bb9b64ce..3ba6253a 100644
--- a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_list.html.twig
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_list.html.twig
@@ -2,7 +2,7 @@
     <div class="card-stacked">
         <div class="card-content">
             <span class="card-title dot-ellipsis dot-resize-update">
-                <a href="{{ path('view', { 'id': entry.id }) }}" title="{{ entry.title | raw | striptags }}">
+                <a href="{{ path('view', { 'id': entry.id }) }}" title="{{ entry.title | striptags | e('html_attr') }}">
                     {{ entry.title| striptags | truncate(120, true, '…') | raw }}
                 </a>
             </span>
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_no_preview.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_no_preview.html.twig
index ed916e79..eb158659 100644
--- a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_no_preview.html.twig
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_no_preview.html.twig
@@ -2,8 +2,8 @@
     <div class="card-body">
         <div class="card-content">
             <span class="card-title dot-ellipsis dot-resize-update">
-                <a href="{{ path('view', { 'id': entry.id }) }}" title="{{ entry.title | e | raw | striptags }}">
-                    {{ entry.title | e | raw | striptags | truncate(80, true, '…') }}
+                <a href="{{ path('view', { 'id': entry.id }) }}" title="{{ entry.title | striptags | e('html_attr') }}">
+                    {{ entry.title | striptags | truncate(80, true, '…') | raw }}
                 </a>
             </span>
 
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_preview.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_preview.html.twig
index d23be4d0..fb5301c8 100644
--- a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_preview.html.twig
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_preview.html.twig
@@ -13,8 +13,8 @@
             <i class="grey-text text-darken-4 activator material-icons right">more_vert</i>
 
             <span class="card-title dot-ellipsis dot-resize-update">
-                <a href="{{ path('view', { 'id': entry.id }) }}" title="{{ entry.title | e | raw | striptags }}">
-                    {{ entry.title | e | striptags | truncate(80, true, '…') | raw }}
+                <a href="{{ path('view', { 'id': entry.id }) }}" title="{{ entry.title | striptags | e('html_attr') }}">
+                    {{ entry.title | striptags | truncate(80, true, '…') | raw }}
                 </a>
             </span>
 
@@ -29,8 +29,8 @@
     <div class="card-reveal">
         <i class="card-title activator grey-text text-darken-4 material-icons right">clear</i>
         <span class="card-title">
-            <a href="{{ path('view', { 'id': entry.id }) }}" title="{{ entry.title | e | raw | striptags }}">
-                {{ entry.title | e | raw | striptags | truncate(80, true, '…') }}
+            <a href="{{ path('view', { 'id': entry.id }) }}" title="{{ entry.title | striptags | e('html_attr') }}">
+                {{ entry.title |  striptags | truncate(80, true, '…') | raw }}
             </a>
         </span>
 
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entry.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entry.html.twig
index 15428b92..3e8da09c 100644
--- a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entry.html.twig
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entry.html.twig
@@ -1,6 +1,6 @@
 {% extends "WallabagCoreBundle::layout.html.twig" %}
 
-{% block title %}{{ entry.title|e|raw }} ({{ entry.domainName|removeWww }}){% endblock %}
+{% block title %}{{ entry.title|striptags|raw }} ({{ entry.domainName|removeWww }}){% endblock %}
 
 {% block body_class %}entry{% endblock %}
 
@@ -118,14 +118,14 @@
                     {% endif %}
                     {% if craue_setting('share_twitter') %}
                         <li>
-                            <a href="https://twitter.com/home?status={{entry.title|url_encode}}%20{{ entry.url|url_encode }}%20via%20@wallabagapp" target="_blank" class="tool icon-twitter" title="twitter">
+                            <a href="https://twitter.com/home?status={{entry.title|striptags|url_encode}}%20{{ entry.url|url_encode }}%20via%20@wallabagapp" target="_blank" class="tool icon-twitter" title="twitter">
                                 <span>twitter</span>
                             </a>
                         </li>
                     {% endif %}
                     {% if craue_setting('share_shaarli') %}
                         <li>
-                        <a href="{{ craue_setting('shaarli_url') }}/index.php?post={{ entry.url|url_encode }}&amp;title={{ entry.title|url_encode }}&amp;tags={{ entry.tags|join(',')|url_encode }}" target="_blank">
+                        <a href="{{ craue_setting('shaarli_url') }}/index.php?post={{ entry.url|url_encode }}&amp;title={{ entry.title|striptags|url_encode }}&amp;tags={{ entry.tags|join(',')|striptags|url_encode }}" target="_blank">
                                 <i class="tool icon-image icon-image--shaarli" title="shaarli"></i>
                                 <span>shaarli</span>
                             </a>
@@ -133,7 +133,7 @@
                     {% endif %}
                     {% if craue_setting('share_diaspora') %}
                         <li>
-                            <a href="{{ craue_setting('diaspora_url') }}/bookmarklet?url={{ entry.url|url_encode }}&title={{ entry.title|url_encode }}&notes=&v=1&noui=1&jump=doclose" target="_blank">
+                            <a href="{{ craue_setting('diaspora_url') }}/bookmarklet?url={{ entry.url|url_encode }}&title={{ entry.title|striptags|url_encode }}&notes=&v=1&noui=1&jump=doclose" target="_blank">
                                 <i class="tool icon-image icon-image--diaspora" title="diaspora"></i>
                                 <span>diaspora*</span>
                             </a>
@@ -141,7 +141,7 @@
                     {% endif %}
                     {% if craue_setting('share_unmark') %}
                         <li>
-                            <a href="{{ craue_setting('unmark_url') }}/mark/add?url={{ entry.url|url_encode }}&amp;title={{entry.title|url_encode}}&amp;v=6" target="_blank">
+                            <a href="{{ craue_setting('unmark_url') }}/mark/add?url={{ entry.url|url_encode }}&amp;title={{entry.title|striptags|url_encode}}&amp;v=6" target="_blank">
                                 <i class="tool icon-image icon-image--unmark" title="unmark"></i>
                                 <span>unmark.it</span>
                             </a>
@@ -149,7 +149,7 @@
                     {% endif %}
                     {% if craue_setting('carrot') %}
                         <li>
-                            <a href="https://secure.carrot.org/GiveAndGetBack.do?url={{ entry.url|url_encode }}&title={{ entry.title|url_encode }}" target="_blank" title="carrot">
+                            <a href="https://secure.carrot.org/GiveAndGetBack.do?url={{ entry.url|url_encode }}&title={{ entry.title|striptags|url_encode }}" target="_blank" title="carrot">
                                 <i class="tool icon-image icon-image--carrot"></i>
                                 <span>Carrot</span>
                             </a>
@@ -157,7 +157,7 @@
                     {% endif %}
                     {% if craue_setting('share_mail') %}
                         <li>
-                            <a href="mailto:?subject={{ entry.title|url_encode }}&amp;body={{ entry.url|url_encode }}%20via%20@wallabagapp" title="{{ 'entry.view.left_menu.share_email_label'|trans }}" class="tool email icon icon-mail">
+                            <a href="mailto:?subject={{ entry.title|striptags|url_encode }}&amp;body={{ entry.url|url_encode }}%20via%20@wallabagapp" title="{{ 'entry.view.left_menu.share_email_label'|trans }}" class="tool email icon icon-mail">
                                 <span>{{ 'entry.view.left_menu.share_email_label'|trans }}</span>
                             </a>
                         </li>
@@ -209,7 +209,7 @@
 {% block content %}
     <div id="article">
         <header class="mbm">
-            <h1>{{ entry.title|e|raw }} <a href="{{ path('edit', { 'id': entry.id }) }}" title="{{ 'entry.view.edit_title'|trans }}">✎</a></h1>
+            <h1>{{ entry.title|striptags|raw }} <a href="{{ path('edit', { 'id': entry.id }) }}" title="{{ 'entry.view.edit_title'|trans }}">✎</a></h1>
         </header>
         <aside>
             <ul class="tools">
@@ -222,7 +222,7 @@
                 </li>
                 <li>
                     <i class="material-icons link">link</i>
-                    <a href="{{ entry.url|e }}" target="_blank" title="{{ 'entry.view.original_article'|trans }} : {{ entry.title|e }}" class="tool">
+                    <a href="{{ entry.url|e }}" target="_blank" title="{{ 'entry.view.original_article'|trans }} : {{ entry.title|striptags }}" class="tool">
                         {{ entry.domainName|removeWww }}
                     </a>
                 </li>
@@ -244,7 +244,7 @@
             </div>
 
             {% if entry.previewPicture is not null %}
-                <div><img class="preview" src="{{ entry.previewPicture }}" alt="{{ entry.title|raw }}" /></div>
+                <div><img class="preview" src="{{ entry.previewPicture }}" alt="{{ entry.title|striptags|e('html_attr') }}" /></div>
             {% endif %}
 
         </aside>