Merge pull request #810 from equalizedigital/william/7971471368/conve…

…rt-link_pdf-rule-to-JS

Convert link_pdf rule and link_ms_office_doc to js

includes/rules.php

@@ -9,7 +9,6 @@
 	TabindexFix,
 	AddLabelToUnlabelledFormFieldsFix,
 	CommentSearchLabelFix,
-	ReadMoreAddTitleFix,
 	PreventLinksOpeningNewWindowFix,
 	HTMLLangAndDirFix,
 	AddMissingOrEmptyPageTitleFix,
@@ -243,13 +242,15 @@
 		'slug'      => 'link_ms_office_file',
 		'rule_type' => 'warning',
 		'summary'   => esc_html__( 'A Link to MS Office File warning means that one or more of the links on your page or post directs to a file with one of the following file extensions: .doc, .docx, .xls, .xlsx, .ppt, .pptx, .pps or .ppsx. This warning appears when an MS Office file is present as a reminder to manually test your Word documents, PowerPoint presentations, and Excel spreadsheets for accessibility and to confirm that they conform to all relevant WCAG guidelines. To resolve a Link to MS Office File warning, you need to: (1) ensure a direct link to view or download the document is present if you\'re using a plugin to embed it on the page; (2) ensure the link to the document warns users it is a link to a document by displaying the specific file extension in the link anchor; and (3) test and remediate your MS Office file for accessibility errors. After determining your file is fully accessible, you can safely “Ignore” the warning.', 'accessibility-checker' ),
+		'ruleset'   => 'js',
 	],
 	[
 		'title'     => esc_html__( 'Link to PDF', 'accessibility-checker' ),
 		'info_url'  => 'https://a11ychecker.com/help1972',
 		'slug'      => 'link_pdf',
 		'rule_type' => 'warning',
 		'summary'   => esc_html__( 'A Link to PDF warning means that one or more of the links on your page or post directs to a PDF file. This warning is a reminder to manually test the linked PDF for accessibility and to confirm that it conforms to all relevant WCAG guidelines. To resolve a Link to PDF warning, you need to: (1) ensure a direct link to view or download the document is present if you\'re using a plugin to embed it on the page; (2) ensure the link to the document warns users it is a link to a document by displaying the specific file extension in the link anchor; and (3) test and remediate your document for accessibility errors. After determining your file is fully accessible, you can safely “Ignore” the warning.', 'accessibility-checker' ),
+		'ruleset'   => 'js',
 	],
 	[
 		'title'     => esc_html__( 'Link to Non-HTML File', 'accessibility-checker' ),

src/pageScanner/index.js

@@ -22,10 +22,12 @@ import brokenAnchorLink from './rules/broken-anchor-link';
 import anchorExists from './checks/anchor-exists';
 import labelExtended from './rules/extended/label';
 import imageInputHasAlt from './checks/image-input-has-alt';
+import linkPDF from './rules/link-pdf';
+import linkMsOfficeFile from './rules/link-ms-office-file';
 
 //TODO: examples:
 //import customRule1 from './rules/custom-rule-1';
-//import alwaysFail from './checks/always-fail';
+import alwaysFail from './checks/always-fail';
 
 //TODO:
 //see: https://github.com/dequelabs/axe-core/blob/develop/doc/developer-guide.md#api-reference
@@ -62,11 +64,13 @@ const scan = async (
 				textJustified,
 				linkTargetBlank,
 				linkAmbiguousText,
+				linkPDF,
+				linkMsOfficeFile,
 				brokenAnchorLink,
 				labelExtended,
 			],
 			checks: [
-				//alwaysFail,
+				alwaysFail,
 				elementIsAUTag,
 				elementWithUnderline,
 				paragraphStyledAsHeader,
@@ -101,6 +105,8 @@ const scan = async (
 					textJustified.id,
 					linkTargetBlank.id,
 					linkAmbiguousText.id,
+					linkPDF.id,
+					linkMsOfficeFile.id,
 					brokenAnchorLink.id,
 					labelExtended.id,
 				],

src/pageScanner/rules/link-ms-office-file.js

@@ -0,0 +1,26 @@
+/**
+ * Detects linked MS Office files.
+ */
+
+const msOfficeFileExtensions = [ '.doc', '.docx', '.xls', '.xlsx', '.ppt', '.pptx', '.pps', '.ppsx' ];
+
+// This generates a very long list of selectors, 6 in total for each extension: extension at the end,
+// extension within having query vars, extension within having #anchors plus uppercase versions of the
+// file extension for each one of these cases. It is still quicker that iterating through all the links
+// on the page and checking the href in a matches.
+const selectorString = msOfficeFileExtensions.map( ( extension ) => `a[href$="${ extension }"], a[href$="${ extension.toUpperCase() }"], a[href*="${ extension }?"], a[href*="${ extension.toUpperCase() }?"], a[href*="${ extension }#"], a[href*="${ extension.toUpperCase() }#"]` ).join( ', ' );
+
+export default {
+	id: 'link_ms_office_file',
+	selector: selectorString,
+	excludeHidden: false,
+	tags: [
+		'cat.custom',
+	],
+	metadata: {
+		description: 'Links to MS Office documents typically should be checked.',
+	},
+	all: [],
+	any: [ 'always-fail' ],
+	none: [],
+};

src/pageScanner/rules/link-pdf.js

@@ -0,0 +1,17 @@
+/**
+ * Detects linked PDFs.
+ */
+export default {
+	id: 'link_pdf',
+	selector: 'a[href$=".pdf"], a[href$=".PDF"], a[href*=".pdf?"], a[href*=".PDF?"], a[href*=".pdf#"], a[href*=".PDF#"]',
+	excludeHidden: false,
+	tags: [
+		'cat.custom',
+	],
+	metadata: {
+		description: 'Links to PDFs typically should be checked.',
+	},
+	all: [],
+	any: [ 'always-fail' ],
+	none: [],
+};