Store object selector in database for use in frontend highlighter - #1053
Conversation
This update introduces new fields in the database schema to support enhanced accessibility features. [PRO-191]
This function extracts relevant details from a violation object, including selector, ancestry, xpath, and landmark information. [PRO-192]
This change introduces additional selectors (selector, ancestry, xpath) to the Insert_Rule_Data method, improving the flexibility and functionality of rule data insertion. [PRO-193]
Enhanced the insert method to accept additional parameters for selectors and ancestry, improving the flexibility of rule insertion. [PRO-193]
WalkthroughThe changes add support for three new selector-related fields— Changes
Sequence Diagram(s)sequenceDiagram
participant Scanner (JS)
participant REST API (PHP)
participant Insert_Rule_Data
participant Database
Scanner (JS)->>REST API (PHP): POST scan results (includes selector, ancestry, xpath)
REST API (PHP)->>Insert_Rule_Data: insert(post, rule, ..., selectors)
Insert_Rule_Data->>Database: INSERT/UPDATE with selector, ancestry, xpath fields
Database-->>Insert_Rule_Data: Success/Failure
Insert_Rule_Data-->>REST API (PHP): Result
REST API (PHP)-->>Scanner (JS): Response
Possibly related PRs
Suggested reviewers
Poem
Warning There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure. 🔧 ESLint
npm error Exit handler never called! 📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (5)
🧰 Additional context used🧠 Learnings (2)📓 Common learningssrc/pageScanner/index.js (1)🧬 Code Graph Analysis (1)includes/classes/class-rest-api.php (1)
🔇 Additional comments (8)
✨ Finishing Touches
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Summary of Changes
Hello @pattonwebz, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!
This pull request significantly enhances the accessibility checker's ability to provide detailed feedback by enabling the storage and processing of comprehensive element selector information. By capturing CSS selectors, ancestry, and XPath, the system can now offer more precise highlighting and identification of accessibility violations in the frontend, improving the overall user experience for debugging and remediation.
Highlights
- Backend Data Storage Enhancement: I've updated the database schema and backend logic to store more granular selector-related data (
selector,ancestry,xpath) for accessibility violations. This includes modifications to theInsert_Rule_Dataclass to accept and persist this new information. - REST API Integration: The
set_post_scan_resultsmethod in the REST API has been updated to extract and pass the newly availableselector,ancestry, andxpathdata from frontend scan results to the backend database insertion process. - Frontend Data Collection and Refactoring: On the frontend, the
scanfunction insrc/pageScanner/index.jshas been refactored. I've introduced a newprocessViolationhelper function that encapsulates the logic for extracting and formatting violation data, now includingancestryandxpathalongside the existingselectorinformation. - Database Version Update: To reflect the schema changes, I've incremented the database version from
1.0.4to1.0.5inaccessibility-checker.php.
Using Gemini Code Assist
The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.
Invoking Gemini
You can request assistance from Gemini at any point in your pull request via creating an issue comment (i.e. comment on the pull request page) using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands.
| Feature | Command | Description |
|---|---|---|
| Code Review | /gemini review |
Performs a code review for the current pull request in its current state. |
| Pull Request Summary | /gemini summary |
Provides a summary of the current pull request in its current state. |
| Comment | @gemini-code-assist | Responds in comments when explicitly tagged, both in issue comments and review comments. |
| Help | /gemini help |
Displays a list of available commands. |
Customization
To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.
Limitations & Feedback
Gemini Code Assist is currently in preview and may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments to provide feedback.
You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.
Footnotes
-
Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩
There was a problem hiding this comment.
Pull Request Overview
This PR enhances the accessibility checker by capturing and persisting detailed selector metadata (selector, ancestry, xpath) through the full scan lifecycle for improved frontend highlighting.
- Refactors frontend scanning in
src/pageScanner/index.jsto use aprocessViolationhelper that includes new selector fields. - Updates REST API (
class-rest-api.php) and insertion logic (class-insert-rule-data.php) to accept and store the selector metadata. - Adds new database columns (
selector,ancestry,xpath) and bumps the DB version to1.0.5.
Reviewed Changes
Copilot reviewed 5 out of 5 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| src/pageScanner/index.js | Introduced processViolation helper to include selector, ancestry, and xpath. |
| includes/classes/class-rest-api.php | Passed a $selectors array into Insert_Rule_Data::insert. |
| admin/class-update-database.php | Added selector, ancestry, and xpath columns to the schema. |
| admin/class-insert-rule-data.php | Extended insert signature and mapped new selector fields into inserts/updates. |
| accessibility-checker.php | Incremented EDAC_DB_VERSION from 1.0.4 to 1.0.5. |
Comments suppressed due to low confidence (1)
includes/classes/class-rest-api.php:386
- No tests currently cover the new selector metadata flow. Add integration or unit tests for set_post_scan_results to verify that selector, ancestry, and xpath fields are correctly passed to Insert_Rule_Data.
$selectors = [
There was a problem hiding this comment.
Code Review
This pull request enhances the accessibility checker by storing more detailed selector information in the database. The changes span the backend PHP code and the frontend JavaScript scanner. A critical issue was identified in the new JavaScript helper and a high-severity issue in the PHP REST API handler that could lead to runtime errors and incorrect data handling.
SteveJonesDev
left a comment
SteveJonesDev
left a comment
There was a problem hiding this comment.
Tested locally and appears to function properly.
This pull request introduces enhancements to the accessibility checker by adding support for additional selector-related data (
selector,ancestry,xpath) in various parts of the system, including database schema, backend logic, and frontend processing. The changes improve the granularity of accessibility rule data and streamline the processing of violations in the frontend.Backend Enhancements:
Insert_Rule_Dataclass to include new parameters (selectors) and handle additional fields (selector,ancestry,xpath) in database operations. This includes changes to theinsertmethod signature, database updates, and sanitization logic. [1] [2] [3] [4]edac_update_databaseto add new columns (selector,ancestry,xpath) for storing detailed selector data.set_post_scan_resultsmethod in the REST API to pass the new selector data structure when inserting rule data.Frontend Enhancements:
scanfunction insrc/pageScanner/index.jsto use a new helper function,processViolation, for processing violations. This helper encapsulates logic for extracting and formatting selector-related data (selector,ancestry,xpath). [1] [2]Version Update:
1.0.4to1.0.5inaccessibility-checker.phpto reflect schema changes.Summary by CodeRabbit