-
Notifications
You must be signed in to change notification settings - Fork 135
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Additional lesson preview accessibility #2828
base: dev
Are you sure you want to change the base?
Conversation
@@ -109,7 +109,7 @@ | |||
*/ | |||
get_tooltip: function( msg ) { | |||
var $el = $( '<div class="llms-tooltip" />' ); | |||
$el.append( '<div class="llms-tooltip-content">' + msg + '</div>' ); | |||
$el.append( '<div class="llms-tooltip-content" aria-hidden="true">' + msg + '</div>' ); |
Check warning
Code scanning / CodeQL
DOM text reinterpreted as HTML Medium
DOM text
Show autofix suggestion
Hide autofix suggestion
Copilot Autofix AI 4 days ago
To fix the problem, we need to ensure that the msg
variable is properly escaped before being inserted into the HTML. This can be achieved by using a function that escapes HTML special characters, thereby preventing any potential XSS attacks.
The best way to fix this without changing existing functionality is to create a utility function that escapes HTML special characters and use this function to sanitize the msg
variable before it is used in the HTML construction.
-
Copy modified line R112 -
Copy modified lines R115-R129
@@ -111,5 +111,20 @@ | ||
var $el = $( '<div class="llms-tooltip" />' ); | ||
$el.append( '<div class="llms-tooltip-content" aria-hidden="true">' + msg + '</div>' ); | ||
$el.append( '<div class="llms-tooltip-content" aria-hidden="true">' + this.escapeHtml(msg) + '</div>' ); | ||
return $el; | ||
}, | ||
|
||
/** | ||
* Escape HTML special characters in a string | ||
* | ||
* @param string str string to escape | ||
* @return string | ||
* @since 3.16.12 | ||
*/ | ||
escapeHtml: function( str ) { | ||
return str.replace(/&/g, '&') | ||
.replace(/</g, '<') | ||
.replace(/>/g, '>') | ||
.replace(/"/g, '"') | ||
.replace(/'/g, '''); | ||
}, | ||
|
Description
Adds tooltip text as a screen-reader only element and indicates the link is disabled when a lesson cannot be accessed.
Fixes #2827
How has this been tested?
Manually
Screenshots
CleanShot.2024-12-09.at.10.08.31.mp4
Checklist: