elementor / elementor/elementor

[Accessibility bug] Keyboard navigation skips dropdown menu if the menu item has an empty URL

Open
#16,364 1 comment 1 reaction 0 assignees View on GitHub
Dominant language
PHP
Stars
7.1k
Forks
1.6k
Avg merge
1d 5h
Merged PRs (30d)
193

Description

## Prerequisites

- [x] I have searched for similar issues in both open and closed tickets and cannot find a duplicate.
- [x] The issue still exists against the latest stable version of Elementor.

## Description

When using keyboard navigation with the tab key, (at least) custom link top-level menu items with dropdown are skipped if their URL field is empty, making the dropdown items completely inaccessible.

[VIDEO DEMO](https://i.gyazo.com/caa4b08a6e08bc89a2116dc2786b49f7.mp4)

## Steps to reproduce

1. Create an elementor menu with a dropdown; dropdown item must be a custom link with an empty URL field, like in [this screenshot](https://i.gyazo.com/9f28234cfe20369f8171c40ff3a21666.png).
2. Add a simple control menu item for testing, save the menu.
3. Add the menu to your test site with an Elementor menu widget.
4. Test the keyboard navigation with the tab key. If the bug persist, the dropdown menu items should be entirely skipped.

## Isolating the problem

- [x] This bug happens with only Elementor plugin active (and Elementor Pro).
- [x] This bug happens with a default WordPress theme active.
- [x] I can reproduce this bug consistently using the steps above.

## Potential solution
Add an empty `href` to dropdown menu items with empty URL field seems to solve the issue. As it is, such menu items do not have a `href` attribute, as shown in [this screenshot](https://i.gyazo.com/86a6d7005d6cfcfa6da4d3a8331d59b1.png).

## Environment

System Info

== Server Environment ==
Operating System: Linux
Software: LiteSpeed
MySQL version: MariaDB Server v10.3.29
PHP Version: 8.0.7
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: 5.8.1
Site URL: https://barbandcarole.ca
Home URL: https://barbandcarole.ca
WP Multisite: No
Max Upload Size: 512 MB
Memory limit: 512M
Permalink Structure: /%year%/%monthnum%/%day%/%postname%/
Language: en-CA
Timezone: America/Toronto
Debug Mode: Inactive

== Theme ==
Name: Hello Elementor Child
Version: 1.0.1
Author: Elementor Team
Child Theme: Yes
Parent Theme Name: Hello Elementor
Parent Theme Version: 2.4.1
Parent Theme Author: Elementor Team

== User ==
Role: administrator
WP Profile lang: en_CA
User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/93.0.4577.82 Safari/537.36

== Active Plugins ==
Advanced Custom Fields PRO
Version: 5.10.2
Author: Delicious Brains

Advanced Database Cleaner
Version: 3.0.3
Author: Younes JFR.

Asset CleanUp: Page Speed Booster
Version: 1.3.8.3
Author: Gabe Livan

Broken Link Checker
Version: 1.11.15
Author: WPMU DEV

Classic Editor
Version: 1.6.2
Author: WordPress Contributors

Custom Post Type UI
Version: 1.9.2
Author: WebDevStudios

Duplicator Pro
Version: 4.0.4.1
Author: Snap Creek

Elementor
Version: 3.4.4
Author: Elementor.com

Elementor Pro
Version: 3.4.1
Author: Elementor.com

Enable Media Replace
Version: 3.5.0
Author: ShortPixel

Export Media Library
Version: 3.0.1
Author: Mass Edge Inc.

Image optimization service by Optimole
Version: 3.1.3
Author: Optimole

Lightweight Subscribe To Comments
Version: 1.5.8
Author: Isabel Castillo

LiteSpeed Cache
Version: 4.4.1
Author: LiteSpeed Technologies

Phoenix Media Rename
Version: 3.4.2
Author: crossi72

Post Views Counter
Version: 1.3.6
Author: Digital Factory

Simple Custom Post Order
Version: 2.5.6
Author: Colorlib

Site Kit by Google
Version: 1.41.0
Author: Google

SVG Support
Version: 2.3.19
Author: Benbodhi

The SEO Framework
Version: 4.1.5.1
Author: The SEO Framework Team

Wordfence Security
Version: 7.5.5
Author: Wordfence

WordPress Popular Posts
Version: 5.4.2
Author: Hector Cabrera

WP-Sweep
Version: 1.1.5
Author: Lester 'GaMerZ' Chan

Yoast Duplicate Post
Version: 4.1.2
Author: Enrico Battocchi & Team Yoast

== Elementor - Compatibility Tag ==

Elementor Pro: Compatible

== Elementor Pro - Compatibility Tag ==

== Elements Usage ==

archive : 3
button : 5
form : 1
heading : 7
html : 10
image : 3
shortcode : 5
spacer : 1
text-editor : 5
theme-archive-title : 1
footer : 1
form : 1
heading : 7
image : 4
shortcode : 4
social-icons : 1
text-editor : 6
header : 2
nav-menu : 1
social-icons : 1
theme-site-logo : 1
section : 4
button : 4
heading : 4
html : 6
image : 2
text-editor : 4
widget : 0
html : 2
image-carousel : 1
shortcode : 1
social-icons : 1
wp-post : 4
image : 17
text-editor : 23
wp-page : 6
button : 26
counter : 2
divider : 2
form : 2
global : 1
heading : 49
html : 66
image : 18
media-carousel : 1
shortcode : 17
social-icons : 2
spacer : 10
text-editor : 35
single-post : 2
button : 2
form : 1
heading : 9
html : 9
post-comments : 1
post-navigation : 1
shortcode : 20
text-editor : 1
theme-post-content : 1
theme-post-featured-image : 1
video : 1
error-404 : 1
button : 1
heading : 2

== Log ==

Log: showing 20 of 432021-08-17 13:45:12 [info] Elementor data updater process has been completed. [array (
'plugin' => 'Elementor',
'from' => '3.3.1',
'to' => '3.4.0',
)]
2021-08-20 17:54:26 [info] elementor::elementor_updater Started
2021-08-20 17:54:26 [info] Elementor/Upgrades - _on_each_version Start
2021-08-20 17:54:27 [info] Elementor data updater process has been queued. [array (
'plugin' => 'Elementor',
'from' => '3.4.0',
'to' => '3.4.2',
)]
2021-08-20 17:54:27 [info] Elementor/Upgrades - _on_each_version Finished
2021-08-20 17:54:27 [info] Elementor data updater process has been completed. [array (
'plugin' => 'Elementor',
'from' => '3.4.0',
'to' => '3.4.2',
)]
2021-08-25 04:54:12 [info] Elementor data updater process has been completed. [array (
'plugin' => 'Elementor Pro',
'from' => '3.3.7',
'to' => '3.3.8',
)]
2021-08-31 04:55:28 [info] elementor::elementor_updater Started
2021-08-31 04:55:28 [info] Elementor/Upgrades - _on_each_version Start
2021-08-31 04:55:29 [info] Elementor/Upgrades - _on_each_version Finished
2021-08-31 04:55:29 [info] Elementor data updater process has been completed. [array (
'plugin' => 'Elementor',
'from' => '3.4.2',
'to' => '3.4.3',
)]
2021-08-31 04:55:29 [info] Elementor data updater process has been queued. [array (
'plugin' => 'Elementor',
'from' => '3.4.2',
'to' => '3.4.3',
)]
2021-08-31 04:57:41 [info] Elementor data updater process has been completed. [array (
'plugin' => 'Elementor Pro',
'from' => '3.3.8',
'to' => '3.4.0',
)]
2021-09-03 12:58:53 [info] Elementor data updater process has been completed. [array (
'plugin' => 'Elementor Pro',
'from' => '3.4.0',
'to' => '3.4.1',
)]
2021-09-09 17:56:12 [error] Save submission failed, db error: Table 'emrfro02_main.bcr_e_submissions' doesn't exist
2021-09-14 09:25:39 [info] Elementor data updater process has been queued. [array (
'plugin' => 'Elementor',
'from' => '3.4.3',
'to' => '3.4.4',
)]
2021-09-14 09:25:39 [info] elementor::elementor_updater Started
2021-09-14 09:25:39 [info] Elementor/Upgrades - _on_each_version Start
2021-09-14 09:25:40 [info] Elementor/Upgrades - _on_each_version Finished
2021-09-14 09:25:40 [info] Elementor data updater process has been completed. [array (
'plugin' => 'Elementor',
'from' => '3.4.3',
'to' => '3.4.4',
)]

Contributor guide

Open the contributing guide

Research direction

No source file or test is named in the issue. Start by reproducing the keyboard-navigation failure in the Elementor menu widget with a dropdown item whose custom-link URL is empty; done means Tab navigation reaches the dropdown items instead of skipping them.

Written by the indexing model from the issue text.

Assessment

Tech stack
php, wordpress
Domain
accessibility, frontend, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.