[fix] make /stats more CSP compliant - simple theme

Replace simple theme's *styles* (see below) by CSP compliant implementation in
``searx/static/themes/simple/less/stats.less`` ::

    ./simple/stats.html:26:  <table style="max-width: 1280px; margin: 0 auto 0 0;">
    ./simple/stats.html:28:  <th scope="col" style="width:20rem;">{{ th_sort('name', _("Engine name")) }}</th>
    ./simple/stats.html:29:  <th scope="col" style="width:7rem; text-align: right;">{{ th_sort('score', _('Scores')) }}</th>
    ./simple/stats.html:32:  <th scope="col" style="text-align: right;">{{ th_sort('reliability', _('Reliability')) }}</th>
    ./simple/stats.html:37:  <td style="text-align: right;">
    ./simple/stats.html:90:  <td style="text-align: right;"> {{ engine_reliabilities.get(engine_stat.name, {}).get('reliablity') }}</td>
    ./simple/stats.html:106: <table style="max-width: 1280px; margin: 1rem; border: 1px solid gray;">
    ./simple/stats.html:107: <tbody style="padding-top: 1rem;">
    ./simple/stats.html:110: <th scope="row" style="width: 10rem">{{ _('Exception') }}</th><td>{{ error.exception_classname }}</td>
    ./simple/stats.html:112: <th scope="row" style="width: 10rem">{{ _('Message') }}</th><td>{{ error.log_message }}</td>
    ./simple/stats.html:114: <th scope="row" style="width: 10rem">{{ _('Percentage') }}</th><td style="width: 10rem">{{ error.percentage }}</td>
    ./simple/stats.html:119: <span style="border-right: 1px solid gray; padding: 0 1rem 0 0; margin: 0 0 0 0.5rem;">{{ param }}</span>
    ./simple/stats.html:136: <th scope="col" style="width: 10rem">{{ _('Failed test') }}</th>

Reported-by: https://github.com/searxng/searxng/issues/57
Signed-off-by: Markus Heiser <markus.heiser@darmarit.de>
This commit is contained in:
Markus Heiser 2021-05-16 14:18:42 +02:00
parent cdfb4b7ff9
commit 0a6c488417
2 changed files with 65 additions and 18 deletions

View file

@ -1,3 +1,50 @@
#main_stats {
table {
margin: 0 auto 0 0;
}
table .engine-name {
width: 20rem;
}
table .engine-scores {
width: 7rem;
}
table .result-count {
}
table .response-time {
}
table .engine-reliability {
text-align: right;
}
table.engine-error {
max-width: 1280px;
margin: 1rem;
border: 1px solid gray;
}
table.engine-error th.engine-error-type,
table.engine-error td.engine-error-type,
failed-test {
width: 10rem;
}
table.engine-error span.log_parameters
{
border-right: 1px solid gray;
padding: 0 1rem 0 0;
margin: 0 0 0 0.5rem;
}
}
@media screen and (max-width: 75em) {
}
.bar-chart-value { .bar-chart-value {
width: 3em; width: 3em;
} }

View file

@ -23,18 +23,18 @@
{% if not engine_stats.get('time') %} {% if not engine_stats.get('time') %}
{{ _('There is currently no data available. ') }} {{ _('There is currently no data available. ') }}
{% else %} {% else %}
<table style="max-width: 1280px; margin: 0 auto 0 0;"> <table class="engine-stats">
<tr> <tr>
<th scope="col" style="width:20rem;">{{ th_sort('name', _("Engine name")) }}</th> <th scope="col" class="engine-name">{{ th_sort('name', _("Engine name")) }}</th>
<th scope="col" style="width:7rem; text-align: right;">{{ th_sort('score', _('Scores')) }}</th> <th scope="col" class="engine-scores">{{ th_sort('score', _('Scores')) }}</th>
<th scope="col">{{ th_sort('result_count', _('Result count')) }}</th> <th scope="col" class="result-count">{{ th_sort('result_count', _('Result count')) }}</th>
<th scope="col">{{ th_sort('time', _('Response time')) }}</th> <th scope="col" class="response-time">{{ th_sort('time', _('Response time')) }}</th>
<th scope="col" style="text-align: right;">{{ th_sort('reliability', _('Reliability')) }}</th> <th scope="col" class="engine-reliability">{{ th_sort('reliability', _('Reliability')) }}</th>
</tr> </tr>
{% for engine_stat in engine_stats.get('time', []) %} {% for engine_stat in engine_stats.get('time', []) %}
<tr> <tr>
<td><a href="{{ url_for('stats', engine=engine_stat.name|e) }}">{{ engine_stat.name }}</a></td> <td class="engine-name"><a href="{{ url_for('stats', engine=engine_stat.name|e) }}">{{ engine_stat.name }}</a></td>
<td style="text-align: right;"> <td class="engine-scores">
{% if engine_stat.score %} {% if engine_stat.score %}
<span aria-labelledby="{{engine_stat.name}}_score" >{{ engine_stat.score|round(1) }}</span> <span aria-labelledby="{{engine_stat.name}}_score" >{{ engine_stat.score|round(1) }}</span>
<div class="engine-tooltip" role="tooltip" id="{{engine_stat.name}}_score">{{- "" -}} <div class="engine-tooltip" role="tooltip" id="{{engine_stat.name}}_score">{{- "" -}}
@ -42,7 +42,7 @@
</div> </div>
{% endif %} {% endif %}
</td> </td>
<td> <td class="engine-result-count">
{%- if engine_stat.result_count -%} {%- if engine_stat.result_count -%}
<div class="bar-chart-value">{{- engine_stat.result_count | int -}}</div>{{- "" -}} <div class="bar-chart-value">{{- engine_stat.result_count | int -}}</div>{{- "" -}}
@ -51,7 +51,7 @@
</div> </div>
{%- endif -%} {%- endif -%}
</td> </td>
<td> <td class="response-time">
{%- if engine_stat.total -%} {%- if engine_stat.total -%}
<div class="bar-chart-value">{{- engine_stat.total | round(1) -}}</div>{{- "" -}} <div class="bar-chart-value">{{- engine_stat.total | round(1) -}}</div>{{- "" -}}
@ -89,7 +89,7 @@
</div> </div>
{%- endif -%} {%- endif -%}
</td> </td>
<td style="text-align: right;"> {{ engine_reliabilities.get(engine_stat.name, {}).get('reliablity') }}</td> <td class="engine-reliability"> {{ engine_reliabilities.get(engine_stat.name, {}).get('reliablity') }}</td>
</tr> </tr>
{% endfor %} {% endfor %}
</table> </table>
@ -105,20 +105,20 @@
{% set ns.first = false %} {% set ns.first = false %}
<h3>{% if secondary %}{{ _('Warnings') }}{% else %}{{ _('Errors and exceptions') }}{% endif %}</h3> <h3>{% if secondary %}{{ _('Warnings') }}{% else %}{{ _('Errors and exceptions') }}{% endif %}</h3>
{% endif %} {% endif %}
<table style="max-width: 1280px; margin: 1rem; border: 1px solid gray;"> <table class="engine-error">
<tbody style="padding-top: 1rem;"> <tbody>
<tr> <tr>
{%- if error.exception_classname -%} {%- if error.exception_classname -%}
<th scope="row" style="width: 10rem">{{ _('Exception') }}</th><td>{{ error.exception_classname }}</td> <th scope="row" class="engine-error-type">{{ _('Exception') }}</th><td>{{ error.exception_classname }}</td>
{%- elif error.log_message -%} {%- elif error.log_message -%}
<th scope="row" style="width: 10rem">{{ _('Message') }}</th><td>{{ error.log_message }}</td> <th scope="row" class="engine-error-type">{{ _('Message') }}</th><td>{{ error.log_message }}</td>
{%- endif -%} {%- endif -%}
<th scope="row" style="width: 10rem">{{ _('Percentage') }}</th><td style="width: 10rem">{{ error.percentage }}</td> <th scope="row" class="engine-error-type">{{ _('Percentage') }}</th><td class="engine-error-type">{{ error.percentage }}</td>
</tr> </tr>
{% if error.log_parameters and error.log_parameters != (None, None, None) %}<tr><th scope="row">{{ _('Parameter') }}</th>{{- '' -}} {% if error.log_parameters and error.log_parameters != (None, None, None) %}<tr><th scope="row">{{ _('Parameter') }}</th>{{- '' -}}
<td colspan="3"> <td colspan="3">
{%- for param in error.log_parameters -%} {%- for param in error.log_parameters -%}
<span style="border-right: 1px solid gray; padding: 0 1rem 0 0; margin: 0 0 0 0.5rem;">{{ param }}</span> <span class="log_parameters">{{ param }}</span>
{%- endfor -%} {%- endfor -%}
</td> </td>
</tr> </tr>
@ -135,7 +135,7 @@
<h3>{{ _('Checker') }}</h3> <h3>{{ _('Checker') }}</h3>
<table> <table>
<tr> <tr>
<th scope="col" style="width: 10rem">{{ _('Failed test') }}</th> <th scope="col" class="failed-test">{{ _('Failed test') }}</th>
<th scope="col">{{ _('Comment(s)') }}</th> <th scope="col">{{ _('Comment(s)') }}</th>
</tr> </tr>
{% for test_name, results in engine_reliabilities[selected_engine_name].checker.items() %} {% for test_name, results in engine_reliabilities[selected_engine_name].checker.items() %}