Tool Information

🏗️ Architecture & Technology Overview

The Accessibility Scanner is a sophisticated, self-contained desktop application designed for professional-grade, end-to-end accessibility auditing. Its architecture is built upon three primary, interacting components: a Node.js Backend, a Web-Based Frontend, and a powerful Browser Automation & Auditing Layer.

🛠️ The tool is developed and maintained on Arch Linux 🐧 and is designed for use on Windows 10 and 11 🪟.  

1. Node.js Backend (The "Engine")

The backend is the core of the application, responsible for orchestrating the entire scan process from configuration to reporting.

• Technology: Built with Express.js, it runs a local web server that handles all communication and serves the user interface.
• Key Responsibilities:
  • API & Communication: Provides a RESTful API (/scan, /cancel, /pause, /resume) to receive and validate scan configurations from the frontend. It uses Server-Sent Events (SSE) to stream real-time progress, detailed logs, and memory usage metrics back to the UI.
  • Job & State Management: Manages the lifecycle of every scan job, tracking active processes, pause/stop signals, and domain-specific error rates for the adaptive delay feature.
  • File System Operations: Performs all file system interactions, including generating and saving the final HTML reports, managing the persistent browser session cache, and handling temporary screenshot files.
  • Security & Integrity: Implements the hardware-based licensing verification and the frontend file integrity check on startup to ensure the application is secure and unmodified.

2. Browser-Based Frontend (The "Cockpit")

The user interacts with the application through a clean, dynamic single-page web interface that runs entirely in their own browser.

• Technology: A pure vanilla HTML, CSS, and JavaScript application with no external frameworks, ensuring fast load times and minimal dependencies.
• Key Responsibilities:
  • Dynamic Configuration: Provides an intuitive form for configuring all basic and advanced scan parameters. The UI dynamically adapts, enabling and disabling options based on the user's selections to prevent invalid configurations.
  • Real-time Monitoring: Listens to the SSE stream from the backend to display the live progress bar, a detailed color-coded activity log, and memory usage metrics, giving the user complete visibility into the scan's status.
  • Client-Side Logic: Performs client-side validation, generates shareable configuration strings, and includes logic for managing past reports (searching, deleting). It utilizes JSZip to create downloadable screenshot archives directly in the browser.
  • Interactive Reporting: The frontend serves as the host for the generated HTML reports, which contain their own embedded JavaScript to enable features like issue filtering, screenshot modals, and ticket content generation.

3. Browser Automation & Auditing Layer (The "Worker")

This is where the actual web interaction and analysis takes place, powered by leading open-source automation and accessibility tools, all tied together by a significant amount of custom logic.

• Core Technologies:
  • Puppeteer: The primary driver, used to launch and control instances of a headless (or visible, for logins) Chromium browser.
  • puppeteer-cluster: A sophisticated manager built on top of Puppeteer that creates a pool of browser workers for parallel task execution, drastically accelerating large-scale crawls and scans.
  • Axe-core: The industry-standard accessibility engine. The backend injects the Axe-core library directly into every webpage loaded by Puppeteer for analysis.
• Key Responsibilities & Custom Logic:
  • Navigation & Interaction: Handles all page navigation, redirect following, and complex User Journey execution by programmatically simulating clicks, typing, and other user interactions.
  • Intelligent Auditing: Executes the injected axe.run() command on each page—respecting all user-defined rule configurations—and collects the detailed JSON results for reporting.
  • Advanced Feature Implementation:
    • Stealth Mode: Modifies browser launch arguments and injects JavaScript on-the-fly to spoof browser fingerprints, bypassing sophisticated anti-bot systems.
    • Adaptive Performance: Implements the adaptive delay and smart retry logic by monitoring network responses and internal error states.
    • Stability Management: Orchestrates periodic browser restarts during long sequential scans to prevent memory leaks and ensure process stability.

This architecture is unified by over 7,300+ lines of custom Node.js code, which provides the essential logic, error handling, and state management that integrates these powerful open-source foundations. It is this custom code that enables the unique combination of features like User Journeys, advanced stealth, adaptive performance, and comprehensive, interactive reporting, delivering a solution purpose-built for the demands of professional accessibility auditing.