diff options
-rw-r--r-- | searx/templates/simple/filters/languages.html | 2 | ||||
-rw-r--r-- | searx/templates/simple/filters/safesearch.html | 8 | ||||
-rw-r--r-- | searx/templates/simple/filters/time_range.html | 2 | ||||
-rw-r--r-- | searx/templates/simple/infobox.html | 2 | ||||
-rw-r--r-- | searx/templates/simple/macros.html | 8 | ||||
-rw-r--r-- | searx/templates/simple/preferences.html | 50 | ||||
-rw-r--r-- | searx/templates/simple/results.html | 34 | ||||
-rw-r--r-- | searx/templates/simple/search.html | 10 | ||||
-rw-r--r-- | searx/templates/simple/simple_search.html | 8 | ||||
-rw-r--r-- | tests/unit/test_webapp.py | 2 |
10 files changed, 62 insertions, 64 deletions
diff --git a/searx/templates/simple/filters/languages.html b/searx/templates/simple/filters/languages.html index 710c18c92..0e778ebae 100644 --- a/searx/templates/simple/filters/languages.html +++ b/searx/templates/simple/filters/languages.html @@ -1,4 +1,4 @@ -<select class="language" id="language" name="language" tabindex="1">{{- '' -}} +<select class="language" id="language" name="language" aria-label="{{ _('Search language') }}">{{- '' -}} <option value="all" {% if current_language == 'all' %}selected="selected"{% endif %}>{{ _('Default language') }}</option> {%- for lang_id,lang_name,country_name,english_name in language_codes | sort(attribute=1) -%} <option value="{{ lang_id }}" {% if lang_id == current_language %}selected="selected"{% endif %}> diff --git a/searx/templates/simple/filters/safesearch.html b/searx/templates/simple/filters/safesearch.html index a146e6710..7d2a6b5b7 100644 --- a/searx/templates/simple/filters/safesearch.html +++ b/searx/templates/simple/filters/safesearch.html @@ -1,5 +1,5 @@ -<select name="safesearch" id="safesearch" class="safesearch" tabindex="3"> - <option value="2" {% if safesearch == '2' %}selected="selected"{% endif %}>{{ _("SafeSearch") + ": " + _('Strict') }}</option> - <option value="1" {% if safesearch == '1' %}selected="selected"{% endif %}>{{ _("SafeSearch") + ": " + _('Moderate') }}</option> - <option value="0" {% if safesearch == '0' %}selected="selected"{% endif %}>{{ _("SafeSearch") + ": " + _('None') }}</option> +<select name="safesearch" id="safesearch" class="safesearch" aria-label="{{ _('SafeSearch') }}"> + <option value="2" {% if safesearch == '2' %}selected="selected"{% endif %} aria-label="{{ _('Strict') }}">{{ _("SafeSearch") + ": " + _('Strict') }}</option> + <option value="1" {% if safesearch == '1' %}selected="selected"{% endif %} aria-label="{{ _('Moderate') }}">{{ _("SafeSearch") + ": " + _('Moderate') }}</option> + <option value="0" {% if safesearch == '0' %}selected="selected"{% endif %} aria-label="{{ _('None') }}">{{ _("SafeSearch") + ": " + _('None') }}</option> </select> diff --git a/searx/templates/simple/filters/time_range.html b/searx/templates/simple/filters/time_range.html index 2c85edf92..faf1ab419 100644 --- a/searx/templates/simple/filters/time_range.html +++ b/searx/templates/simple/filters/time_range.html @@ -1,4 +1,4 @@ -<select name="time_range" id="time_range" class="time_range" tabindex="2">{{- '' -}} +<select name="time_range" id="time_range" class="time_range" aria-label="{{ _('Time range') }}">{{- '' -}} <option id="time-range-anytime" value="" {{ "selected" if time_range=="" or not time_range else ""}}> {{- _('Anytime') -}} </option>{{- '' -}} diff --git a/searx/templates/simple/infobox.html b/searx/templates/simple/infobox.html index 24e0920b3..bb9dc8524 100644 --- a/searx/templates/simple/infobox.html +++ b/searx/templates/simple/infobox.html @@ -1,4 +1,4 @@ -<aside class="infobox"> +<aside class="infobox" aria-label="{{ infobox.infobox }}"> <h2><bdi>{{ infobox.infobox }}</bdi></h2> {% if infobox.img_src %}<img src="{{ image_proxify(infobox.img_src) }}" title="{{ infobox.infobox|striptags }}" alt="{{ infobox.infobox|striptags }}">{%- endif -%} <p><bdi>{{ infobox.content | safe }}</bdi></p> diff --git a/searx/templates/simple/macros.html b/searx/templates/simple/macros.html index a751ce187..637966715 100644 --- a/searx/templates/simple/macros.html +++ b/searx/templates/simple/macros.html @@ -56,11 +56,9 @@ {%- endmacro -%} {%- macro tab_header(name, id, label) -%} -<input type="radio" name="{{ name }}" id="tab_{{ id }}"/> -<label for="tab_{{ id }}" role="tab" - aria-controls="panel{{ id }}">{{ label }}</label> -<section id="tab-content{{ id }}" role="tabpanel" - aria-labelledby="{{ label }}" aria-hidden="false"> +<input type="radio" name="{{ name }}" id="tab-{{ id }}"/> +<label id="tab-label-{{ label }}" for="tab-{{ id }}" role="tab" aria-controls="tab-content-{{ id }}">{{ label }}</label> +<section id="tab-content-{{ id }}" role="tabpanel" aria-labelledby="tab-label-{{ label }}" aria-hidden="false"> {%- endmacro -%} {%- macro tab_footer() -%} diff --git a/searx/templates/simple/preferences.html b/searx/templates/simple/preferences.html index 659e93f9a..84e1d6e77 100644 --- a/searx/templates/simple/preferences.html +++ b/searx/templates/simple/preferences.html @@ -112,23 +112,23 @@ {% endif %} {% if 'language' not in locked_preferences %} <fieldset> - <legend>{{ _('Search language') }}</legend> + <legend id="pref_language">{{ _('Search language') }}</legend> <p class="value">{{- '' -}} - <select name='language'>{{- '' -}} + <select name='language' aria-labelledby="pref_language" aria-describedby="desc_language">{{- '' -}} <option value="all" {% if current_language == 'all' %}selected="selected"{% endif %}>{{ _('Default language') }}</option> {%- for lang_id,lang_name,country_name,english_name in language_codes | sort(attribute=1) -%} <option value="{{ lang_id }}" {% if lang_id == current_language %}selected="selected"{% endif %}>{{ lang_name }} {% if country_name %}({{ country_name }}) {% endif %}- {{ lang_id }}</option> {%- endfor -%} </select>{{- '' -}} </p> - <div class="description">{{ _('What language do you prefer for search?') }}</div> + <div class="description" id="desc_language">{{ _('What language do you prefer for search?') }}</div> </fieldset> {% endif %} {% if 'autocomplete' not in locked_preferences %} <fieldset> - <legend>{{ _('Autocomplete') }}</legend> + <legend id="pref_autocomplete">{{ _('Autocomplete') }}</legend> <p class="value"> - <select name="autocomplete"> + <select name="autocomplete" aria-labelledby="pref_autocomplete"> <option value=""> - </option> {%- for backend in autocomplete_backends -%} <option value="{{ backend }}" {% if backend == autocomplete %}selected="selected"{% endif %}>{{ backend }}</option> @@ -140,9 +140,9 @@ {% endif %} {% if 'safesearch' not in locked_preferences %} <fieldset> - <legend>{{ _('SafeSearch') }}</legend> + <legend id="pref_safesearch">{{ _('SafeSearch') }}</legend> <p class="value"> - <select name='safesearch'> + <select name='safesearch' aria-labelledby="pref_safesearch"> <option value="2" {% if safesearch == '2' %}selected="selected"{% endif %}>{{ _('Strict') }}</option> <option value="1" {% if safesearch == '1' %}selected="selected"{% endif %}>{{ _('Moderate') }}</option> <option value="0" {% if safesearch == '0' %}selected="selected"{% endif %}>{{ _('None') }}</option> @@ -154,9 +154,9 @@ {{ plugin_preferences('general') }} {% if 'doi_resolver' not in locked_preferences %} <fieldset> - <legend>{{ _('Open Access DOI resolver') }}</legend> + <legend id="pref_doi_resolver">{{ _('Open Access DOI resolver') }}</legend> <p class="value"> - <select id='doi_resolver' name='doi_resolver'> + <select id='doi_resolver' name='doi_resolver' aria-labelledby="pref_doi_resolver"> {%- for doi_resolver_name,doi_resolver_url in doi_resolvers.items() -%} <option value="{{ doi_resolver_name }}" {% if doi_resolver_url == current_doi_resolver %}selected="selected"{% endif %}> {{- doi_resolver_name }} - {{ doi_resolver_url -}} @@ -168,9 +168,9 @@ </fieldset> {% endif %} <fieldset> - <legend>{{ _('Engine tokens') }}</legend> + <legend id="pref_tokens">{{ _('Engine tokens') }}</legend> <p class="value"> - <input name="tokens" type="text" autocomplete="off" spellcheck="false" autocorrect="off" value='{{ preferences.tokens.get_value() }}'/> + <input name="tokens" aria-labelledby="pref_tokens" type="text" autocomplete="off" spellcheck="false" autocorrect="off" value='{{ preferences.tokens.get_value() }}'/> </p> <p class="description">{{ _('Access tokens for private engines') }}</p> </fieldset> @@ -179,9 +179,9 @@ {{ tab_header('maintab', 'ui', _('User interface')) }} {% if 'locale' not in locked_preferences %} <fieldset> - <legend>{{ _('Interface language') }}</legend> + <legend id="pref_locale">{{ _('Interface language') }}</legend> <p class="value"> - <select name='locale'> + <select name='locale' aria-labelledby="pref_locale"> {%- for locale_id,locale_name in locales.items() | sort -%} <option value="{{ locale_id }}" {% if locale_id == current_locale %}selected="selected"{% endif %}>{{ locale_name }}</option> {%- endfor -%} @@ -192,9 +192,9 @@ {% endif %} {% if 'theme' not in locked_preferences %} <fieldset> - <legend>{{ _('Theme') }}</legend> + <legend id="pref_theme">{{ _('Theme') }}</legend> <p class="value"> - <select name="theme"> + <select name="theme" aria-labelledby="pref_theme"> {%- for name in themes -%} <option value="{{ name }}" {% if name == theme %}selected="selected"{% endif %}>{{ name }}</option> {%- endfor -%} @@ -203,9 +203,9 @@ <div class="description">{{ _('Change SearXNG layout') }}</div> </fieldset> <fieldset> - <legend>{{ _('Theme style') }}</legend> + <legend id="pref_simple_style">{{ _('Theme style') }}</legend> <p class="value"> - <select name="simple_style"> + <select name="simple_style" aria-labelledby="pref_simple_style"> {%- for name in ['auto', 'light', 'dark'] -%} <option value="{{ name }}" {% if name == preferences.get_value('simple_style') %}selected="selected"{% endif %}>{{ _(name) }}</option> {%- endfor -%} @@ -216,9 +216,9 @@ {% endif %} {% if 'results_on_new_tab' not in locked_preferences %} <fieldset> - <legend>{{ _('Results on new tabs') }}</legend> + <legend id="pref_results_on_new_tab">{{ _('Results on new tabs') }}</legend> <p class="value"> - <select name='results_on_new_tab'> + <select name='results_on_new_tab' aria-labelledby="pref_results_on_new_tab"> <option value="1" {% if results_on_new_tab %}selected="selected"{% endif %}>{{ _('On') }}</option> <option value="0" {% if not results_on_new_tab %}selected="selected"{% endif %}>{{ _('Off')}}</option> </select> @@ -244,9 +244,9 @@ {{ tab_header('maintab', 'privacy', _('Privacy')) }} {% if 'method' not in locked_preferences %} <fieldset> - <legend>{{ _('HTTP Method') }}</legend> + <legend id="pref_method">{{ _('HTTP Method') }}</legend> <p class="value"> - <select name='method'> + <select name='method' aria-labelledby="pref_method"> <option value="POST" {% if method == 'POST' %}selected="selected"{% endif %}>POST</option> <option value="GET" {% if method == 'GET' %}selected="selected"{% endif %}>GET</option> </select> @@ -256,9 +256,9 @@ {% endif %} {% if 'image_proxy' not in locked_preferences %} <fieldset> - <legend>{{ _('Image proxy') }}</legend> + <legend id="pref_image_proxy">{{ _('Image proxy') }}</legend> <p class="value"> - <select name='image_proxy'> + <select name='image_proxy' aria-labelledby="pref_image_proxy"> <option value="1" {% if image_proxy %}selected="selected"{% endif %}>{{ _('Enabled') }}</option> <option value="" {% if not image_proxy %}selected="selected"{% endif %}>{{ _('Disabled') }}</option> </select> @@ -268,9 +268,9 @@ {% endif %} {% if 'query_in_title' not in locked_preferences %} <fieldset> - <legend>{{ _("Query in the page's title") }}</legend> + <legend id="pref_query_in_title">{{ _("Query in the page's title") }}</legend> <p class="value"> - <select name='query_in_title'> + <select name='query_in_title' aria-labelledby="pref_query_in_title"> <option value="1" {% if query_in_title %}selected="selected"{% endif %}>{{ _('Enabled') }}</option> <option value="" {% if not query_in_title %}selected="selected"{% endif %}>{{ _('Disabled') }}</option> </select> diff --git a/searx/templates/simple/results.html b/searx/templates/simple/results.html index ee47db662..eb45ac742 100644 --- a/searx/templates/simple/results.html +++ b/searx/templates/simple/results.html @@ -20,7 +20,7 @@ <div id="results" class="{{ only_template }}"> {% if answers -%} - <div id="answers"><h4 class="title">{{ _('Answers') }} : </h4> + <div id="answers" role="complementary" aria-labelledby="answers-title"><h4 class="title" id="answers-title">{{ _('Answers') }} : </h4> {%- for answer in answers.values() -%} <div class="answer"> {% if answer.url %} @@ -64,8 +64,8 @@ {% endif %} {% if suggestions %} - <div id="suggestions"> - <h4 class="title">{{ _('Suggestions') }} : </h4> + <div id="suggestions" role="complementary" aria-labelledby="suggestions-title"> + <h4 class="title" id="suggestions-title">{{ _('Suggestions') }} : </h4> <div class="wrapper"> {% for suggestion in suggestions %} <form method="{{ method or 'POST' }}" action="{{ url_for('search') }}"> @@ -75,20 +75,20 @@ <input type="hidden" name="safesearch" value="{{ safesearch }}"> <input type="hidden" name="theme" value="{{ theme }}"> {% if timeout_limit %}<input type="hidden" name="timeout_limit" value="{{ timeout_limit|e }}" >{% endif %} - <input type="submit" class="suggestion" value="• {{ suggestion.title }}"> + <input type="submit" class="suggestion" role="link" value="• {{ suggestion.title }}"> </form> {% endfor %} </div> </div> {% endif %} - <div id="search_url"> - <h4 class="title">{{ _('Search URL') }} :</h4> + <div id="search_url" role="complementary" aria-labelledby="search_url-title"> + <h4 class="title" id="search_url-title">{{ _('Search URL') }} :</h4> <div class="selectable_url"><pre>{{ url_for('search', _external=True) }}?q={{ q|urlencode }}&language={{ current_language }}&time_range={{ time_range }}&safesearch={{ safesearch }}{% if pageno > 1 %}&pageno={{ pageno }}{% endif %}{% if selected_categories %}&categories={{ selected_categories|join(",") | replace(' ','+') }}{% endif %}{% if timeout_limit %}&timeout_limit={{ timeout_limit|urlencode }}{% endif %}</pre></div> </div> - <div id="apis"> + <div id="apis" role="complementary" aria-labelledby="apis-title"> {% if search_formats %} - <h4 class="title">{{ _('Download results') }}</h4> + <h4 class="title" id="apis-title">{{ _('Download results') }}</h4> {% for output_type in search_formats %} <div class="left"> <form method="{{ method or 'POST' }}" action="{{ url_for('search') }}"> @@ -102,7 +102,7 @@ <input type="hidden" name="safesearch" value="{{ safesearch }}"> <input type="hidden" name="format" value="{{ output_type }}"> {% if timeout_limit %}<input type="hidden" name="timeout_limit" value="{{ timeout_limit|e }}" >{% endif %} - <input type="submit" value="{{ output_type }}"> + <input type="submit" role="link" value="{{ output_type }}"> </form> </div> {% endfor %} @@ -111,8 +111,8 @@ </div> {% if corrections %} - <div id="corrections"> - <h4>{{ _('Try searching for:') }}</h4> + <div id="corrections" role="complementary" aria-labelledby="corrections-title"> + <h4 id="corrections-title">{{ _('Try searching for:') }}</h4> {% for correction in corrections %} <div class="left"> <form method="{{ method or 'POST' }}" action="{{ url_for('search') }}" role="navigation"> @@ -122,14 +122,14 @@ <input type="hidden" name="safesearch" value="{{ safesearch }}"> <input type="hidden" name="theme" value="{{ theme }}"> {% if timeout_limit %}<input type="hidden" name="timeout_limit" value="{{ timeout_limit }}" >{% endif %} - <input type="submit" value="{{ correction.title }}"> + <input type="submit" role="link" value="{{ correction.title }}"> </form> </div> {% endfor %} </div> {% endif %} - <div id="urls"> + <div id="urls" role="main"> {% for result in results %} {% if result.open_group and not only_template %}<div class="template_group_{{ result['template']|replace('.html', '') }}">{% endif %} {% set index = loop.index %} @@ -141,10 +141,10 @@ {% endif %} </div> <div id="backToTop"> - <a href="#">{{ icon_small('chevron-up-outline') }}</a> + <a href="#" aria-label="{{ _('Back to top') }}">{{ icon_small('chevron-up-outline') }}</a> </div> {% if paging %} - <nav id="pagination"> + <nav id="pagination" role="navigation"> {% if pageno > 1 %} <form method="{{ method or 'POST' }}" action="{{ url_for('search') }}" class="previous_page"> <div class="{% if rtl %}right{% else %}left{% endif %}"> @@ -159,7 +159,7 @@ <input type="hidden" name="safesearch" value="{{ safesearch }}" > <input type="hidden" name="theme" value="{{ theme }}" > {% if timeout_limit %}<input type="hidden" name="timeout_limit" value="{{ timeout_limit|e }}" >{% endif %} - <button type="submit">{{ icon_small('chevron-left') }} {{ _('Previous page') }}</button> + <button role="link" type="submit">{{ icon_small('chevron-left') }} {{ _('Previous page') }}</button> </div> </form> {% endif %} @@ -176,7 +176,7 @@ <input type="hidden" name="safesearch" value="{{ safesearch }}" > <input type="hidden" name="theme" value="{{ theme }}" > {% if timeout_limit %}<input type="hidden" name="timeout_limit" value="{{ timeout_limit|e }}" >{% endif %} - <button type="submit">{{ _('Next page') }} {{ icon_small('chevron-right') }}</button> + <button role="link" type="submit">{{ _('Next page') }} {{ icon_small('chevron-right') }}</button> </div> </form> </nav> diff --git a/searx/templates/simple/search.html b/searx/templates/simple/search.html index 1df55e782..fb0239ef4 100644 --- a/searx/templates/simple/search.html +++ b/searx/templates/simple/search.html @@ -1,13 +1,13 @@ -<form id="search" method="{{ method or 'POST' }}" action="{{ url_for('search') }}"> +<form id="search" method="{{ method or 'POST' }}" action="{{ url_for('search') }}" role="search"> <div id="search_header"> - <a id="search_logo" href="{{ url_for('index') }}"> + <a id="search_logo" href="{{ url_for('index') }}" tabindex="0" title="{{ _('Display the front page') }}"> <span hidden>SearXNG</span> {% include '__common__/searxng-wordmark.min.svg' without context %} </a> <div class="search_box"> - <input id="q" autofocus name="q" type="text" placeholder="{{ _('Search for...') }}" tabindex="1" autocomplete="off" spellcheck="false" dir="auto" {% if q %}value="{{ q }}"{% endif %} > - <button id="clear_search" type="button" tabindex="-1"><span class="hide_if_nojs">{{ icon_big('close') }}</span><span class="show_if_nojs">{{ _('clear') }}</span></button> - <button id="send_search" type="submit" tabindex="-1"><span class="hide_if_nojs">{{ icon_big('search-outline') }}</span><span class="show_if_nojs">{{ _('search') }}</span></button> + <input id="q" autofocus name="q" type="text" placeholder="{{ _('Search for...') }}" autocomplete="off" spellcheck="false" dir="auto" {% if q %}value="{{ q }}"{% endif %} > + <button id="clear_search" type="button" aria-label="{{ _('clear') }}"><span class="hide_if_nojs">{{ icon_big('close') }}</span><span class="show_if_nojs">{{ _('clear') }}</span></button> + <button id="send_search" type="submit" aria-label="{{ _('search') }}"><span class="hide_if_nojs">{{ icon_big('search-outline') }}</span><span class="show_if_nojs">{{ _('search') }}</span></button> </div> {% set display_tooltip = true %} {% include 'simple/categories.html' %} diff --git a/searx/templates/simple/simple_search.html b/searx/templates/simple/simple_search.html index 6a5cdd9e7..aa864f282 100644 --- a/searx/templates/simple/simple_search.html +++ b/searx/templates/simple/simple_search.html @@ -1,9 +1,9 @@ -<form id="search" method="{{ method or 'POST' }}" action="{{ url_for('search') }}"> +<form id="search" method="{{ method or 'POST' }}" action="{{ url_for('search') }}" role="search"> <div id="search_header"> <div class="search_box"> - <input id="q" autofocus name="q" type="text" placeholder="{{ _('Search for...') }}" tabindex="1" autocomplete="off" spellcheck="false" dir="auto" {% if q %}value="{{ q }}"{% endif %} > - <button id="clear_search" type="button" tabindex="-1"><span class="hide_if_nojs">{{ icon_big('close') }}</span><span class="show_if_nojs">{{ _('clear') }}</span></button> - <button id="send_search" type="submit" tabindex="-1"><span class="hide_if_nojs">{{ icon_big('search-outline') }}</span><span class="show_if_nojs">{{ _('search') }}</span></button> + <input id="q" autofocus name="q" type="text" placeholder="{{ _('Search for...') }}" autocomplete="off" spellcheck="false" dir="auto" {% if q %}value="{{ q }}"{% endif %} > + <button id="clear_search" type="button" aria-label="{{ _('clear') }}"><span class="hide_if_nojs">{{ icon_big('close') }}</span><span class="show_if_nojs">{{ _('clear') }}</span></button> + <button id="send_search" type="submit" aria-label="{{ _('search') }}"><span class="hide_if_nojs">{{ icon_big('search-outline') }}</span><span class="show_if_nojs">{{ _('search') }}</span></button> </div> </div> </form> diff --git a/tests/unit/test_webapp.py b/tests/unit/test_webapp.py index 872b8d014..c29fed0d4 100644 --- a/tests/unit/test_webapp.py +++ b/tests/unit/test_webapp.py @@ -194,7 +194,7 @@ class ViewsTestCase(SearxTestCase): self.assertIn( b'<input type="checkbox" id="checkbox_general" name="category_general" checked="checked"/>', result.data ) - self.assertIn(b'<legend>Interface language</legend>', result.data) + self.assertIn(b'<legend id="pref_locale">Interface language</legend>', result.data) def test_browser_locale(self): result = self.app.get('/preferences', headers={'Accept-Language': 'zh-tw;q=0.8'}) |