Open
Conversation
Detect QM 4.0+ via QM_Output_Html_DB_Queries::$client_side_rendered and load the collector-based integration. Fall back to the existing HTML override for QM 3.x.
Register a custom QM collector that extracts SQLite queries from $wpdb->queries and a server-side outputter that will render JSON data and JS for the QM 4.0 shadow DOM integration.
Inject toggle buttons into QM 4.0's Preact-rendered DB queries panel inside the shadow DOM. Uses MutationObserver to handle panel switches and re-renders.
Add separate test cases for QM 3.x (server-side HTML) and QM 4.0+ (Preact shadow DOM). Each test auto-skips when the other QM version is detected.
Use QM_VERSION constant for version detection instead of checking QM_Output_Html_DB_Queries::$client_side_rendered which isn't loaded at plugins_loaded time. Poll for shadow root instead of using MutationObserver, since attachShadow() doesn't trigger childList mutations. QM's module script is deferred, so its DOMContentLoaded handler fires after our inline script's handler. Fix e2e test to use button[role=tab] for QM 4.0 nav items.
- Escape JSON output with JSON_HEX_TAG to prevent XSS via </script> in query text. - Add timeout to shadow root polling (max 10 seconds). - Debounce MutationObserver to reduce overhead during re-renders. - Add missing await on toBeVisible() in QM 3.x test. - Add toPass() retry for SQLite toggle check in QM 4.0 test. - Document QM source reference for admin bar query filtering.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Query Monitor 4.0 switched from server-side PHP rendering to client-side Preact rendering inside a shadow DOM. This broke the existing SQLite query display integration, which overrides
output_query_row()— a method that QM 4.0 no longer calls.This PR adds QM 4.0 support while maintaining backward compatibility with QM 3.x:
boot.phpusingQM_VERSIONto choose between QM 3.x and 4.0+ integration paths.collector.php) that extracts SQLite queries from$wpdb->queriesand outputs them as JSON via a server-side outputter.query-monitor-sqlite.js) that polls for QM's shadow root and injects toggle buttons into the DB queries panel using a debounced MutationObserver.Fixes the CI failure introduced by QM 4.0 release.
Test Plan