🐛 fix(a11y-init.js): prevent default event to avoid page reload when …

…running a11y tests

✨ feat(a11y-init.js): add security nonce to the request body to ensure secure AJAX request
🐛 fix(a11y-tester.php): enqueue 'jquery' as a dependency for 'a11y-init' script to ensure it is loaded before
✨ feat(a11y-tester.php): add nonce to wpData object to be used in AJAX request for security validation
✨ feat(a11y-tester.php): add capability check and nonce validation to 'run_a11y_test_function' to ensure secure AJAX request
✨ feat(a11y-tester.php): add sanitization and validation for post ID in 'run_a11y_test_function' to prevent invalid or malicious input
✨ feat(a11y-tester.php): add support for adding 'a11y_meta_box' to all public post types dynamically
✨ feat(a11y-tester.php): add custom plugin links for source code and support in plugin meta row

a11y-init.js

@@ -8,13 +8,14 @@ window.addEventListener("DOMContentLoaded", function () {
     }
 
     const runA11yTests = async () => {
+        event.preventDefault();
         const postID = document.querySelector("input#post_ID").value;
         const requestData = {
             method: "POST",
             headers: {
                 "Content-Type": "application/x-www-form-urlencoded",
             },
-            body: `action=run_ally_test&post_id=${postID}`,
+            body: `action=run_a11y_test&post_id=${postID}&security=${wpData.nonce}`,
         };
 
         const response = await fetch(wpData.ajax_url, requestData);
@@ -34,6 +35,7 @@ window.addEventListener("DOMContentLoaded", function () {
             results.violations.forEach((violation) => {
                 const section = document.createElement("div");
                 const button = document.createElement("button");
+                button.type = "button";
                 const content = document.createElement("div");
 
                 button.innerHTML = `${violation.id} - ${violation.impact}`;
@@ -84,12 +86,14 @@ window.addEventListener("DOMContentLoaded", function () {
         }
 
         const btn = document.createElement("button");
+        btn.type = "button";
         btn.id = "run-a11y-test-button";
         btn.textContent = "Run A11y Test";
         btn.addEventListener("click", runA11yTests);
         metaBoxInsideDiv.appendChild(btn);
 
         const clrBtn = document.createElement("button");
+        clrBtn.type = "button";
         clrBtn.id = "clear-a11y-test-button";
         clrBtn.textContent = "Clear A11y Test";
         clrBtn.addEventListener("click", () => {

a11y-tester.php

@@ -3,17 +3,20 @@
 /**
  * Plugin Name: A11y Tester
  * Description: A plugin to test accessibility of any page or post.
- * Version: 1.0
+ * Version: 1.0.1
  * Author: Joe Peterson
  * Author URI: https://joepeterson.work
  */
 
-function enqueue_a11y_scripts()
+// Enqueue scripts
+function enqueue_a11y_scripts($hook)
 {
-    if (is_admin()) {
+    if ('post.php' === $hook || 'post-new.php' === $hook) {
         wp_enqueue_script('axe-core', 'https://cdnjs.cloudflare.com/ajax/libs/axe-core/4.8.2/axe.min.js', array(), '4.8.2', true);
-        wp_enqueue_script('a11y-init', plugin_dir_url(__FILE__) . 'a11y-init.js', array('axe-core'), '1.0', true);
-        wp_localize_script('a11y-init', 'wpData', array('ajax_url' => admin_url('admin-ajax.php')));
+        wp_enqueue_script('a11y-init', plugin_dir_url(__FILE__) . 'a11y-init.js', array('axe-core', 'jquery'), '1.0', true);
+
+        $nonce = wp_create_nonce('a11y_nonce');
+        wp_localize_script('a11y-init', 'wpData', array('ajax_url' => admin_url('admin-ajax.php'), 'nonce' => $nonce));
         wp_enqueue_style('a11y-style', plugin_dir_url(__FILE__) . 'a11y-styles.css', array(), '1.0');
     }
 }
@@ -22,10 +25,21 @@ function enqueue_a11y_scripts()
 // Add meta box
 function add_a11y_meta_box()
 {
-    add_meta_box('a11y_meta_box', 'Accessibility Tester', 'a11y_meta_box_content', array('post', 'page'), 'normal', 'high');
+    // Fetch all public post types
+    $args = array(
+        'public'   => true,
+    );
+
+    $post_types = get_post_types($args);
+
+    // Loop through each post type and add the meta box
+    foreach ($post_types as $post_type) {
+        add_meta_box('a11y_meta_box', 'Accessibility Tester', 'a11y_meta_box_content', $post_type, 'normal', 'high');
+    }
 }
 add_action('add_meta_boxes', 'add_a11y_meta_box');
 
+
 // Meta box content
 function a11y_meta_box_content()
 {
@@ -37,24 +51,34 @@ function a11y_meta_box_content()
 
 function run_a11y_test_function()
 {
-    $post_id = $_POST['post_id'];
+    // Check the nonce and capability
+    check_ajax_referer('a11y_nonce', 'security');
+    if (!current_user_can('edit_posts')) {
+        wp_send_json_error('You do not have the necessary permissions.');
+        wp_die();
+    }
+
+    // Check and sanitize the post ID
+    $post_id = intval($_POST['post_id']);
+    if ($post_id <= 0) {
+        wp_send_json_error('Invalid post ID');
+        wp_die();
+    }
+    $post_id = absint($post_id); // Sanitizing the input
+
     $url = get_permalink($post_id);
-    wp_send_json(array('url' => $url));
+    wp_send_json_success(array('url' => $url));
     wp_die();
 }
 
+// Add custom links
 function a11y_custom_plugin_links($links, $file)
 {
-
-    // Check if this is your plugin. If not, return the default links array.
     if (plugin_basename(__FILE__) === $file) {
-        // You can make the links open in a new tab by adding target='_blank' to the anchor tags.
         $row_meta = array(
             'source' => '<a href="https://github.com/skullzarmy/a11y-tester-wordpress-plugin" target="_blank" rel="nofollow noopener">Source Code</a>',
             'support' => '<a href="https://github.com/skullzarmy/a11y-tester-wordpress-plugin/issues" target="_blank" rel="nofollow noopener">Support</a>',
         );
-
-        // Merge our new links with the default links.
         return array_merge($links, $row_meta);
     }