feature #27978 [WebProfilerBundle] Show relative path of the template and improving panel view (yceruto)
This PR was merged into the 4.2-dev branch.
Discussion
----------
[WebProfilerBundle] Show relative path of the template and improving panel view
| Q | A
| ------------- | ---
| Branch? | master
| Bug fix? | no
| New feature? | yes
| BC breaks? | no
| Deprecations? | no
| Tests pass? | yes
| Fixed tickets | #27911
| License | MIT
| Doc PR | -
| Before | After |
| --- | --- |
| ![twig-panel-before](https://user-images.githubusercontent.com/2028198/42819536-dfbed0c6-89a1-11e8-8eb1-8151172e1ad7.png) | ![twig-panel-after](https://user-images.githubusercontent.com/2028198/42819544-e5e73182-89a1-11e8-9d49-80e343040260.png) |
https://github.com/symfony/symfony/pull/27978#discussion_r203027281:
| Before | After |
| --- | --- |
| ![twig-toolbar-icon-before](https://user-images.githubusercontent.com/2028198/42820333-e35684c0-89a3-11e8-8b3a-f02bb835103c.png) | ![twig-toolbar-icon-after](https://user-images.githubusercontent.com/2028198/42820342-eac3a95e-89a3-11e8-929e-ef4fb1e392bb.png)
| ![twig-profiler-icon-before](https://user-images.githubusercontent.com/2028198/42820356-f3f04b72-89a3-11e8-9209-41ed37cf0915.png) | ![twig-profiler-icon-after](https://user-images.githubusercontent.com/2028198/42820370-fef24336-89a3-11e8-9b09-5ba1bf97df67.png) |
In addition, I added some visual improvements.
Commits
-------
bcd8058478
Show relative path of the template and improving panel view
This commit is contained in:
commit
7b853bb4cb
@ -25,17 +25,19 @@ class CodeExtension extends AbstractExtension
|
|||||||
private $fileLinkFormat;
|
private $fileLinkFormat;
|
||||||
private $rootDir;
|
private $rootDir;
|
||||||
private $charset;
|
private $charset;
|
||||||
|
private $projectDir;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @param string|FileLinkFormatter $fileLinkFormat The format for links to source files
|
* @param string|FileLinkFormatter $fileLinkFormat The format for links to source files
|
||||||
* @param string $rootDir The project root directory
|
* @param string $rootDir The project root directory
|
||||||
* @param string $charset The charset
|
* @param string $charset The charset
|
||||||
*/
|
*/
|
||||||
public function __construct($fileLinkFormat, string $rootDir, string $charset)
|
public function __construct($fileLinkFormat, string $rootDir, string $charset, string $projectDir = null)
|
||||||
{
|
{
|
||||||
$this->fileLinkFormat = $fileLinkFormat ?: ini_get('xdebug.file_link_format') ?: get_cfg_var('xdebug.file_link_format');
|
$this->fileLinkFormat = $fileLinkFormat ?: ini_get('xdebug.file_link_format') ?: get_cfg_var('xdebug.file_link_format');
|
||||||
$this->rootDir = str_replace('/', DIRECTORY_SEPARATOR, dirname($rootDir)).DIRECTORY_SEPARATOR;
|
$this->rootDir = str_replace('/', DIRECTORY_SEPARATOR, dirname($rootDir)).DIRECTORY_SEPARATOR;
|
||||||
$this->charset = $charset;
|
$this->charset = $charset;
|
||||||
|
$this->projectDir = $projectDir;
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -53,6 +55,7 @@ class CodeExtension extends AbstractExtension
|
|||||||
new TwigFilter('format_file_from_text', array($this, 'formatFileFromText'), array('is_safe' => array('html'))),
|
new TwigFilter('format_file_from_text', array($this, 'formatFileFromText'), array('is_safe' => array('html'))),
|
||||||
new TwigFilter('format_log_message', array($this, 'formatLogMessage'), array('is_safe' => array('html'))),
|
new TwigFilter('format_log_message', array($this, 'formatLogMessage'), array('is_safe' => array('html'))),
|
||||||
new TwigFilter('file_link', array($this, 'getFileLink')),
|
new TwigFilter('file_link', array($this, 'getFileLink')),
|
||||||
|
new TwigFilter('file_relative', array($this, 'getFileRelative')),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -209,6 +212,15 @@ class CodeExtension extends AbstractExtension
|
|||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public function getFileRelative(string $file): ?string
|
||||||
|
{
|
||||||
|
if (null !== $this->projectDir && 0 === strpos($file, $this->projectDir)) {
|
||||||
|
return ltrim(substr($file, \strlen($this->projectDir)), \DIRECTORY_SEPARATOR);
|
||||||
|
}
|
||||||
|
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
public function formatFileFromText($text)
|
public function formatFileFromText($text)
|
||||||
{
|
{
|
||||||
return preg_replace_callback('/in ("|")?(.+?)\1(?: +(?:on|at))? +line (\d+)/s', function ($match) {
|
return preg_replace_callback('/in ("|")?(.+?)\1(?: +(?:on|at))? +line (\d+)/s', function ($match) {
|
||||||
|
@ -23,6 +23,11 @@ class CodeExtensionTest extends TestCase
|
|||||||
$this->assertEquals($expected, $this->getExtension()->formatFile(__FILE__, 25));
|
$this->assertEquals($expected, $this->getExtension()->formatFile(__FILE__, 25));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public function testFileRelative()
|
||||||
|
{
|
||||||
|
$this->assertEquals('path/to/file.ext', $this->getExtension()->getFileRelative('/root/path/to/file.ext'));
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @dataProvider getClassNameProvider
|
* @dataProvider getClassNameProvider
|
||||||
*/
|
*/
|
||||||
@ -64,6 +69,6 @@ class CodeExtensionTest extends TestCase
|
|||||||
|
|
||||||
protected function getExtension()
|
protected function getExtension()
|
||||||
{
|
{
|
||||||
return new CodeExtension(new FileLinkFormatter('proto://%f#&line=%l&'.substr(__FILE__, 0, 5).'>foobar'), '/root', 'UTF-8');
|
return new CodeExtension(new FileLinkFormatter('proto://%f#&line=%l&'.substr(__FILE__, 0, 5).'>foobar'), '/root', 'UTF-8', '/root');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -85,6 +85,7 @@
|
|||||||
<argument type="service" id="debug.file_link_formatter" on-invalid="ignore" />
|
<argument type="service" id="debug.file_link_formatter" on-invalid="ignore" />
|
||||||
<argument>%kernel.root_dir%</argument>
|
<argument>%kernel.root_dir%</argument>
|
||||||
<argument>%kernel.charset%</argument>
|
<argument>%kernel.charset%</argument>
|
||||||
|
<argument>%kernel.project_dir%</argument>
|
||||||
</service>
|
</service>
|
||||||
|
|
||||||
<service id="twig.extension.routing" class="Symfony\Bridge\Twig\Extension\RoutingExtension">
|
<service id="twig.extension.routing" class="Symfony\Bridge\Twig\Extension\RoutingExtension">
|
||||||
|
@ -75,11 +75,11 @@
|
|||||||
|
|
||||||
<h2>Rendered Templates</h2>
|
<h2>Rendered Templates</h2>
|
||||||
|
|
||||||
<table>
|
<table id="twig-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th scope="col">Template Name</th>
|
<th scope="col">Template Name & Path</th>
|
||||||
<th scope="col">Render Count</th>
|
<th class="num-col" scope="col">Render Count</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
@ -87,8 +87,20 @@
|
|||||||
<tr>
|
<tr>
|
||||||
{%- set file = collector.templatePaths[template]|default(false) -%}
|
{%- set file = collector.templatePaths[template]|default(false) -%}
|
||||||
{%- set link = file ? file|file_link(1) : false -%}
|
{%- set link = file ? file|file_link(1) : false -%}
|
||||||
<td>{% if link %}<a href="{{ link }}" title="{{ file }}">{{ template }}</a>{% else %}{{ template }}{% endif %}</td>
|
<td>
|
||||||
<td class="font-normal">{{ count }}</td>
|
<span class="sf-icon icon-twig">{{ include('@WebProfiler/Icon/twig.svg') }}</span>
|
||||||
|
{% if link %}
|
||||||
|
<a href="{{ link }}" title="{{ file }}">{{ template }}</a>
|
||||||
|
<div>
|
||||||
|
<a class="text-muted" href="{{ link }}" title="{{ file }}">
|
||||||
|
{{ file|file_relative|default(file) }}
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
{% else %}
|
||||||
|
{{ template }}
|
||||||
|
{% endif %}
|
||||||
|
</td>
|
||||||
|
<td class="font-normal num-col">{{ count }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</tbody>
|
</tbody>
|
||||||
|
@ -1,5 +1,3 @@
|
|||||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="24" height="24" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
|
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="24" height="24" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
|
||||||
<path fill="#AAAAAA" d="M20.1,1H3.9C2.3,1,1,2.3,1,3.9v16.3C1,21.7,2.3,23,3.9,23h16.3c1.6,0,2.9-1.3,2.9-2.9V3.9
|
<path fill="#AAAAAA" d="m8.932327,22.491763c0.015209,-6.448229 -0.971579,-11.295129 -5.994828,-11.618392c4.689807,-0.35251 7.112354,2.633007 9.29714,6.906552c-0.030468,-11.426311 -2.352459,-16.227324 -7.433672,-16.482536c7.433365,0.069108 10.027703,5.898928 11.508208,14.292954c1.170879,-2.282766 3.560547,-5.553431 5.347074,-1.361535c-1.59464,-2.040144 -3.607126,-1.61697 -3.978662,8.261983l-8.744646,0.000107z"/>
|
||||||
C23,2.3,21.7,1,20.1,1z M21,20.1c0,0.5-0.4,0.9-0.9,0.9H3.9C3.4,21,3,20.6,3,20.1V3.9C3,3.4,3.4,3,3.9,3h16.3C20.6,3,21,3.4,21,3.9
|
|
||||||
V20.1z M5,5h14v3H5V5z M5,10h3v9H5V10z M10,10h9v9h-9V10z"/>
|
|
||||||
</svg>
|
</svg>
|
||||||
|
Before Width: | Height: | Size: 481 B After Width: | Height: | Size: 595 B |
@ -186,6 +186,11 @@ table tbody ul {
|
|||||||
padding: 0 0 0 1em;
|
padding: 0 0 0 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
table thead th.num-col,
|
||||||
|
table tbody td.num-col {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
{# Utility classes
|
{# Utility classes
|
||||||
========================================================================= #}
|
========================================================================= #}
|
||||||
.block {
|
.block {
|
||||||
@ -852,6 +857,10 @@ tr.status-warning td {
|
|||||||
#twig-dump pre {
|
#twig-dump pre {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
line-height: 1.7;
|
line-height: 1.7;
|
||||||
|
background-color: #fff;
|
||||||
|
border: 1px solid #E0E0E0;
|
||||||
|
padding: 15px;
|
||||||
|
box-shadow: 0 0 1px rgba(128, 128, 128, .2);
|
||||||
}
|
}
|
||||||
#twig-dump span {
|
#twig-dump span {
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
@ -861,6 +870,23 @@ tr.status-warning td {
|
|||||||
#twig-dump .status-warning { background: rgba(240, 181, 24, 0.3); }
|
#twig-dump .status-warning { background: rgba(240, 181, 24, 0.3); }
|
||||||
#twig-dump .status-success { background: rgba(100, 189, 99, 0.2); }
|
#twig-dump .status-success { background: rgba(100, 189, 99, 0.2); }
|
||||||
|
|
||||||
|
#twig-table tbody td {
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
#twig-table tbody td > a {
|
||||||
|
margin-left: -5px;
|
||||||
|
}
|
||||||
|
#twig-table tbody td div {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-twig {
|
||||||
|
vertical-align: text-bottom;
|
||||||
|
}
|
||||||
|
.icon-twig svg path {
|
||||||
|
fill: #7eea12;
|
||||||
|
}
|
||||||
|
|
||||||
{# Logger panel
|
{# Logger panel
|
||||||
========================================================================= #}
|
========================================================================= #}
|
||||||
table.logs .metadata {
|
table.logs .metadata {
|
||||||
|
@ -20,7 +20,7 @@
|
|||||||
"symfony/config": "^4.2",
|
"symfony/config": "^4.2",
|
||||||
"symfony/http-kernel": "~4.1",
|
"symfony/http-kernel": "~4.1",
|
||||||
"symfony/routing": "~3.4|~4.0",
|
"symfony/routing": "~3.4|~4.0",
|
||||||
"symfony/twig-bundle": "^3.4.3|^4.0.3",
|
"symfony/twig-bundle": "~4.2",
|
||||||
"symfony/var-dumper": "~3.4|~4.0",
|
"symfony/var-dumper": "~3.4|~4.0",
|
||||||
"twig/twig": "~1.34|~2.4"
|
"twig/twig": "~1.34|~2.4"
|
||||||
},
|
},
|
||||||
|
Reference in New Issue
Block a user