Click to expand the diff!
```diff
diff --git a/administrator/language/en-GB/plg_system_jooa11y.ini b/administrator/language/en-GB/plg_system_jooa11y.ini
index e061fc5a5ca7b..18c008803749c 100644
--- a/administrator/language/en-GB/plg_system_jooa11y.ini
+++ b/administrator/language/en-GB/plg_system_jooa11y.ini
@@ -4,17 +4,33 @@
; Note : All ini files need to be saved as UTF-8
PLG_SYSTEM_JOOA11Y="System - Joomla Accessibility Checker"
-PLG_SYSTEM_JOOA11Y_FIELD_CHECK_ROOT="Content Container"
-PLG_SYSTEM_JOOA11Y_FIELD_CHECK_ROOT_DESC="Landmark on the page that will be checked for accessibility. The default setting is the landmark main. Alternatives to landmarks are classes, elements or ARIA roles (eg #example, .example, [role=example])."
+PLG_SYSTEM_JOOA11Y_XML_DESCRIPTION="The Joomla Accessibility Checker visually highlights common accessibility and usability issues. Geared towards content authors, the plugin identifies errors or warnings and provides guidance on how to fix them. Please be aware that this plugin does not offer an exhaustive analysis of your website, nor does it automatically ensure your website's accessibility. It's important to select a template that is inherently accessible to ensure your site meets accessibility standards."
+PLG_SYSTEM_JOOA11Y_FIELD_CHECK_ROOT="Target Area to Check"
+PLG_SYSTEM_JOOA11Y_FIELD_CHECK_ROOT_DESC="Input a single selector to target a specific region of your website. The default setting is the landmark main. Alternatives to landmarks are classes, elements or ARIA roles (e.g. #main-content, .main, [role='main']). Input body to check the entire page."
PLG_SYSTEM_JOOA11Y_FIELD_CONTAINER_IGNORE="Ignore Regions"
PLG_SYSTEM_JOOA11Y_FIELD_CONTAINER_IGNORE_DESC="Ignore specific regions within the Content Container. Use commas to separate classes or elements (eg #ignore, .ignore)."
-PLG_SYSTEM_JOOA11Y_FIELD_READABILITY_ROOT="Readability Container"
-PLG_SYSTEM_JOOA11Y_FIELD_READABILITY_ROOT_DESC="Landmark on the page that will be checked for readability. The default setting is the landmark main. Alternatives to landmarks are classes, elements or ARIA roles (eg #example, .example, [role=example])."
+PLG_SYSTEM_JOOA11Y_FIELD_READABILITY_ROOT="Readability Target Area"
+PLG_SYSTEM_JOOA11Y_FIELD_READABILITY_ROOT_DESC="Landmark on the page that will be checked for readability. The default setting is the landmark main."
PLG_SYSTEM_JOOA11Y_FIELD_SHOW_ALWAYS="Show Always"
-PLG_SYSTEM_JOOA11Y_FIELD_SHOW_ALWAYS_DESC="Load the accessiblity checker on all pages. This is useful when developing the website but should not be left on when the website is live."
-PLG_SYSTEM_JOOA11Y_XML_DESCRIPTION="The Joomla Accessibility Checker visually highlights common accessibility and usability issues. Geared towards content authors, the plugin identifies errors or warnings and provides guidance on how to fix them."
+PLG_SYSTEM_JOOA11Y_FIELD_SHOW_ALWAYS_DESC="Load the accessiblity checker on all pages. This is useful when developing the website, but should not be left on when the website is live."
+PLG_SYSTEM_JOOA11Y_FIELD_ADDITIONAL_CHECKS="Additional Checks Always On"
+PLG_SYSTEM_JOOA11Y_FIELD_ADDITIONAL_CHECKS_DESC="Enabling this option will visually hide the toggle switches for Form Labels, Contrast, Links (Advanced) in the Settings panel."
+PLG_SYSTEM_JOOA11Y_FIELD_WEB_COMPONENTS="Web Components to Check"
+PLG_SYSTEM_JOOA11Y_FIELD_WEB_COMPONENTS_DESC="Provide a list of all known web components or containers with an open shadow DOM."
+PLG_SYSTEM_JOOA11Y_FIELD_CONTRAST="Contrast"
+PLG_SYSTEM_JOOA11Y_FIELD_CONTRAST_DESC="Show Contrast toggle in Settings panel. Check for WCAG 2.0 Level AA contrast issues between foreground text and background elements."
+PLG_SYSTEM_JOOA11Y_FIELD_FORM_LABELS="Form Labels"
+PLG_SYSTEM_JOOA11Y_FIELD_FORM_LABELS_DESC="Show Form Labels toggle in Settings panel. Check for form inputs missing a corresponding label. Not necessarily a content author issue, and usually not an issue when using a reputable, accessible forms plugin."
+PLG_SYSTEM_JOOA11Y_FIELD_LINKS_ADVANCED="Links (Advanced)"
+PLG_SYSTEM_JOOA11Y_FIELD_LINKS_ADVANCED_DESC="Show Links (Advanced) toggle in Settings panel. Check for additional issues such as: links that open in a new tab without warning, have identical names but different purpose, or points to a PDF and other files without warning."
+PLG_SYSTEM_JOOA11Y_FIELD_COLOUR_FILTER="Colour Filter"
+PLG_SYSTEM_JOOA11Y_FIELD_COLOUR_FILTER_DESC="Show Colour Filter toggle in Settings panel. Colour filters help identify colour combinations that may be difficult for people to distinguish."
+PLG_SYSTEM_JOOA11Y_FIELD_EXTRA_PROPS="Extra Properties"
+PLG_SYSTEM_JOOA11Y_FIELD_EXTRA_PROPS_DESC="Pass additional properties to customise. Provide a valid key/value pair. Refer to documentation."
+PLG_SYSTEM_JOOA11Y_KEY="Key"
+PLG_SYSTEM_JOOA11Y_VALUE="Value"
-;Global text
+; All the following strings are deprecated and will be removed with 6.0
PLG_SYSTEM_JOOA11Y_ALERT_CLOSE="Close"
PLG_SYSTEM_JOOA11Y_ALERT_TEXT="Alert"
PLG_SYSTEM_JOOA11Y_CONTAINER_LABEL="Accessibility Checker"
@@ -37,8 +53,6 @@ PLG_SYSTEM_JOOA11Y_SHORTCUT_TOOLTIP="Skip to issue"
PLG_SYSTEM_JOOA11Y_SHOW_OUTLINE="Show Outline"
PLG_SYSTEM_JOOA11Y_SHOW_SETTINGS="Show Settings"
PLG_SYSTEM_JOOA11Y_WARNING="Warning"
-
-;Readability panel.
PLG_SYSTEM_JOOA11Y_AVG_WORD_PER_SENTENCE="Average words per sentence:"
PLG_SYSTEM_JOOA11Y_COMPLEX_WORDS="Complex words:"
PLG_SYSTEM_JOOA11Y_DIFFICULT_READABILITY="Difficult"
@@ -47,16 +61,12 @@ PLG_SYSTEM_JOOA11Y_GOOD_READABILITY="Good"
PLG_SYSTEM_JOOA11Y_READABILITY="Readability:"
PLG_SYSTEM_JOOA11Y_TOTAL_WORDS="Words:"
PLG_SYSTEM_JOOA11Y_VERY_DIFFICULT_READABILITY="Very difficult"
-
-;Panel status
PLG_SYSTEM_JOOA11Y_PANEL_STATUS_BOTH="Accessibility Errors: %(errorCount). Accessibility Warnings: %(warningCount)."
PLG_SYSTEM_JOOA11Y_PANEL_STATUS_ERRORS="Accessibility Errors: %(errorCount)."
PLG_SYSTEM_JOOA11Y_PANEL_STATUS_HIDDEN="The item you are trying to view is not visible; it may be hidden or inside of an accordion or tab component. Here's a preview: "
PLG_SYSTEM_JOOA11Y_PANEL_STATUS_ICON="Total issues found: %(totalCount)"
PLG_SYSTEM_JOOA11Y_PANEL_STATUS_NONE="No accessibility errors found."
PLG_SYSTEM_JOOA11Y_PANEL_STATUS_WARNINGS="Accessibility Warnings: %(warningCount)."
-
-;Headings
PLG_SYSTEM_JOOA11Y_HEADING_EMPTY="Empty heading found! To fix, delete this line or change its format from Heading %(level) to Normal or Paragraph."
PLG_SYSTEM_JOOA11Y_HEADING_EMPTY_WITH_IMAGE="Heading has no text, but contains an image. If this is not a heading, change its format from Heading %(level) to Normal or Paragraph. Otherwise, please add alt text to the image if it is not decorative."
PLG_SYSTEM_JOOA11Y_HEADING_FIRST="The first heading on a page should usually be a Heading 1 or Heading 2. Heading 1 should be the start of the main content section, and is the main heading that describes the overall purpose of the page. Learn more about Heading Structure."
@@ -65,8 +75,6 @@ PLG_SYSTEM_JOOA11Y_HEADING_LONG_INFO="Character Count: %(headingLength)<
PLG_SYSTEM_JOOA11Y_HEADING_MISSING_ONE="Missing Heading 1. Heading 1 should be the start of the main content area, and is the main heading that describes the overall purpose of the page. Learn more about Heading Structure."
PLG_SYSTEM_JOOA11Y_HEADING_NON_CONSECUTIVE_LEVEL="Non-consecutive heading level used. Headings should never skip levels, or go from Heading %(prevLevel) to Heading %(level)."
PLG_SYSTEM_JOOA11Y_PANEL_HEADING_MISSING_ONE="Missing Heading 1!"
-
-;Link Text
PLG_SYSTEM_JOOA11Y_LINK_BEST_PRACTICES="Consider replacing the link text: %(error)"
PLG_SYSTEM_JOOA11Y_LINK_BEST_PRACTICES_DETAILS="
"Click here" places focus on mouse mechanics, when many people do not use a mouse or may be viewing this website on a mobile device. Consider using a different verb that relates to the task.
Avoid using HTML symbols as call to actions unless they are hidden to assistive technologies.
"
PLG_SYSTEM_JOOA11Y_LINK_EMPTY="Remove empty links without any text."
@@ -76,16 +84,12 @@ PLG_SYSTEM_JOOA11Y_LINK_STOPWORD="Link text may not be descriptive enough out of
PLG_SYSTEM_JOOA11Y_LINK_STOPWORD_TIP="Tip! Link text should always be clear, unique, and meaningful. Avoid common words like \"click here\"; or \"learn more\"."
PLG_SYSTEM_JOOA11Y_LINK_URL="Longer, less intelligible URLs used as link text might be difficult to listen to with assistive technology. In most cases, it is better to use human-readable text instead of the URL. Short URLs (such as a site's homepage) are okay."
PLG_SYSTEM_JOOA11Y_LINK_URL_TIP="Tip! Link text should always be clear, unique, and meaningful so it could be understood out of context."
-
-;Links Advanced
PLG_SYSTEM_JOOA11Y_FILE_TYPE_WARNING="Link points to a PDF or downloadable file (e.g. MP3, Zip, Word Doc) without warning. Indicate the file type within the link text. If it is a large file, consider including the file size."
PLG_SYSTEM_JOOA11Y_FILE_TYPE_WARNING_TIP="Example: Executive Report (PDF, 3MB)"
PLG_SYSTEM_JOOA11Y_LINK_IDENTICAL_NAME="Link has identical text as another link, although it points to a different page. Multiple links with the same text may cause confusion for people who use screen readers."
PLG_SYSTEM_JOOA11Y_LINK_IDENTICAL_NAME_TIP="Consider making the following link more descriptive to help distinguish it from other links: %(linkText)"
PLG_SYSTEM_JOOA11Y_NEW_TAB_WARNING="Link opens in a new tab or window without warning. Doing so can be disorienting, especially for people who have difficulty perceiving visual content. Secondly, it is not always a good practice to control someone's experience or make decisions for them. Indicate that the link opens in a new window within the link text."
PLG_SYSTEM_JOOA11Y_NEW_TAB_WARNING_TIP="Tip! Learn best practices: opening links in new browser windows and tabs."
-
-;Images
PLG_SYSTEM_JOOA11Y_HYPERLINK_ALT_LENGTH_MESSAGE="Alt text description on a linked image is too long. The alt text on linked images should describe where the link takes you, not a literal description of the image. Consider using the title of the page it links to as the alt text."
PLG_SYSTEM_JOOA11Y_HYPERLINK_ALT_LENGTH_MESSAGE_INFO="The alt text is %(altLength) characters: %(altText)"
PLG_SYSTEM_JOOA11Y_IMAGE_FIGURE_DECORATIVE="Image is marked as decorative and will be ignored by assistive technology."
@@ -117,8 +121,6 @@ PLG_SYSTEM_JOOA11Y_MISSING_ALT_LINK_MESSAGE="Image is being used as a link but i
PLG_SYSTEM_JOOA11Y_MISSING_ALT_MESSAGE="Missing alt text! If the image conveys a story, mood, or important information - be sure to describe the image."
PLG_SYSTEM_JOOA11Y_TEXT_UNDERLINE_WARNING="Underlined text can be confused with links."
PLG_SYSTEM_JOOA11Y_TEXT_UNDERLINE_WARNING_TIP="Consider using a different style such as <em>emphasis</em>."
-
-;Labels
PLG_SYSTEM_JOOA11Y_LABELS_ARIA_LABEL_INPUT_MESSAGE="Input has an accessible name, although please ensure there is a visible label too."
PLG_SYSTEM_JOOA11Y_LABELS_ARIA_LABEL_INPUT_MESSAGE_INFO="The accessible name for this input is: %(ariaLabel)"
PLG_SYSTEM_JOOA11Y_LABELS_INPUT_RESET_MESSAGE="Reset buttons should not be used unless specifically needed because they are easy to activate by mistake."
@@ -127,26 +129,18 @@ PLG_SYSTEM_JOOA11Y_LABELS_MISSING_IMAGE_INPUT_MESSAGE="Image button is missing a
PLG_SYSTEM_JOOA11Y_LABELS_MISSING_LABEL_MESSAGE="There is no label associated with this input. Please add an id to this input, and add a matching for attribute to the label."
PLG_SYSTEM_JOOA11Y_LABELS_NO_FOR_ATTRIBUTE_MESSAGE="There is no label associated with this input. Add a for attribute to the label that matches the id of this input."
PLG_SYSTEM_JOOA11Y_LABELS_NO_FOR_ATTRIBUTE_MESSAGE_INFO="The ID for this input is: id="%(t)""
-
-;Embedded content
PLG_SYSTEM_JOOA11Y_EMBED_AUDIO="Please ensure to provide a transcript for all podcasts. Providing transcripts for audio content is a mandatory Level A requirement. Transcripts support people who are D/deaf or hard-of-hearing, but can benefit everyone. Consider placing the transcript below or within an accordion panel."
PLG_SYSTEM_JOOA11Y_EMBED_GENERAL_WARNING="Unable to check embedded content. Please make sure that images have alt text, videos have captions, text has sufficient contrast, and interactive components are keyboard accessible."
PLG_SYSTEM_JOOA11Y_EMBED_MISSING_TITLE="Embedded content requires an accessible name that describes its contents. Please provide a unique title or aria-label attribute on the iframe element. Learn more about iFrames."
PLG_SYSTEM_JOOA11Y_EMBED_VIDEO="Please ensure all videos have closed captioning. Providing captions for all audio and video content is a mandatory Level A requirement. Captions support people who are D/deaf or hard-of-hearing."
-
-;Contrast
PLG_SYSTEM_JOOA11Y_CONTRAST_ERROR_INPUT_MESSAGE="The text within this input does not have enough contrast with the background. The contrast ratio should be at least 4.5:1 for normal text and 3:1 for large text."
PLG_SYSTEM_JOOA11Y_CONTRAST_ERROR_INPUT_MESSAGE_INFO="The contrast ratio is %(cratio)."
PLG_SYSTEM_JOOA11Y_CONTRAST_ERROR_MESSAGE="This text does not have enough contrast with the background. The contrast ratio should be at least 4.5:1 for normal text and 3:1 for large text."
PLG_SYSTEM_JOOA11Y_CONTRAST_ERROR_MESSAGE_INFO="The contrast ratio is %(cratio) for the following text: %(nodetext)"
PLG_SYSTEM_JOOA11Y_CONTRAST_WARNING_MESSAGE="The contrast of this text is unknown and needs to be manually reviewed. Ensure the text and the background have strong contrasting colours. The contrast ratio should be at least 4.5:1 for normal text and 3:1 for large text."
PLG_SYSTEM_JOOA11Y_CONTRAST_WARNING_MESSAGE_INFO="Please review contrast of the following text: %(nodetext)"
-
-;Readability
PLG_SYSTEM_JOOA11Y_READABILITY_NOT_ENOUGH_CONTENT_MESSAGE="Not enough content to calculate readability score."
PLG_SYSTEM_JOOA11Y_READABILITY_NO_P_OR_LI_MESSAGE="Unable to calculate readability score. No paragraph <p> or list content <li> found."
-
-;QA
PLG_SYSTEM_JOOA11Y_QA_BAD_ITALICS="Bold and italic tags have semantic meaning, and should not be used to highlight entire paragraphs. Bolded text should be used to provide strong emphasis on a word or phrase. Italics should be used to highlight proper names (i.e. book and article titles), foreign words, quotes. Long quotes should be formatted as a blockquote."
PLG_SYSTEM_JOOA11Y_QA_BAD_LINK="Bad link found. Link appears to point to a development environment. This link points to: %(el)"
PLG_SYSTEM_JOOA11Y_QA_BLOCKQUOTE_MESSAGE="Is this a heading? %(bqHeadingText)"
@@ -160,8 +154,6 @@ PLG_SYSTEM_JOOA11Y_QA_PDF_COUNT="PDFs are considered web content and must be mad
PLG_SYSTEM_JOOA11Y_QA_SHOULD_BE_LIST="Are you trying to create a list? Possible list item found: %(firstPrefix)"
PLG_SYSTEM_JOOA11Y_QA_SHOULD_BE_LIST_TIP="Make sure to use semantic lists by using the bullet or number formatting buttons instead. When using a semantic list, assistive technologies are able to convey information such as the total number of items and the relative position of each item in the list. Learn more about semantic lists."
PLG_SYSTEM_JOOA11Y_QA_UPPERCASE_WARNING="Found all caps. Some screen readers may interpret all caps text as an acronym and will read each letter individually. Additionally, some people find all caps more difficult to read and it may give the appearance of SHOUTING."
-
-;Tables
PLG_SYSTEM_JOOA11Y_TABLES_EMPTY_HEADING="Empty table header found! Table headers should never be empty. It is important to designate row and/or column headers to convey their relationship. This information provides context to people who use assistive technology. Please keep in mind that tables should be used for tabular data only."
PLG_SYSTEM_JOOA11Y_TABLES_EMPTY_HEADING_INFO="Learn more about accessible tables."
PLG_SYSTEM_JOOA11Y_TABLES_MISSING_HEADINGS="Missing table headers! Accessible tables need HTML markup that indicates header cells and data cells which defines their relationship. This information provides context to people who use assistive technology. Tables should be used for tabular data only."
diff --git a/administrator/language/en-GB/plg_system_jooa11y.sys.ini b/administrator/language/en-GB/plg_system_jooa11y.sys.ini
index 02519b0004979..9bac6ee47a022 100644
--- a/administrator/language/en-GB/plg_system_jooa11y.sys.ini
+++ b/administrator/language/en-GB/plg_system_jooa11y.sys.ini
@@ -4,4 +4,4 @@
; Note : All ini files need to be saved as UTF-8
PLG_SYSTEM_JOOA11Y="System - Joomla Accessibility Checker"
-PLG_SYSTEM_JOOA11Y_XML_DESCRIPTION="The Joomla Accessibility Checker visually highlights common accessibility and usability issues. Geared towards content authors, the plugin identifies errors or warnings and provides guidance on how to fix them."
+PLG_SYSTEM_JOOA11Y_XML_DESCRIPTION="The Joomla Accessibility Checker visually highlights common accessibility and usability issues. Geared towards content authors, the plugin identifies errors or warnings and provides guidance on how to fix them. Please be aware that this plugin does not offer an exhaustive analysis of your website, nor does it automatically ensure your website's accessibility. It's important to select a template that is inherently accessible to ensure your site meets accessibility standards."
diff --git a/build/build-modules-js/javascript/compile-to-es2017.es6.js b/build/build-modules-js/javascript/compile-to-es2017.es6.js
index 9dd93b4e0863c..84386773f3cde 100644
--- a/build/build-modules-js/javascript/compile-to-es2017.es6.js
+++ b/build/build-modules-js/javascript/compile-to-es2017.es6.js
@@ -53,13 +53,15 @@ const collectExternals = () => {
return;
}
- // Joomla modules
+ // Joomla and Vendor modules
externalModules.push(
'cropper-module',
'codemirror',
'joomla.dialog',
'editor-api',
'editor-decorator',
+ 'sa11y',
+ 'sa11y-lang',
);
// Codemirror modules
diff --git a/build/build-modules-js/settings.json b/build/build-modules-js/settings.json
index c9f7a04454e99..a655a2e7804e2 100644
--- a/build/build-modules-js/settings.json
+++ b/build/build-modules-js/settings.json
@@ -403,7 +403,7 @@
"hotkeys-js": {
"name": "hotkeysjs",
"licenseFilename": "LICENSE",
- "js" : {
+ "js": {
"dist/hotkeys.js": "js/hotkeys.js",
"dist/hotkeys.min.js": "js/hotkeys.min.js"
},
@@ -458,10 +458,6 @@
],
"licenseFilename": "LICENSE.txt"
},
- "@joomla/joomla-a11y-checker": {
- "name": "joomla-a11y-checker",
- "licenseFilename": "LICENSE.md"
- },
"joomla-ui-custom-elements": {
"name": "joomla-custom-elements",
"js": {
@@ -745,6 +741,66 @@
}
]
},
+ "sa11y": {
+ "name": "sa11y",
+ "licenseFilename": "LICENSE.md",
+ "js": {
+ "dist/js/sa11y.esm.min.js": "js/sa11y.esm.min.js",
+ "dist/js/lang/bg.js": "js/bg.js",
+ "dist/js/lang/cs.js": "js/cs.js",
+ "dist/js/lang/da.js": "js/da.js",
+ "dist/js/lang/de.js": "js/de.js",
+ "dist/js/lang/el.js": "js/el.js",
+ "dist/js/lang/en.js": "js/en.js",
+ "dist/js/lang/enUS.js": "js/enUS.js",
+ "dist/js/lang/es.js": "js/es.js",
+ "dist/js/lang/et.js": "js/et.js",
+ "dist/js/lang/fi.js": "js/fi.js",
+ "dist/js/lang/fr.js": "js/fr.js",
+ "dist/js/lang/hu.js": "js/hu.js",
+ "dist/js/lang/id.js": "js/id.js",
+ "dist/js/lang/it.js": "js/it.js",
+ "dist/js/lang/ja.js": "js/ja.js",
+ "dist/js/lang/ko.js": "js/ko.js",
+ "dist/js/lang/lt.js": "js/lt.js",
+ "dist/js/lang/lv.js": "js/lv.js",
+ "dist/js/lang/nb.js": "js/nb.js",
+ "dist/js/lang/nl.js": "js/nl.js",
+ "dist/js/lang/pl.js": "js/pl.js",
+ "dist/js/lang/ptBR.js": "js/ptBR.js",
+ "dist/js/lang/ptPT.js": "js/ptPT.js",
+ "dist/js/lang/ro.js": "js/ro.js",
+ "dist/js/lang/sk.js": "js/sk.js",
+ "dist/js/lang/sl.js": "js/sl.js",
+ "dist/js/lang/sv.js": "js/sv.js",
+ "dist/js/lang/tr.js": "js/tr.js",
+ "dist/js/lang/ua.js": "js/ua.js",
+ "dist/js/lang/zh.js": "js/zh.js"
+ },
+ "css": {
+ "dist/css/sa11y.min.css": "css/sa11y.min.css"
+ },
+ "provideAssets": [
+ {
+ "name": "sa11y",
+ "type": "script",
+ "uri": "sa11y.esm.min.js",
+ "importmap": true
+ },
+ {
+ "name": "sa11y-lang",
+ "type": "script",
+ "uri": "en.js",
+ "importmap": true,
+ "description": "A placeholder asset which is later initialised by plugin, depending on active language."
+ },
+ {
+ "name": "sa11y",
+ "type": "style",
+ "uri": "sa11y.min.css"
+ }
+ ]
+ },
"qrcode-generator": {
"name": "qrcode",
"js": {
@@ -793,7 +849,9 @@
"text": "It looks like you are trying to run Joomla! from our git repository. To do so requires you complete a couple of extra steps first.",
"link": "J4.x:Setting_Up_Your_Local_Environment",
"linkText": "More Details",
- "destFile": ["/templates/system/build_incomplete.html"]
+ "destFile": [
+ "/templates/system/build_incomplete.html"
+ ]
},
"unsupported": {
"title": "Joomla: unsupported PHP version",
@@ -801,7 +859,10 @@
"text": "Your host needs to use PHP version {{phpversion}} or newer to run this version of Joomla!",
"link": "J4.x:Unsupported_PHP_Version",
"linkText": "Help me resolve this",
- "destFile": ["/templates/system/incompatible.html", "/includes/incompatible.html"]
+ "destFile": [
+ "/templates/system/incompatible.html",
+ "/includes/incompatible.html"
+ ]
},
"noxml": {
"title": "Joomla: Missing PHP-XML library",
@@ -809,7 +870,9 @@
"text": "Your host needs to use PHP with support for the XML library to run this version of Joomla!",
"link": "J4.x:Missing_XML_Library",
"linkText": "Help me resolve this",
- "destFile": ["/media/system/html/noxml.html"]
+ "destFile": [
+ "/media/system/html/noxml.html"
+ ]
},
"fatal": {
"title": "An Error Occurred: {{statusText}}",
@@ -817,8 +880,10 @@
"text": "The server returned a \"{{statusCode_statusText}}\"",
"link": "J4.x:FatalError",
"linkText": "Help me resolve this",
- "destFile": ["/templates/system/fatal-error.html"]
+ "destFile": [
+ "/templates/system/fatal-error.html"
+ ]
}
}
}
-}
+}
\ No newline at end of file
diff --git a/build/media_source/plg_behaviour_compat/es5.asset.json b/build/media_source/plg_behaviour_compat/es5.asset.json
index fe0d8342c60ef..a2d72ce8e848b 100644
--- a/build/media_source/plg_behaviour_compat/es5.asset.json
+++ b/build/media_source/plg_behaviour_compat/es5.asset.json
@@ -650,7 +650,8 @@
"deprecated": true,
"uri": "",
"dependencies": [
- "core", "messages"
+ "core",
+ "messages"
],
"attributes": {
"nomodule": true,
diff --git a/build/media_source/plg_system_jooa11y/joomla.asset.json b/build/media_source/plg_system_jooa11y/joomla.asset.json
index 4f39991313bae..7ca6fa5ecbcd6 100644
--- a/build/media_source/plg_system_jooa11y/joomla.asset.json
+++ b/build/media_source/plg_system_jooa11y/joomla.asset.json
@@ -10,7 +10,9 @@
"type": "script",
"uri": "plg_system_jooa11y/jooa11y.min.js",
"dependencies": [
- "core"
+ "core",
+ "sa11y",
+ "sa11y-lang"
],
"attributes": {
"type": "module"
@@ -19,7 +21,12 @@
{
"name": "plg_system_jooa11y.jooa11y",
"type": "style",
- "uri": "plg_system_jooa11y/jooa11y.min.css"
+ "uri": "",
+ "deprecated": true,
+ "deprecatedMsg": "Use 'sa11y' style asset instead",
+ "dependencies": [
+ "sa11y"
+ ]
}
]
}
diff --git a/build/media_source/plg_system_jooa11y/js/jooa11y.es6.js b/build/media_source/plg_system_jooa11y/js/jooa11y.es6.js
index a244ba011caa1..b79cdd3e86a5c 100644
--- a/build/media_source/plg_system_jooa11y/js/jooa11y.es6.js
+++ b/build/media_source/plg_system_jooa11y/js/jooa11y.es6.js
@@ -1,17 +1,11 @@
-import { Jooa11y, Lang } from '@joomla/joomla-a11y-checker/dist/js/joomla-a11y-checker.esm.js';
+// eslint-disable-next-line import/no-unresolved
+import { Sa11y, Lang } from 'sa11y';
+// eslint-disable-next-line import/no-unresolved
+import Sa11yLang from 'sa11y-lang';
-if (!Joomla) {
- throw new Error('Joomla API is not properly initialised');
-}
-
-const stringPrefix = 'PLG_SYSTEM_JOOA11Y_';
-
-Lang.translate = (string) => Joomla.Text._(stringPrefix + string, string);
-
-const options = Joomla.getOptions('jooa11yOptions');
+Lang.addI18n(Sa11yLang.strings);
window.addEventListener('load', () => {
- // Instantiate
- const checker = new Jooa11y(options);
- checker.doInitialCheck();
+ // eslint-disable-next-line no-new
+ new Sa11y(Joomla.getOptions('jooa11yOptions', {}));
});
diff --git a/build/media_source/plg_system_jooa11y/scss/jooa11y.scss b/build/media_source/plg_system_jooa11y/scss/jooa11y.scss
deleted file mode 100644
index 187e9f18d634a..0000000000000
--- a/build/media_source/plg_system_jooa11y/scss/jooa11y.scss
+++ /dev/null
@@ -1 +0,0 @@
-@import "../../../../node_modules/@joomla/joomla-a11y-checker/dist/css/joomla-a11y-checker";
diff --git a/package-lock.json b/package-lock.json
index dab4646b970cc..5f85f0ed86522 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -51,6 +51,8 @@
"punycode": "^2.3.0",
"qrcode-generator": "^1.4.4",
"roboto-fontface": "^0.10.0",
+ "sa11y": "^3.0.8",
+ "sa11y": "^3.0.8",
"shepherd.js": "^11.2.0",
"short-and-sweet": "^1.0.4",
"skipto": "^4.1.7",
@@ -8354,6 +8356,22 @@
"tslib": "^2.1.0"
}
},
+ "node_modules/sa11y": {
+ "version": "3.0.8",
+ "resolved": "https://registry.npmjs.org/sa11y/-/sa11y-3.0.8.tgz",
+ "integrity": "sha512-muMZGhlDJ8wsT8OuZEBfdeVqCatyhtIUm5MaeatWqo4CWeLLZo9dXkvlBj4zZfKccKFhHMWzAFsAwM1KL1oMjw==",
+ "dependencies": {
+ "tippy.js": "^6.3.7"
+ }
+ },
+ "node_modules/sa11y": {
+ "version": "3.0.8",
+ "resolved": "https://registry.npmjs.org/sa11y/-/sa11y-3.0.8.tgz",
+ "integrity": "sha512-muMZGhlDJ8wsT8OuZEBfdeVqCatyhtIUm5MaeatWqo4CWeLLZo9dXkvlBj4zZfKccKFhHMWzAFsAwM1KL1oMjw==",
+ "dependencies": {
+ "tippy.js": "^6.3.7"
+ }
+ },
"node_modules/safe-array-concat": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.0.0.tgz",
@@ -10105,4 +10123,4 @@
}
}
}
-}
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index b1be20400d43c..09b42ffac5672 100644
--- a/package.json
+++ b/package.json
@@ -78,6 +78,7 @@
"punycode": "^2.3.0",
"qrcode-generator": "^1.4.4",
"roboto-fontface": "^0.10.0",
+ "sa11y": "^3.0.8",
"shepherd.js": "^11.2.0",
"short-and-sweet": "^1.0.4",
"skipto": "^4.1.7",
diff --git a/plugins/system/jooa11y/jooa11y.xml b/plugins/system/jooa11y/jooa11y.xml
index eb40c363d6ce3..aca1dca2c6f89 100644
--- a/plugins/system/jooa11y/jooa11y.xml
+++ b/plugins/system/jooa11y/jooa11y.xml
@@ -33,6 +33,66 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/plugins/system/jooa11y/src/Extension/Jooa11y.php b/plugins/system/jooa11y/src/Extension/Jooa11y.php
index dd64abc594710..91ddd9ef37614 100644
--- a/plugins/system/jooa11y/src/Extension/Jooa11y.php
+++ b/plugins/system/jooa11y/src/Extension/Jooa11y.php
@@ -10,7 +10,6 @@
namespace Joomla\Plugin\System\Jooa11y\Extension;
-use Joomla\CMS\Language\Text;
use Joomla\CMS\Plugin\CMSPlugin;
use Joomla\Event\SubscriberInterface;
@@ -58,17 +57,17 @@ private function isAuthorisedDisplayChecker(): bool
$filterGroups = (array) $this->params->get('filter_groups', []);
if (!empty($filterGroups)) {
- $userGroups = $this->getApplication()->getIdentity()->get('groups');
+ $userGroups = $this->getApplication()
+ ->getIdentity()
+ ->get('groups');
if (!array_intersect($filterGroups, $userGroups)) {
$result = false;
-
return $result;
}
}
$result = true;
-
return $result;
}
@@ -86,7 +85,9 @@ public function initJooa11y()
}
// Check if we are in a preview modal or the plugin has enforced loading
- $showJooa11y = $this->getApplication()->getInput()->get('jooa11y', $this->params->get('showAlways', 0));
+ $showJooa11y = $this->getApplication()
+ ->getInput()
+ ->get('jooa11y', $this->params->get('showAlways', 0));
// Load the checker if authorised
if (!$showJooa11y || !$this->isAuthorisedDisplayChecker()) {
@@ -96,164 +97,105 @@ public function initJooa11y()
// Load translations
$this->loadLanguage();
- // Get the document object.
- $document = $this->getApplication()->getDocument();
+ // Detect the current active language
+ $getLang = $this->getApplication()
+ ->getLanguage()
+ ->getTag();
+
+ // Get the right locale
+ $splitLang = explode('-', $getLang);
+ $lang = $splitLang[0];
+ $country = $splitLang[1] ?? '';
+
+ // Sa11y is available in the following languages
+ $supportedLang = [
+ 'bg',
+ 'cs',
+ 'da',
+ 'de',
+ 'el',
+ 'en',
+ 'es',
+ 'et',
+ 'fi',
+ 'fr',
+ 'hu',
+ 'id',
+ 'it',
+ 'ja',
+ 'ko',
+ 'lt',
+ 'lv',
+ 'nb',
+ 'nl',
+ 'pl',
+ 'pt',
+ 'ro',
+ 'sl',
+ 'sk',
+ 'sv',
+ 'tr',
+ 'uk',
+ 'ua',
+ 'zh',
+ ];
- // Add plugin settings from the xml
- $document->addScriptOptions(
- 'jooa11yOptions',
- [
- 'checkRoot' => $this->params->get('checkRoot', 'main'),
- 'readabilityRoot' => $this->params->get('readabilityRoot', 'main'),
- 'containerIgnore' => $this->params->get('containerIgnore'),
- ]
- );
+ // Check if Sa11y supports language
+ if (!\in_array($lang, $supportedLang)) {
+ $lang = 'en';
+ } elseif ($lang === 'pt') {
+ $lang = $country === 'BR' ? 'ptBR' : 'ptPT';
+ } elseif ($lang === 'uk') {
+ $lang = 'ua';
+ } elseif ($lang === 'en') {
+ $lang = $country === 'US' ? 'enUS' : 'en';
+ }
+
+ // Get the document object
+ $document = $this->getApplication()->getDocument();
- // Add the language constants
- $constants = [
- 'PLG_SYSTEM_JOOA11Y_ALERT_CLOSE',
- 'PLG_SYSTEM_JOOA11Y_ALERT_TEXT',
- 'PLG_SYSTEM_JOOA11Y_AVG_WORD_PER_SENTENCE',
- 'PLG_SYSTEM_JOOA11Y_COMPLEX_WORDS',
- 'PLG_SYSTEM_JOOA11Y_CONTAINER_LABEL',
- 'PLG_SYSTEM_JOOA11Y_CONTRAST',
- 'PLG_SYSTEM_JOOA11Y_CONTRAST_ERROR_INPUT_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_CONTRAST_ERROR_INPUT_MESSAGE_INFO',
- 'PLG_SYSTEM_JOOA11Y_CONTRAST_ERROR_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_CONTRAST_ERROR_MESSAGE_INFO',
- 'PLG_SYSTEM_JOOA11Y_CONTRAST_WARNING_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_CONTRAST_WARNING_MESSAGE_INFO',
- 'PLG_SYSTEM_JOOA11Y_DARK_MODE',
- 'PLG_SYSTEM_JOOA11Y_DIFFICULT_READABILITY',
- 'PLG_SYSTEM_JOOA11Y_EMBED_AUDIO',
- 'PLG_SYSTEM_JOOA11Y_EMBED_GENERAL_WARNING',
- 'PLG_SYSTEM_JOOA11Y_EMBED_MISSING_TITLE',
- 'PLG_SYSTEM_JOOA11Y_EMBED_VIDEO',
- 'PLG_SYSTEM_JOOA11Y_ERROR',
- 'PLG_SYSTEM_JOOA11Y_FAIRLY_DIFFICULT_READABILITY',
- 'PLG_SYSTEM_JOOA11Y_FILE_TYPE_WARNING',
- 'PLG_SYSTEM_JOOA11Y_FILE_TYPE_WARNING_TIP',
- 'PLG_SYSTEM_JOOA11Y_FORM_LABELS',
- 'PLG_SYSTEM_JOOA11Y_GOOD',
- 'PLG_SYSTEM_JOOA11Y_GOOD_READABILITY',
- 'PLG_SYSTEM_JOOA11Y_HEADING_EMPTY',
- 'PLG_SYSTEM_JOOA11Y_HEADING_EMPTY_WITH_IMAGE',
- 'PLG_SYSTEM_JOOA11Y_HEADING_FIRST',
- 'PLG_SYSTEM_JOOA11Y_HEADING_LONG',
- 'PLG_SYSTEM_JOOA11Y_HEADING_LONG_INFO',
- 'PLG_SYSTEM_JOOA11Y_HEADING_MISSING_ONE',
- 'PLG_SYSTEM_JOOA11Y_HEADING_NON_CONSECUTIVE_LEVEL',
- 'PLG_SYSTEM_JOOA11Y_HIDE_OUTLINE',
- 'PLG_SYSTEM_JOOA11Y_HIDE_SETTINGS',
- 'PLG_SYSTEM_JOOA11Y_HYPERLINK_ALT_LENGTH_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_HYPERLINK_ALT_LENGTH_MESSAGE_INFO',
- 'PLG_SYSTEM_JOOA11Y_IMAGE_FIGURE_DECORATIVE',
- 'PLG_SYSTEM_JOOA11Y_IMAGE_FIGURE_DECORATIVE_INFO',
- 'PLG_SYSTEM_JOOA11Y_IMAGE_FIGURE_DUPLICATE_ALT',
- 'PLG_SYSTEM_JOOA11Y_LABELS_ARIA_LABEL_INPUT_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_LABELS_ARIA_LABEL_INPUT_MESSAGE_INFO',
- 'PLG_SYSTEM_JOOA11Y_LABELS_INPUT_RESET_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_LABELS_INPUT_RESET_MESSAGE_TIP',
- 'PLG_SYSTEM_JOOA11Y_LABELS_MISSING_IMAGE_INPUT_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_LABELS_MISSING_LABEL_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_LABELS_NO_FOR_ATTRIBUTE_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_LABELS_NO_FOR_ATTRIBUTE_MESSAGE_INFO',
- 'PLG_SYSTEM_JOOA11Y_LANG_CODE',
- 'PLG_SYSTEM_JOOA11Y_LINKS_ADVANCED',
- 'PLG_SYSTEM_JOOA11Y_LINK_ALT_HAS_BAD_WORD_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_LINK_ALT_HAS_BAD_WORD_MESSAGE_INFO',
- 'PLG_SYSTEM_JOOA11Y_LINK_ALT_HAS_SUS_WORD_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_LINK_ALT_HAS_SUS_WORD_MESSAGE_INFO',
- 'PLG_SYSTEM_JOOA11Y_LINK_ALT_PLACEHOLDER_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_LINK_ALT_TOO_LONG_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_LINK_ALT_TOO_LONG_MESSAGE_INFO',
- 'PLG_SYSTEM_JOOA11Y_LINK_ANCHOR_LINK_AND_ALT_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_LINK_ANCHOR_LINK_AND_ALT_MESSAGE_INFO',
- 'PLG_SYSTEM_JOOA11Y_LINK_BEST_PRACTICES',
- 'PLG_SYSTEM_JOOA11Y_LINK_BEST_PRACTICES_DETAILS',
- 'PLG_SYSTEM_JOOA11Y_LINK_DECORATIVE_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_LINK_EMPTY',
- 'PLG_SYSTEM_JOOA11Y_LINK_EMPTY_LINK_NO_LABEL',
- 'PLG_SYSTEM_JOOA11Y_LINK_HYPERLINKED_IMAGE_ARIA_HIDDEN',
- 'PLG_SYSTEM_JOOA11Y_LINK_IDENTICAL_NAME',
- 'PLG_SYSTEM_JOOA11Y_LINK_IDENTICAL_NAME_TIP',
- 'PLG_SYSTEM_JOOA11Y_LINK_IMAGE_BAD_ALT_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_LINK_IMAGE_BAD_ALT_MESSAGE_INFO',
- 'PLG_SYSTEM_JOOA11Y_LINK_IMAGE_LINK_ALT_TEXT_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_LINK_IMAGE_LINK_ALT_TEXT_MESSAGE_INFO',
- 'PLG_SYSTEM_JOOA11Y_LINK_IMAGE_LINK_NULL_ALT_NO_TEXT_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_LINK_IMAGE_PLACEHOLDER_ALT_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_LINK_IMAGE_SUS_ALT_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_LINK_IMAGE_SUS_ALT_MESSAGE_INFO',
- 'PLG_SYSTEM_JOOA11Y_LINK_LABEL',
- 'PLG_SYSTEM_JOOA11Y_LINK_LINK_HAS_ALT_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_LINK_PASS_ALT',
- 'PLG_SYSTEM_JOOA11Y_LINK_STOPWORD',
- 'PLG_SYSTEM_JOOA11Y_LINK_STOPWORD_TIP',
- 'PLG_SYSTEM_JOOA11Y_LINK_URL',
- 'PLG_SYSTEM_JOOA11Y_LINK_URL_TIP',
- 'PLG_SYSTEM_JOOA11Y_MAIN_TOGGLE_LABEL',
- 'PLG_SYSTEM_JOOA11Y_MISSING_ALT_LINK_BUT_HAS_TEXT_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_MISSING_ALT_LINK_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_MISSING_ALT_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_NEW_TAB_WARNING',
- 'PLG_SYSTEM_JOOA11Y_NEW_TAB_WARNING_TIP',
- 'PLG_SYSTEM_JOOA11Y_OFF',
- 'PLG_SYSTEM_JOOA11Y_ON',
- 'PLG_SYSTEM_JOOA11Y_PAGE_OUTLINE',
- 'PLG_SYSTEM_JOOA11Y_PANEL_HEADING_MISSING_ONE',
- 'PLG_SYSTEM_JOOA11Y_PANEL_STATUS_BOTH',
- 'PLG_SYSTEM_JOOA11Y_PANEL_STATUS_ERRORS',
- 'PLG_SYSTEM_JOOA11Y_PANEL_STATUS_HIDDEN',
- 'PLG_SYSTEM_JOOA11Y_PANEL_STATUS_ICON',
- 'PLG_SYSTEM_JOOA11Y_PANEL_STATUS_NONE',
- 'PLG_SYSTEM_JOOA11Y_PANEL_STATUS_WARNINGS',
- 'PLG_SYSTEM_JOOA11Y_QA_BAD_ITALICS',
- 'PLG_SYSTEM_JOOA11Y_QA_BAD_LINK',
- 'PLG_SYSTEM_JOOA11Y_QA_BLOCKQUOTE_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_QA_BLOCKQUOTE_MESSAGE_TIP',
- 'PLG_SYSTEM_JOOA11Y_QA_DUPLICATE_ID',
- 'PLG_SYSTEM_JOOA11Y_QA_DUPLICATE_ID_TIP',
- 'PLG_SYSTEM_JOOA11Y_QA_FAKE_HEADING',
- 'PLG_SYSTEM_JOOA11Y_QA_FAKE_HEADING_INFO',
- 'PLG_SYSTEM_JOOA11Y_QA_PAGE_LANGUAGE_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_QA_PDF_COUNT',
- 'PLG_SYSTEM_JOOA11Y_QA_SHOULD_BE_LIST',
- 'PLG_SYSTEM_JOOA11Y_QA_SHOULD_BE_LIST_TIP',
- 'PLG_SYSTEM_JOOA11Y_QA_UPPERCASE_WARNING',
- 'PLG_SYSTEM_JOOA11Y_READABILITY',
- 'PLG_SYSTEM_JOOA11Y_READABILITY_NOT_ENOUGH_CONTENT_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_READABILITY_NO_P_OR_LI_MESSAGE',
- 'PLG_SYSTEM_JOOA11Y_SETTINGS',
- 'PLG_SYSTEM_JOOA11Y_SHORTCUT_SR',
- 'PLG_SYSTEM_JOOA11Y_SHORTCUT_TOOLTIP',
- 'PLG_SYSTEM_JOOA11Y_SHOW_OUTLINE',
- 'PLG_SYSTEM_JOOA11Y_SHOW_SETTINGS',
- 'PLG_SYSTEM_JOOA11Y_TABLES_EMPTY_HEADING',
- 'PLG_SYSTEM_JOOA11Y_TABLES_EMPTY_HEADING_INFO',
- 'PLG_SYSTEM_JOOA11Y_TABLES_MISSING_HEADINGS',
- 'PLG_SYSTEM_JOOA11Y_TABLES_MISSING_HEADINGS_INFO',
- 'PLG_SYSTEM_JOOA11Y_TABLES_SEMANTIC_HEADING',
- 'PLG_SYSTEM_JOOA11Y_TABLES_SEMANTIC_HEADING_INFO',
- 'PLG_SYSTEM_JOOA11Y_TEXT_UNDERLINE_WARNING',
- 'PLG_SYSTEM_JOOA11Y_TEXT_UNDERLINE_WARNING_TIP',
- 'PLG_SYSTEM_JOOA11Y_TOTAL_WORDS',
- 'PLG_SYSTEM_JOOA11Y_VERY_DIFFICULT_READABILITY',
- 'PLG_SYSTEM_JOOA11Y_WARNING',
+ // Get plugin options from xml
+ $getOptions = [
+ 'checkRoot' => $this->params->get('checkRoot', 'main'),
+ 'readabilityRoot' => $this->params->get('readabilityRoot', 'main'),
+ 'containerIgnore' => $this->params->get('containerIgnore'),
+ 'contrastPlugin' => $this->params->get('contrastPlugin', 1),
+ 'formLabelsPlugin' => $this->params->get('formLabelsPlugin', 1),
+ 'linksAdvancedPlugin' => $this->params->get('linksAdvancedPlugin', 1),
+ 'colourFilterPlugin' => $this->params->get('colourFilterPlugin', 1),
+ 'checkAllHideToggles' => $this->params->get('additionalChecks', 0),
+ 'shadowComponents' => $this->params->get('shadowComponents'),
];
+ $getExtraProps = $this->params->get('extraProps', []);
- foreach ($constants as $constant) {
- Text::script($constant);
+
+ // Process extra props
+ $extraProps = [];
+ foreach ($getExtraProps as $prop) {
+ $decodedValue = json_decode($prop->value);
+ if (is_numeric($decodedValue) || \is_bool($decodedValue)) {
+ $extraProps[$prop->key] = $decodedValue;
+ } else {
+ $extraProps[$prop->key] = "{$prop->value}";
+ }
}
+ // Merge all options together and add to page
+ $allOptions = array_merge($getOptions, $extraProps);
+ $document->addScriptOptions('jooa11yOptions', $allOptions);
+
/** @var \Joomla\CMS\WebAsset\WebAssetManager $wa*/
$wa = $document->getWebAssetManager();
-
- $wa->getRegistry()->addRegistryFile('media/plg_system_jooa11y/joomla.asset.json');
-
- $wa->useScript('plg_system_jooa11y.jooa11y')
- ->useStyle('plg_system_jooa11y.jooa11y');
-
- return true;
+ $wa->getRegistry()->addExtensionRegistryFile('plg_system_jooa11y');
+
+ // Load scripts and instantiate
+ $wa->useStyle('sa11y')
+ ->useScript('sa11y')
+ ->registerAndUseScript(
+ 'sa11y-lang',
+ 'vendor/sa11y/' . $lang . '.js',
+ ['importmap' => true]
+ )
+ ->useScript('plg_system_jooa11y.jooa11y');
}
}
```
New language relevant PR in upstream repo: https://github.com/joomla/joomla-cms/pull/42780 Here are the upstream changes:
Click to expand the diff!
```diff diff --git a/administrator/language/en-GB/plg_system_jooa11y.ini b/administrator/language/en-GB/plg_system_jooa11y.ini index e061fc5a5ca7b..18c008803749c 100644 --- a/administrator/language/en-GB/plg_system_jooa11y.ini +++ b/administrator/language/en-GB/plg_system_jooa11y.ini @@ -4,17 +4,33 @@ ; Note : All ini files need to be saved as UTF-8 PLG_SYSTEM_JOOA11Y="System - Joomla Accessibility Checker" -PLG_SYSTEM_JOOA11Y_FIELD_CHECK_ROOT="Content Container" -PLG_SYSTEM_JOOA11Y_FIELD_CHECK_ROOT_DESC="Landmark on the page that will be checked for accessibility. The default setting is the landmark main. Alternatives to landmarks are classes, elements or ARIA roles (eg #example, .example, [role=example])." +PLG_SYSTEM_JOOA11Y_XML_DESCRIPTION="The Joomla Accessibility Checker visually highlights common accessibility and usability issues. Geared towards content authors, the plugin identifies errors or warnings and provides guidance on how to fix them. Please be aware that this plugin does not offer an exhaustive analysis of your website, nor does it automatically ensure your website's accessibility. It's important to select a template that is inherently accessible to ensure your site meets accessibility standards." +PLG_SYSTEM_JOOA11Y_FIELD_CHECK_ROOT="Target Area to Check" +PLG_SYSTEM_JOOA11Y_FIELD_CHECK_ROOT_DESC="Input a single selector to target a specific region of your website. The default setting is the landmark main. Alternatives to landmarks are classes, elements or ARIA roles (e.g. #main-content, .main, [role='main']). Input body to check the entire page." PLG_SYSTEM_JOOA11Y_FIELD_CONTAINER_IGNORE="Ignore Regions" PLG_SYSTEM_JOOA11Y_FIELD_CONTAINER_IGNORE_DESC="Ignore specific regions within the Content Container. Use commas to separate classes or elements (eg #ignore, .ignore)." -PLG_SYSTEM_JOOA11Y_FIELD_READABILITY_ROOT="Readability Container" -PLG_SYSTEM_JOOA11Y_FIELD_READABILITY_ROOT_DESC="Landmark on the page that will be checked for readability. The default setting is the landmark main. Alternatives to landmarks are classes, elements or ARIA roles (eg #example, .example, [role=example])." +PLG_SYSTEM_JOOA11Y_FIELD_READABILITY_ROOT="Readability Target Area" +PLG_SYSTEM_JOOA11Y_FIELD_READABILITY_ROOT_DESC="Landmark on the page that will be checked for readability. The default setting is the landmark main." PLG_SYSTEM_JOOA11Y_FIELD_SHOW_ALWAYS="Show Always" -PLG_SYSTEM_JOOA11Y_FIELD_SHOW_ALWAYS_DESC="Load the accessiblity checker on all pages. This is useful when developing the website but should not be left on when the website is live." -PLG_SYSTEM_JOOA11Y_XML_DESCRIPTION="The Joomla Accessibility Checker visually highlights common accessibility and usability issues. Geared towards content authors, the plugin identifies errors or warnings and provides guidance on how to fix them." +PLG_SYSTEM_JOOA11Y_FIELD_SHOW_ALWAYS_DESC="Load the accessiblity checker on all pages. This is useful when developing the website, but should not be left on when the website is live." +PLG_SYSTEM_JOOA11Y_FIELD_ADDITIONAL_CHECKS="Additional Checks Always On" +PLG_SYSTEM_JOOA11Y_FIELD_ADDITIONAL_CHECKS_DESC="Enabling this option will visually hide the toggle switches for Form Labels, Contrast, Links (Advanced) in the Settings panel." +PLG_SYSTEM_JOOA11Y_FIELD_WEB_COMPONENTS="Web Components to Check" +PLG_SYSTEM_JOOA11Y_FIELD_WEB_COMPONENTS_DESC="Provide a list of all known web components or containers with an open shadow DOM." +PLG_SYSTEM_JOOA11Y_FIELD_CONTRAST="Contrast" +PLG_SYSTEM_JOOA11Y_FIELD_CONTRAST_DESC="Show Contrast toggle in Settings panel. Check for WCAG 2.0 Level AA contrast issues between foreground text and background elements." +PLG_SYSTEM_JOOA11Y_FIELD_FORM_LABELS="Form Labels" +PLG_SYSTEM_JOOA11Y_FIELD_FORM_LABELS_DESC="Show Form Labels toggle in Settings panel. Check for form inputs missing a corresponding label. Not necessarily a content author issue, and usually not an issue when using a reputable, accessible forms plugin." +PLG_SYSTEM_JOOA11Y_FIELD_LINKS_ADVANCED="Links (Advanced)" +PLG_SYSTEM_JOOA11Y_FIELD_LINKS_ADVANCED_DESC="Show Links (Advanced) toggle in Settings panel. Check for additional issues such as: links that open in a new tab without warning, have identical names but different purpose, or points to a PDF and other files without warning." +PLG_SYSTEM_JOOA11Y_FIELD_COLOUR_FILTER="Colour Filter" +PLG_SYSTEM_JOOA11Y_FIELD_COLOUR_FILTER_DESC="Show Colour Filter toggle in Settings panel. Colour filters help identify colour combinations that may be difficult for people to distinguish." +PLG_SYSTEM_JOOA11Y_FIELD_EXTRA_PROPS="Extra Properties" +PLG_SYSTEM_JOOA11Y_FIELD_EXTRA_PROPS_DESC="Pass additional properties to customise. Provide a valid key/value pair. Refer to documentation." +PLG_SYSTEM_JOOA11Y_KEY="Key" +PLG_SYSTEM_JOOA11Y_VALUE="Value" -;Global text +; All the following strings are deprecated and will be removed with 6.0 PLG_SYSTEM_JOOA11Y_ALERT_CLOSE="Close" PLG_SYSTEM_JOOA11Y_ALERT_TEXT="Alert" PLG_SYSTEM_JOOA11Y_CONTAINER_LABEL="Accessibility Checker" @@ -37,8 +53,6 @@ PLG_SYSTEM_JOOA11Y_SHORTCUT_TOOLTIP="Skip to issue" PLG_SYSTEM_JOOA11Y_SHOW_OUTLINE="Show Outline" PLG_SYSTEM_JOOA11Y_SHOW_SETTINGS="Show Settings" PLG_SYSTEM_JOOA11Y_WARNING="Warning" - -;Readability panel. PLG_SYSTEM_JOOA11Y_AVG_WORD_PER_SENTENCE="Average words per sentence:" PLG_SYSTEM_JOOA11Y_COMPLEX_WORDS="Complex words:" PLG_SYSTEM_JOOA11Y_DIFFICULT_READABILITY="Difficult" @@ -47,16 +61,12 @@ PLG_SYSTEM_JOOA11Y_GOOD_READABILITY="Good" PLG_SYSTEM_JOOA11Y_READABILITY="Readability:" PLG_SYSTEM_JOOA11Y_TOTAL_WORDS="Words:" PLG_SYSTEM_JOOA11Y_VERY_DIFFICULT_READABILITY="Very difficult" - -;Panel status PLG_SYSTEM_JOOA11Y_PANEL_STATUS_BOTH="Accessibility Errors: %(errorCount). Accessibility Warnings: %(warningCount)." PLG_SYSTEM_JOOA11Y_PANEL_STATUS_ERRORS="Accessibility Errors: %(errorCount)." PLG_SYSTEM_JOOA11Y_PANEL_STATUS_HIDDEN="The item you are trying to view is not visible; it may be hidden or inside of an accordion or tab component. Here's a preview: " PLG_SYSTEM_JOOA11Y_PANEL_STATUS_ICON="Total issues found: %(totalCount)" PLG_SYSTEM_JOOA11Y_PANEL_STATUS_NONE="No accessibility errors found." PLG_SYSTEM_JOOA11Y_PANEL_STATUS_WARNINGS="Accessibility Warnings: %(warningCount)." - -;Headings PLG_SYSTEM_JOOA11Y_HEADING_EMPTY="Empty heading found! To fix, delete this line or change its format from Heading %(level) to Normal or Paragraph." PLG_SYSTEM_JOOA11Y_HEADING_EMPTY_WITH_IMAGE="Heading has no text, but contains an image. If this is not a heading, change its format from Heading %(level) to Normal or Paragraph. Otherwise, please add alt text to the image if it is not decorative." PLG_SYSTEM_JOOA11Y_HEADING_FIRST="The first heading on a page should usually be a Heading 1 or Heading 2. Heading 1 should be the start of the main content section, and is the main heading that describes the overall purpose of the page. Learn more about Heading Structure." @@ -65,8 +75,6 @@ PLG_SYSTEM_JOOA11Y_HEADING_LONG_INFO="Character Count: %(headingLength)< PLG_SYSTEM_JOOA11Y_HEADING_MISSING_ONE="Missing Heading 1. Heading 1 should be the start of the main content area, and is the main heading that describes the overall purpose of the page. Learn more about Heading Structure." PLG_SYSTEM_JOOA11Y_HEADING_NON_CONSECUTIVE_LEVEL="Non-consecutive heading level used. Headings should never skip levels, or go from Heading %(prevLevel) to Heading %(level)." PLG_SYSTEM_JOOA11Y_PANEL_HEADING_MISSING_ONE="Missing Heading 1!" - -;Link Text PLG_SYSTEM_JOOA11Y_LINK_BEST_PRACTICES="Consider replacing the link text: %(error)" PLG_SYSTEM_JOOA11Y_LINK_BEST_PRACTICES_DETAILS="- "Click here" places focus on mouse mechanics, when many people do not use a mouse or may be viewing this website on a mobile device. Consider using a different verb that relates to the task.
- Avoid using HTML symbols as call to actions unless they are hidden to assistive technologies.
" PLG_SYSTEM_JOOA11Y_LINK_EMPTY="Remove empty links without any text." @@ -76,16 +84,12 @@ PLG_SYSTEM_JOOA11Y_LINK_STOPWORD="Link text may not be descriptive enough out of PLG_SYSTEM_JOOA11Y_LINK_STOPWORD_TIP="Tip! Link text should always be clear, unique, and meaningful. Avoid common words like \"click here\"; or \"learn more\"." PLG_SYSTEM_JOOA11Y_LINK_URL="Longer, less intelligible URLs used as link text might be difficult to listen to with assistive technology. In most cases, it is better to use human-readable text instead of the URL. Short URLs (such as a site's homepage) are okay." PLG_SYSTEM_JOOA11Y_LINK_URL_TIP="Tip! Link text should always be clear, unique, and meaningful so it could be understood out of context." - -;Links Advanced PLG_SYSTEM_JOOA11Y_FILE_TYPE_WARNING="Link points to a PDF or downloadable file (e.g. MP3, Zip, Word Doc) without warning. Indicate the file type within the link text. If it is a large file, consider including the file size." PLG_SYSTEM_JOOA11Y_FILE_TYPE_WARNING_TIP="Example: Executive Report (PDF, 3MB)" PLG_SYSTEM_JOOA11Y_LINK_IDENTICAL_NAME="Link has identical text as another link, although it points to a different page. Multiple links with the same text may cause confusion for people who use screen readers." PLG_SYSTEM_JOOA11Y_LINK_IDENTICAL_NAME_TIP="Consider making the following link more descriptive to help distinguish it from other links: %(linkText)" PLG_SYSTEM_JOOA11Y_NEW_TAB_WARNING="Link opens in a new tab or window without warning. Doing so can be disorienting, especially for people who have difficulty perceiving visual content. Secondly, it is not always a good practice to control someone's experience or make decisions for them. Indicate that the link opens in a new window within the link text." PLG_SYSTEM_JOOA11Y_NEW_TAB_WARNING_TIP="Tip! Learn best practices: opening links in new browser windows and tabs." - -;Images PLG_SYSTEM_JOOA11Y_HYPERLINK_ALT_LENGTH_MESSAGE="Alt text description on a linked image is too long. The alt text on linked images should describe where the link takes you, not a literal description of the image. Consider using the title of the page it links to as the alt text." PLG_SYSTEM_JOOA11Y_HYPERLINK_ALT_LENGTH_MESSAGE_INFO="The alt text is %(altLength) characters: %(altText)" PLG_SYSTEM_JOOA11Y_IMAGE_FIGURE_DECORATIVE="Image is marked as decorative and will be ignored by assistive technology." @@ -117,8 +121,6 @@ PLG_SYSTEM_JOOA11Y_MISSING_ALT_LINK_MESSAGE="Image is being used as a link but i PLG_SYSTEM_JOOA11Y_MISSING_ALT_MESSAGE="Missing alt text! If the image conveys a story, mood, or important information - be sure to describe the image." PLG_SYSTEM_JOOA11Y_TEXT_UNDERLINE_WARNING="Underlined text can be confused with links." PLG_SYSTEM_JOOA11Y_TEXT_UNDERLINE_WARNING_TIP="Consider using a different style such as <em>emphasis</em>." - -;Labels PLG_SYSTEM_JOOA11Y_LABELS_ARIA_LABEL_INPUT_MESSAGE="Input has an accessible name, although please ensure there is a visible label too." PLG_SYSTEM_JOOA11Y_LABELS_ARIA_LABEL_INPUT_MESSAGE_INFO="The accessible name for this input is: %(ariaLabel)" PLG_SYSTEM_JOOA11Y_LABELS_INPUT_RESET_MESSAGE="Reset buttons should not be used unless specifically needed because they are easy to activate by mistake." @@ -127,26 +129,18 @@ PLG_SYSTEM_JOOA11Y_LABELS_MISSING_IMAGE_INPUT_MESSAGE="Image button is missing a PLG_SYSTEM_JOOA11Y_LABELS_MISSING_LABEL_MESSAGE="There is no label associated with this input. Please add an id to this input, and add a matching for attribute to the label." PLG_SYSTEM_JOOA11Y_LABELS_NO_FOR_ATTRIBUTE_MESSAGE="There is no label associated with this input. Add a for attribute to the label that matches the id of this input." PLG_SYSTEM_JOOA11Y_LABELS_NO_FOR_ATTRIBUTE_MESSAGE_INFO="The ID for this input is: id="%(t)"" - -;Embedded content PLG_SYSTEM_JOOA11Y_EMBED_AUDIO="Please ensure to provide a transcript for all podcasts. Providing transcripts for audio content is a mandatory Level A requirement. Transcripts support people who are D/deaf or hard-of-hearing, but can benefit everyone. Consider placing the transcript below or within an accordion panel." PLG_SYSTEM_JOOA11Y_EMBED_GENERAL_WARNING="Unable to check embedded content. Please make sure that images have alt text, videos have captions, text has sufficient contrast, and interactive components are keyboard accessible." PLG_SYSTEM_JOOA11Y_EMBED_MISSING_TITLE="Embedded content requires an accessible name that describes its contents. Please provide a unique title or aria-label attribute on the iframe element. Learn more about iFrames." PLG_SYSTEM_JOOA11Y_EMBED_VIDEO="Please ensure all videos have closed captioning. Providing captions for all audio and video content is a mandatory Level A requirement. Captions support people who are D/deaf or hard-of-hearing." - -;Contrast PLG_SYSTEM_JOOA11Y_CONTRAST_ERROR_INPUT_MESSAGE="The text within this input does not have enough contrast with the background. The contrast ratio should be at least 4.5:1 for normal text and 3:1 for large text." PLG_SYSTEM_JOOA11Y_CONTRAST_ERROR_INPUT_MESSAGE_INFO="The contrast ratio is %(cratio)." PLG_SYSTEM_JOOA11Y_CONTRAST_ERROR_MESSAGE="This text does not have enough contrast with the background. The contrast ratio should be at least 4.5:1 for normal text and 3:1 for large text." PLG_SYSTEM_JOOA11Y_CONTRAST_ERROR_MESSAGE_INFO="The contrast ratio is %(cratio) for the following text: %(nodetext)" PLG_SYSTEM_JOOA11Y_CONTRAST_WARNING_MESSAGE="The contrast of this text is unknown and needs to be manually reviewed. Ensure the text and the background have strong contrasting colours. The contrast ratio should be at least 4.5:1 for normal text and 3:1 for large text." PLG_SYSTEM_JOOA11Y_CONTRAST_WARNING_MESSAGE_INFO="Please review contrast of the following text:%(nodetext)" - -;Readability PLG_SYSTEM_JOOA11Y_READABILITY_NOT_ENOUGH_CONTENT_MESSAGE="Not enough content to calculate readability score." PLG_SYSTEM_JOOA11Y_READABILITY_NO_P_OR_LI_MESSAGE="Unable to calculate readability score. No paragraph <p> or list content <li> found." - -;QA PLG_SYSTEM_JOOA11Y_QA_BAD_ITALICS="Bold and italic tags have semantic meaning, and should not be used to highlight entire paragraphs. Bolded text should be used to provide strong emphasis on a word or phrase. Italics should be used to highlight proper names (i.e. book and article titles), foreign words, quotes. Long quotes should be formatted as a blockquote." PLG_SYSTEM_JOOA11Y_QA_BAD_LINK="Bad link found. Link appears to point to a development environment. This link points to: %(el)" PLG_SYSTEM_JOOA11Y_QA_BLOCKQUOTE_MESSAGE="Is this a heading? %(bqHeadingText)" @@ -160,8 +154,6 @@ PLG_SYSTEM_JOOA11Y_QA_PDF_COUNT="PDFs are considered web content and must be mad PLG_SYSTEM_JOOA11Y_QA_SHOULD_BE_LIST="Are you trying to create a list? Possible list item found: %(firstPrefix)" PLG_SYSTEM_JOOA11Y_QA_SHOULD_BE_LIST_TIP="Make sure to use semantic lists by using the bullet or number formatting buttons instead. When using a semantic list, assistive technologies are able to convey information such as the total number of items and the relative position of each item in the list. Learn more about semantic lists." PLG_SYSTEM_JOOA11Y_QA_UPPERCASE_WARNING="Found all caps. Some screen readers may interpret all caps text as an acronym and will read each letter individually. Additionally, some people find all caps more difficult to read and it may give the appearance of SHOUTING." - -;Tables PLG_SYSTEM_JOOA11Y_TABLES_EMPTY_HEADING="Empty table header found! Table headers should never be empty. It is important to designate row and/or column headers to convey their relationship. This information provides context to people who use assistive technology. Please keep in mind that tables should be used for tabular data only." PLG_SYSTEM_JOOA11Y_TABLES_EMPTY_HEADING_INFO="Learn more about accessible tables." PLG_SYSTEM_JOOA11Y_TABLES_MISSING_HEADINGS="Missing table headers! Accessible tables need HTML markup that indicates header cells and data cells which defines their relationship. This information provides context to people who use assistive technology. Tables should be used for tabular data only." diff --git a/administrator/language/en-GB/plg_system_jooa11y.sys.ini b/administrator/language/en-GB/plg_system_jooa11y.sys.ini index 02519b0004979..9bac6ee47a022 100644 --- a/administrator/language/en-GB/plg_system_jooa11y.sys.ini +++ b/administrator/language/en-GB/plg_system_jooa11y.sys.ini @@ -4,4 +4,4 @@ ; Note : All ini files need to be saved as UTF-8 PLG_SYSTEM_JOOA11Y="System - Joomla Accessibility Checker" -PLG_SYSTEM_JOOA11Y_XML_DESCRIPTION="The Joomla Accessibility Checker visually highlights common accessibility and usability issues. Geared towards content authors, the plugin identifies errors or warnings and provides guidance on how to fix them." +PLG_SYSTEM_JOOA11Y_XML_DESCRIPTION="The Joomla Accessibility Checker visually highlights common accessibility and usability issues. Geared towards content authors, the plugin identifies errors or warnings and provides guidance on how to fix them. Please be aware that this plugin does not offer an exhaustive analysis of your website, nor does it automatically ensure your website's accessibility. It's important to select a template that is inherently accessible to ensure your site meets accessibility standards." diff --git a/build/build-modules-js/javascript/compile-to-es2017.es6.js b/build/build-modules-js/javascript/compile-to-es2017.es6.js index 9dd93b4e0863c..84386773f3cde 100644 --- a/build/build-modules-js/javascript/compile-to-es2017.es6.js +++ b/build/build-modules-js/javascript/compile-to-es2017.es6.js @@ -53,13 +53,15 @@ const collectExternals = () => { return; } - // Joomla modules + // Joomla and Vendor modules externalModules.push( 'cropper-module', 'codemirror', 'joomla.dialog', 'editor-api', 'editor-decorator', + 'sa11y', + 'sa11y-lang', ); // Codemirror modules diff --git a/build/build-modules-js/settings.json b/build/build-modules-js/settings.json index c9f7a04454e99..a655a2e7804e2 100644 --- a/build/build-modules-js/settings.json +++ b/build/build-modules-js/settings.json @@ -403,7 +403,7 @@ "hotkeys-js": { "name": "hotkeysjs", "licenseFilename": "LICENSE", - "js" : { + "js": { "dist/hotkeys.js": "js/hotkeys.js", "dist/hotkeys.min.js": "js/hotkeys.min.js" }, @@ -458,10 +458,6 @@ ], "licenseFilename": "LICENSE.txt" }, - "@joomla/joomla-a11y-checker": { - "name": "joomla-a11y-checker", - "licenseFilename": "LICENSE.md" - }, "joomla-ui-custom-elements": { "name": "joomla-custom-elements", "js": { @@ -745,6 +741,66 @@ } ] }, + "sa11y": { + "name": "sa11y", + "licenseFilename": "LICENSE.md", + "js": { + "dist/js/sa11y.esm.min.js": "js/sa11y.esm.min.js", + "dist/js/lang/bg.js": "js/bg.js", + "dist/js/lang/cs.js": "js/cs.js", + "dist/js/lang/da.js": "js/da.js", + "dist/js/lang/de.js": "js/de.js", + "dist/js/lang/el.js": "js/el.js", + "dist/js/lang/en.js": "js/en.js", + "dist/js/lang/enUS.js": "js/enUS.js", + "dist/js/lang/es.js": "js/es.js", + "dist/js/lang/et.js": "js/et.js", + "dist/js/lang/fi.js": "js/fi.js", + "dist/js/lang/fr.js": "js/fr.js", + "dist/js/lang/hu.js": "js/hu.js", + "dist/js/lang/id.js": "js/id.js", + "dist/js/lang/it.js": "js/it.js", + "dist/js/lang/ja.js": "js/ja.js", + "dist/js/lang/ko.js": "js/ko.js", + "dist/js/lang/lt.js": "js/lt.js", + "dist/js/lang/lv.js": "js/lv.js", + "dist/js/lang/nb.js": "js/nb.js", + "dist/js/lang/nl.js": "js/nl.js", + "dist/js/lang/pl.js": "js/pl.js", + "dist/js/lang/ptBR.js": "js/ptBR.js", + "dist/js/lang/ptPT.js": "js/ptPT.js", + "dist/js/lang/ro.js": "js/ro.js", + "dist/js/lang/sk.js": "js/sk.js", + "dist/js/lang/sl.js": "js/sl.js", + "dist/js/lang/sv.js": "js/sv.js", + "dist/js/lang/tr.js": "js/tr.js", + "dist/js/lang/ua.js": "js/ua.js", + "dist/js/lang/zh.js": "js/zh.js" + }, + "css": { + "dist/css/sa11y.min.css": "css/sa11y.min.css" + }, + "provideAssets": [ + { + "name": "sa11y", + "type": "script", + "uri": "sa11y.esm.min.js", + "importmap": true + }, + { + "name": "sa11y-lang", + "type": "script", + "uri": "en.js", + "importmap": true, + "description": "A placeholder asset which is later initialised by plugin, depending on active language." + }, + { + "name": "sa11y", + "type": "style", + "uri": "sa11y.min.css" + } + ] + }, "qrcode-generator": { "name": "qrcode", "js": { @@ -793,7 +849,9 @@ "text": "It looks like you are trying to run Joomla! from our git repository. To do so requires you complete a couple of extra steps first.", "link": "J4.x:Setting_Up_Your_Local_Environment", "linkText": "More Details", - "destFile": ["/templates/system/build_incomplete.html"] + "destFile": [ + "/templates/system/build_incomplete.html" + ] }, "unsupported": { "title": "Joomla: unsupported PHP version", @@ -801,7 +859,10 @@ "text": "Your host needs to use PHP version {{phpversion}} or newer to run this version of Joomla!", "link": "J4.x:Unsupported_PHP_Version", "linkText": "Help me resolve this", - "destFile": ["/templates/system/incompatible.html", "/includes/incompatible.html"] + "destFile": [ + "/templates/system/incompatible.html", + "/includes/incompatible.html" + ] }, "noxml": { "title": "Joomla: Missing PHP-XML library", @@ -809,7 +870,9 @@ "text": "Your host needs to use PHP with support for the XML library to run this version of Joomla!", "link": "J4.x:Missing_XML_Library", "linkText": "Help me resolve this", - "destFile": ["/media/system/html/noxml.html"] + "destFile": [ + "/media/system/html/noxml.html" + ] }, "fatal": { "title": "An Error Occurred: {{statusText}}", @@ -817,8 +880,10 @@ "text": "The server returned a \"{{statusCode_statusText}}\"", "link": "J4.x:FatalError", "linkText": "Help me resolve this", - "destFile": ["/templates/system/fatal-error.html"] + "destFile": [ + "/templates/system/fatal-error.html" + ] } } } -} +} \ No newline at end of file diff --git a/build/media_source/plg_behaviour_compat/es5.asset.json b/build/media_source/plg_behaviour_compat/es5.asset.json index fe0d8342c60ef..a2d72ce8e848b 100644 --- a/build/media_source/plg_behaviour_compat/es5.asset.json +++ b/build/media_source/plg_behaviour_compat/es5.asset.json @@ -650,7 +650,8 @@ "deprecated": true, "uri": "", "dependencies": [ - "core", "messages" + "core", + "messages" ], "attributes": { "nomodule": true, diff --git a/build/media_source/plg_system_jooa11y/joomla.asset.json b/build/media_source/plg_system_jooa11y/joomla.asset.json index 4f39991313bae..7ca6fa5ecbcd6 100644 --- a/build/media_source/plg_system_jooa11y/joomla.asset.json +++ b/build/media_source/plg_system_jooa11y/joomla.asset.json @@ -10,7 +10,9 @@ "type": "script", "uri": "plg_system_jooa11y/jooa11y.min.js", "dependencies": [ - "core" + "core", + "sa11y", + "sa11y-lang" ], "attributes": { "type": "module" @@ -19,7 +21,12 @@ { "name": "plg_system_jooa11y.jooa11y", "type": "style", - "uri": "plg_system_jooa11y/jooa11y.min.css" + "uri": "", + "deprecated": true, + "deprecatedMsg": "Use 'sa11y' style asset instead", + "dependencies": [ + "sa11y" + ] } ] } diff --git a/build/media_source/plg_system_jooa11y/js/jooa11y.es6.js b/build/media_source/plg_system_jooa11y/js/jooa11y.es6.js index a244ba011caa1..b79cdd3e86a5c 100644 --- a/build/media_source/plg_system_jooa11y/js/jooa11y.es6.js +++ b/build/media_source/plg_system_jooa11y/js/jooa11y.es6.js @@ -1,17 +1,11 @@ -import { Jooa11y, Lang } from '@joomla/joomla-a11y-checker/dist/js/joomla-a11y-checker.esm.js'; +// eslint-disable-next-line import/no-unresolved +import { Sa11y, Lang } from 'sa11y'; +// eslint-disable-next-line import/no-unresolved +import Sa11yLang from 'sa11y-lang'; -if (!Joomla) { - throw new Error('Joomla API is not properly initialised'); -} - -const stringPrefix = 'PLG_SYSTEM_JOOA11Y_'; - -Lang.translate = (string) => Joomla.Text._(stringPrefix + string, string); - -const options = Joomla.getOptions('jooa11yOptions'); +Lang.addI18n(Sa11yLang.strings); window.addEventListener('load', () => { - // Instantiate - const checker = new Jooa11y(options); - checker.doInitialCheck(); + // eslint-disable-next-line no-new + new Sa11y(Joomla.getOptions('jooa11yOptions', {})); }); diff --git a/build/media_source/plg_system_jooa11y/scss/jooa11y.scss b/build/media_source/plg_system_jooa11y/scss/jooa11y.scss deleted file mode 100644 index 187e9f18d634a..0000000000000 --- a/build/media_source/plg_system_jooa11y/scss/jooa11y.scss +++ /dev/null @@ -1 +0,0 @@ -@import "../../../../node_modules/@joomla/joomla-a11y-checker/dist/css/joomla-a11y-checker"; diff --git a/package-lock.json b/package-lock.json index dab4646b970cc..5f85f0ed86522 100644 --- a/package-lock.json +++ b/package-lock.json @@ -51,6 +51,8 @@ "punycode": "^2.3.0", "qrcode-generator": "^1.4.4", "roboto-fontface": "^0.10.0", + "sa11y": "^3.0.8", + "sa11y": "^3.0.8", "shepherd.js": "^11.2.0", "short-and-sweet": "^1.0.4", "skipto": "^4.1.7", @@ -8354,6 +8356,22 @@ "tslib": "^2.1.0" } }, + "node_modules/sa11y": { + "version": "3.0.8", + "resolved": "https://registry.npmjs.org/sa11y/-/sa11y-3.0.8.tgz", + "integrity": "sha512-muMZGhlDJ8wsT8OuZEBfdeVqCatyhtIUm5MaeatWqo4CWeLLZo9dXkvlBj4zZfKccKFhHMWzAFsAwM1KL1oMjw==", + "dependencies": { + "tippy.js": "^6.3.7" + } + }, + "node_modules/sa11y": { + "version": "3.0.8", + "resolved": "https://registry.npmjs.org/sa11y/-/sa11y-3.0.8.tgz", + "integrity": "sha512-muMZGhlDJ8wsT8OuZEBfdeVqCatyhtIUm5MaeatWqo4CWeLLZo9dXkvlBj4zZfKccKFhHMWzAFsAwM1KL1oMjw==", + "dependencies": { + "tippy.js": "^6.3.7" + } + }, "node_modules/safe-array-concat": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.0.0.tgz", @@ -10105,4 +10123,4 @@ } } } -} +} \ No newline at end of file diff --git a/package.json b/package.json index b1be20400d43c..09b42ffac5672 100644 --- a/package.json +++ b/package.json @@ -78,6 +78,7 @@ "punycode": "^2.3.0", "qrcode-generator": "^1.4.4", "roboto-fontface": "^0.10.0", + "sa11y": "^3.0.8", "shepherd.js": "^11.2.0", "short-and-sweet": "^1.0.4", "skipto": "^4.1.7", diff --git a/plugins/system/jooa11y/jooa11y.xml b/plugins/system/jooa11y/jooa11y.xml index eb40c363d6ce3..aca1dca2c6f89 100644 --- a/plugins/system/jooa11y/jooa11y.xml +++ b/plugins/system/jooa11y/jooa11y.xml @@ -33,6 +33,66 @@ +