Skip to content

Commit

Permalink
feature symfony#17852 Improved the logger panel when the log context …
Browse files Browse the repository at this point in the history 
…is very long (javiereguiluz)

This PR was squashed before being merged into the 3.1-dev branch (closes symfony#17852).

Discussion
----------

Improved the logger panel when the log context is very long

| Q             | A
| ------------- | ---
| Bug fix?      | no
| New feature?  | yes
| BC breaks?    | no
| Deprecations? | no
| Tests pass?   | yes
| Fixed tickets | -
| License       | MIT
| Doc PR        | -

### Problem

When the context of a log message is long, it's very hard to read it:

![long_context](https://cloud.githubusercontent.com/assets/73419/13177340/d0205bbe-d718-11e5-9ba4-243aea0358bb.png)

### Solution

Add a toggle which displays the context properly formatted in several lines:

![logger_expand_context](https://cloud.githubusercontent.com/assets/73419/13177347/e12a723c-d718-11e5-8461-f1827d6dcd8c.gif)

To avoid cluttering the logs, this toggle is only displayed for really long contexts. For example, these three short contexts don't display that link:

![short_context](https://cloud.githubusercontent.com/assets/73419/13177374/fc9f97cc-d718-11e5-8245-8b308c48ebcf.png)

Commits
-------

33f0e5e Improved the logger panel when the log context is very long
  • Loading branch information
@fabpot
fabpot committed Mar 2, 2016
2 parents 99c64e8 + 855634f commit 69a6ef9
Show file tree
Hide file tree
Showing 2 changed files with 36 additions and 15 deletions.
43 changes: 28 additions & 15 deletions Resources/views/Collector/logger.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,7 @@
<p>There are no log messages of this level.</p>
</div>
{% else %}
{{ helper.render_table(info_and_error_logs, true) }}
{{ helper.render_table(info_and_error_logs, 'info', true) }}
{% endif %}
</div>
</div>
Expand All @@ -92,7 +92,7 @@
<p>There are no log messages about deprecated features.</p>
</div>
{% else %}
{{ helper.render_table(deprecation_logs, false, true) }}
{{ helper.render_table(deprecation_logs, 'deprecation', false, true) }}
{% endif %}
</div>
</div>
Expand All @@ -106,7 +106,7 @@
<p>There are no log messages of this level.</p>
</div>
{% else %}
{{ helper.render_table(debug_logs) }}
{{ helper.render_table(debug_logs, 'debug') }}
{% endif %}
</div>
</div>
Expand All @@ -120,7 +120,7 @@
<p>There are no log messages of this level.</p>
</div>
{% else %}
{{ helper.render_table(silenced_logs) }}
{{ helper.render_table(silenced_logs, 'silenced') }}
{% endif %}
</div>
</div>
Expand All @@ -129,7 +129,7 @@
{% endif %}
{% endblock %}

{% macro render_table(logs, show_level = false, is_deprecation = false) %}
{% macro render_table(logs, category = '', show_level = false, is_deprecation = false) %}
{% import _self as helper %}
{% set channel_is_defined = (logs|first).channel is defined %}

Expand Down Expand Up @@ -160,31 +160,31 @@
<td class="font-normal text-small text-bold nowrap">{{ log.channel }}</td>
{% endif %}

<td class="font-normal">{{ helper.render_log_message(loop.index, log, is_deprecation) }}</td>
<td class="font-normal">{{ helper.render_log_message(category, loop.index, log, is_deprecation) }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% endmacro %}

{% macro render_log_message(log_index, log, is_deprecation = false) %}
{% macro render_log_message(category, log_index, log, is_deprecation = false) %}
{{ log.message }}

{% if is_deprecation %}
{% set stack = log.context.stack|default([]) %}
{% set id = 'sf-call-stack-' ~ log_index %}
{% set stack_id = 'sf-call-stack-' ~ category ~ '-' ~ log_index %}

{% if log.context.errorCount is defined %}
<span class="text-small text-bold">({{ log.context.errorCount }} times)</span>
{% endif %}

{% if stack %}
<button class="btn-link text-small sf-toggle" data-toggle-selector="#{{ id }}" data-toggle-alt-content="Hide stack trace">Show stack trace</button>
<button class="btn-link text-small sf-toggle" data-toggle-selector="#{{ stack_id }}" data-toggle-alt-content="Hide stack trace">Show stack trace</button>
{% endif %}

{% for index, call in stack if index > 1 %}
{% if index == 2 %}
<ul class="sf-call-stack hidden" id="{{ id }}">
<ul class="sf-call-stack hidden" id="{{ stack_id }}">
{% endif %}

{% if call.class is defined %}
Expand Down Expand Up @@ -212,11 +212,24 @@
{% endfor %}
{% else %}
{% if log.context is defined and log.context is not empty %}
<span class="metadata">
<strong>Context</strong>: {{ log.context|json_encode(64 b-or 256)|replace({
'{"' : '{ "', '"}' : '" }', '":{' : '": {', '":"' : '": "', '","' : '", "'
}) }}
</span>
{% set context_id = 'context-' ~ category ~ '-' ~ log_index %}
{% set context_dump = profiler_dump(log.context) %}

<div class="metadata">
<strong>Context</strong>:

{% if context_dump|length > 120 %}
{{ context_dump[:120] }} ...

<a class="btn-link text-small sf-toggle" data-toggle-selector="#{{ context_id }}" data-toggle-alt-content="Hide full context">Show full context</a>

<div id="{{ context_id }}" class="context">
<pre>{{ context_dump }}</pre>
</div>
{% else %}
{{ context_dump }}
{% endif %}
</div>
{% endif %}
{% endif %}
{% endmacro %}
8 changes: 8 additions & 0 deletions Resources/views/Profiler/profiler.css.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -816,6 +816,14 @@ table.logs .metadata {
table.logs .metadata strong {
color: #222;
}
table.logs .metadata .context {
background: #F5F5F5;
color: #222;
}
table.logs .metadata .context pre {
margin: 5px 0;
padding: 5px 10px;
}

table.logs .sf-call-stack {
margin: 1em 0 1em 1.5em;
Expand Down

0 comments on commit 69a6ef9

Please sign in to comment.