Feeling Lucky
a11y
NPM Resource Changed
?
[#38401] - template override diff - a11y ux
- Closed
- 21 Oct 2022
- Medium
- Build: 4.2-dev
- # 38401
- Diff
- brianteeman:diff
User tests: Successful: Unsuccessful:
Summary of Changes
The "Diff between original and overridden file" uses color alone to indicate the changes.
- This is an accessibility failure as you should never rely on a single visual indicator for sighted users.
- This is an accessibility failure as there is no indicator at all for non-sighted users.
- This is a UX failure as some users (#35381) have reported they expected the red/green to be reversed
- This is a semantic failure as we should use the
<del>and<ins>elements as they are specifically created for diffs to indicate text added and removed
This PR addresses all these failures by
- adding a plus or minus symbol at the beginning of the line
- using the del/ins elements instead of the span
- uses the browser defauly styling for these elements of strikethrough and underline
Testing Instructions
This is a js change so either use a prebuilt package or npm run build:js
Create a template override and make some changes.
Save the override and then display the differences.
Before
After
Note
js isn't my thing so maybe it can be improved cc @Fedik
| Status | New | ⇒ | Pending |
joomla-cms-bot
- | Category | ⇒ | JavaScript Repository NPM Change |
| Labels |
Added:
a11y
NPM Resource Changed
?
|
||
| Status | Pending | ⇒ | Closed |
| Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2022-10-21 19:39:42 |
| Closed_By | ⇒ | brianteeman |
In the 5 months since this was created and completed ignored by the @joomla/joomla-accessibility-team-jat it has been superceded by #38823