elementor / elementor/elementor
Accessible Keyboard Navigation Missing in Elementor Tabs Widget
- Dominant language
- PHP
- Stars
- 7.1k
- Forks
- 1.6k
- Avg merge
- 1d 5h
- Merged PRs (30d)
- 193
Description
### Description
When using the Elementor Tabs Widget, tab buttons do not support arrow key navigation as expected for accessible tab interfaces.
### Steps to reproduce
1. Add a Tabs Widget to a page.
2. Preview the page in a browser.
3. Use the Tab key to focus on the first tab button.
4. Try using the left and right arrow keys to navigate between tab buttons.
### Expected behavior
When a tab is focused, pressing the left or right arrow keys should move focus between tabs in a loop and update the active tab content, enabling proper keyboard navigation.
### Elementor System Info
```txt
== Server Environment ==
Operating System: Linux
Software: Apache
MySQL version: (Ubuntu) v8.0.42
PHP Version: 8.2.28
PHP Memory Limit: 512M
PHP Max Input Vars: 10000
PHP Max Post Size: 512M
GD Installed: Yes
ZIP Installed: Yes
Write Permissions: All right
Elementor Library: Connected
== WordPress Environment ==
Version: 6.8.1
Site URL: ***
Home URL: ***
WP Multisite: No
Max Upload Size: 512 MB
Memory limit: 512M
Max Memory limit: 512M
Permalink Structure: /blog/%postname%/
Language: de_DE
Timezone: Europe/Berlin
Admin Email: ***
Debug Mode: Active
== Theme ==
Name: ***
Version: 1.0
Author: ***
Child Theme: Yes
Parent Theme Name: Hello Elementor
Parent Theme Version: 3.4.0
Parent Theme Author: Elementor Team
== User ==
Role: administrator
WP Profile lang: de
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/138.0.0.0 Safari/537.36
== Active Plugins ==
Advanced Custom Fields PRO
Version: 6.4.0.1
Author: WP Engine
Duplicate Page
Version: 4.5.5
Author: mndpsingh287
Elementor
Version: 3.30.2
Author: Elementor.com
Elementor Pro
Version: 3.30.0
Author: Elementor.com
Table Field Add-on for ACF and SCF
Version: 1.3.29
Author: Johann Heyne
== Elemente Verwendung ==
archive : 2
container : 14
heading : 4
loop-grid : 2
nested-accordion : 1
nested-tabs : 1
spacer : 1
text-editor : 5
footer : 2
button : 1
container : 31
form : 2
heading : 11
icon-list : 2
image : 4
mega-menu : 2
nested-tabs : 1
social-icons : 4
spacer : 4
text-editor : 8
header : 1
container : 7
html : 1
image : 2
mega-menu : 2
popup : 4
button : 2
container : 55
heading : 16
html : 2
icon : 14
icon-list : 2
image : 6
mega-menu : 4
share-buttons : 1
social-icons : 2
text-editor : 11
wp-post : 7
button : 14
container : 147
heading : 49
icon : 21
post-info : 7
spacer : 35
text-editor : 28
theme-post-featured-image : 7
wp-page : 7
button : 12
container : 183
form : 2
heading : 84
html : 1
icon : 1
image : 46
nested-accordion : 4
nested-carousel : 2
nested-tabs : 1
spacer : 9
text-editor : 99
single-post : 1
container : 4
heading : 2
spacer : 1
text-editor : 1
theme-post-content : 1
theme-post-featured-image : 1
loop-item : 2
button : 1
container : 3
heading : 2
theme-post-excerpt : 1
theme-post-featured-image : 2
theme-post-title : 2
== Einstellungen ==
cpt_support: post, page
allow_tracking: yes
unfiltered_files_upload: 1
font_display: swap
== Eigenschaften ==
Custom Fonts: 1
Custom Icons: 0
== Integrations ==
== Elementor-Experimente ==
Inline-Schriftarten-Symbole: Standardmäßig aktiviert
Zusätzliche individuelle Breakpoints: Standardmäßig aktiviert
Container: Standardmäßig aktiviert
Optimized Markup: Standardmäßig deaktiviert
Default to New Theme Builder: Standardmäßig aktiviert
Header und Footer: Standardmäßig aktiviert
Verschachtelte Elemente: Standardmäßig aktiviert
Seiten Panel: Standardmäßig deaktiviert
Element Caching: Standardmäßig aktiviert
Elementor Home Screen: Standardmäßig aktiviert
Elementor Editor Events: Standardmäßig deaktiviert
Atomic Widgets: Standardmäßig deaktiviert
Globale Klassen: Standardmäßig deaktiviert
Enforce global classes capabilities: Standardmäßig aktiviert
Variablen: Standardmäßig deaktiviert
Cloud-Sammlung: Standardmäßig aktiviert
Editor v4 (Opt In Page): Standardmäßig aktiviert
Editor V4: Standardmäßig deaktiviert
Menü: Aktiv
== Protokoll ==
PHP: showing 5 of 5PHP: 2025-06-16 19:54:47 [warning X 16][***/wp-content/plugins/elementor/modules/history/revisions-manager.php::363] Undefined array key "editor_post_id" [array (
'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2025-06-16 21:16:19 [notice X 173][***/plugins/elementor/includes/base/controls-stack.php::230] hexdec(): Passing null to parameter #1 ($hex_string) of type string is deprecated [array (
'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2025-07-01 22:30:32 [warning X 43][***/wp-content/plugins/elementor-pro/core/app/modules/site-editor/data/endpoints/templates.php::150] Undefined array key "condition_type" [array (
'trace' => '
#0: ***/wp-content/plugins/elementor-pro/core/app/modules/site-editor/data/endpoints/templates.php(150): Elementor\Core\Logger\Manager -> rest_error_handler()
#1: ElementorPro\Core\App\Modules\SiteEditor\Data\Endpoints\Templates -> normalize_template_json_item()
#2: ***/wp-content/plugins/elementor-pro/core/app/modules/site-editor/data/endpoints/templates.php(120): class type array_map()
#3: ***/wp-content/plugins/elementor-pro/core/app/modules/site-editor/data/endpoints/templates.php(59): ElementorPro\Core\App\Modules\SiteEditor\Data\Endpoints\Templates -> normalize_templates_json()
#4: ***/wp-content/plugins/elementor/data/base/endpoint.php(156): ElementorPro\Core\App\Modules\SiteEditor\Data\Endpoints\Templates -> get_items()
',
)]
PHP: 2025-07-01 22:52:16 [warning X 4][***/wp-content/plugins/elementor-pro/modules/loop-filter/query/taxonomy-manager.php::150] Undefined array key "logicalJoin" [array (
'trace' => '
#0: ***/wp-content/plugins/elementor-pro/modules/loop-filter/query/taxonomy-manager.php(150): Elementor\Core\Logger\Manager -> rest_error_handler()
#1: ***/wp-content/plugins/elementor-pro/modules/loop-filter/query/taxonomy-query-builder.php(33): ElementorPro\Modules\LoopFilter\Query\Taxonomy_Manager -> get_hierarchy_of_selected_terms()
#2: ***/wp-content/plugins/elementor-pro/modules/loop-filter/module.php(123): ElementorPro\Modules\LoopFilter\Query\Taxonomy_Query_Builder -> get_merged_queries()
#3: ***/wp-includes/class-wp-hook.php(324): ElementorPro\Modules\LoopFilter\Module -> filter_loop_query()
#4: ***/wp-includes/plugin.php(205): WP_Hook -> apply_filters()
',
)]
PHP: 2025-07-08 03:42:55 [warning X 1][***/wp-content/plugins/elementor/core/page-assets/data-managers/font-icon-svg/font-awesome.php::50] Trying to access array offset on value of type null [array (
'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
JS: showing 9 of 9JS: 2025-06-16 18:55:25 [error X 11][***/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.29.2:3:667996] Cannot read properties of null (reading 'id')
JS: 2025-06-25 23:46:08 [error X 6][***/wp-content/plugins/elementor/assets/js/3ac06e8b9c2e8f04c57d.bundle.min.js:2:7612] Cannot read properties of null (reading 'dataset')
JS: 2025-06-29 14:05:59 [error X 3][***/wp-admin/load-scripts.php?c=0&loadchunk_0=jquery-core,jquery-migrate,utils,wp-dom-ready,wp-hooks&ver=6.8.1:2:28760] Cannot read properties of undefined (reading 'value')
JS: 2025-07-01 19:10:48 [error X 49][***/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.29.2:3:886259] Cannot read properties of undefined (reading 'localized')
JS: 2025-07-01 20:28:49 [error X 14][***/wp-content/plugins/elementor/assets/js/5fb5fb036b89b334cd2e.bundle.min.js:2:7739] Cannot read properties of undefined (reading 'view')
JS: 2025-07-01 20:58:09 [error X 1][***/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.3.1.1:10:23733] Cannot read properties of null (reading 'getOptions')
JS: 2025-07-02 07:53:44 [error X 40][***/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.30.0:3:690276] Failed to execute 'querySelector' on 'Document': '#' is not a valid selector.
JS: 2025-07-08 11:39:40 [error X 1][***/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.30.0:3:885882] Cannot read properties of undefined (reading 'toLowerCase')
JS: 2025-07-08 20:02:46 [error X 1][***/wp-content/plugins/elementor/assets/js/common-modules.min.js?ver=3.30.0:2:63978] elementor is not defined
Log: showing 20 of 202025-07-01 22:18:14 [info] elementor-pro::elementor_pro_updater Started
2025-07-01 22:18:14 [info] Elementor Pro/Upgrades - _on_each_version Start
2025-07-01 22:18:14 [info] Elementor Pro/Upgrades - _on_each_version Finished
2025-07-01 22:18:14 [info] Elementor Pro/Upgrades - _v_3_30_0_post_navigation_inline_icons Start
2025-07-01 22:18:15 [info] Elementor Pro/Upgrades - _v_3_30_0_post_navigation_inline_icons Finished
2025-07-01 22:18:15 [info] Elementor data updater process has been completed. [array (
'plugin' => 'Elementor Pro',
'from' => '3.29.2',
'to' => '3.30.0',
)]
2025-07-01 22:18:15 [info] Elementor data updater process has been queued. [array (
'plugin' => 'Elementor Pro',
'from' => '3.29.2',
'to' => '3.30.0',
)]
2025-07-01 22:18:55 [info] elementor::elementor_updater Started
2025-07-01 22:18:55 [info] Elementor/Upgrades - _on_each_version Start
2025-07-01 22:18:56 [info] Elementor data updater process has been queued. [array (
'plugin' => 'Elementor',
'from' => '3.29.2',
'to' => '3.30.0',
)]
2025-07-01 22:18:56 [info] Elementor/Upgrades - _on_each_version Finished
2025-07-01 22:18:56 [info] Elementor data updater process has been completed. [array (
'plugin' => 'Elementor',
'from' => '3.29.2',
'to' => '3.30.0',
)]
2025-07-10 23:58:54 [info] Elementor data updater process has been queued. [array (
'plugin' => 'Elementor',
'from' => '3.30.0',
'to' => '3.30.2',
)]
2025-07-10 23:58:54 [info] elementor::elementor_updater Started
2025-07-10 23:58:54 [info] Elementor/Upgrades - _on_each_version Start
2025-07-10 23:58:55 [info] Elementor/Upgrades - _on_each_version Finished
2025-07-10 23:58:55 [info] Elementor/Upgrades - _on_each_version Start
2025-07-10 23:58:55 [info] Elementor data updater process has been completed. [array (
'plugin' => 'Elementor',
'from' => '3.30.0',
'to' => '3.30.2',
)]
2025-07-10 23:58:56 [info] Elementor/Upgrades - _on_each_version Finished
2025-07-10 23:58:56 [info] Elementor data updater process has been completed. [array (
'plugin' => 'Elementor',
'from' => '3.30.0',
'to' => '3.30.2',
)]
== Elementor - Compatibility Tag ==
Elementor Pro: Kompatibel
== Elementor Pro - Compatibility Tag ==
```
### Agreement
- [x] I confirm I have read and followed all the guidelines and instructions outlined in the Elementor Bug Report form.
- [x] I agree that my issue may be closed without further action if it doesn't meet all the requirements outlined in the Elementor Bug Report form.
Contributor guide
Research direction
Reproduce the issue in a browser with the Elementor Tabs Widget, then trace the widget’s keyboard interaction implementation and its existing accessibility behavior. Done means left and right arrows move focus between tab buttons in a loop and update the active tab content without disrupting Tab-key focus.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- php
- Domain
- accessibility, frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 42/100