Graph Page Testing
by th309
A comprehensive skill to test, analyze, and fix the PropertyIQ graphs page.
Skill Details
Repository Files
2 files in this skill directory
name: Graph Page Testing description: A comprehensive skill to test, analyze, and fix the PropertyIQ graphs page.
Graph Page Testing Skill
This skill provides tools and workflows to ensure the PropertyIQ graphs page (/graphs) is functioning correctly, aligned with the map data sources, and presenting accurate data.
Capabilities
- Alignment Verification: Checks if the graphs page uses the same metric definitions and order as the map sidebar.
- Data Fetching Validation: Tests the backend API endpoints for time-series data to ensure availability and correct format.
- Component Analysis: Reviews React components for correct state management and rendering logic.
Resources
- Test Script:
scripts/run-tests.ts- Runs a suite of API tests against the local backend. - Reference Configs:
packages/frontend/app/map/config/metrics.tspackages/frontend/app/map/config/metric-categories.tsx
Usage
1. Run Data Tests
To verify that the backend is serving the correct time-series data for the graph metrics:
npx tsx .agent/skills/graph_page_testing/scripts/run-tests.ts
2. Verify Metric Alignment
The graphs page should use the centralized metric configuration. check:
packages/frontend/app/graphs/constants.tsshould import fromapp/map/config/...packages/frontend/app/graphs/hooks/useDashboardState.tsshould useuseAllMetricOptions
Troubleshooting
- "No data returned (empty array)": This typically means the local database does not have data for the requested region/metric. Ensure data ingestion has been run.
- "HTTP 404/500": Check the backend logs. Mismatch in
timeseries.service.tsmapping or missing table.
Maintenance
When adding new metrics to metric-categories.tsx, they automatically propagate to the graphs page. No manual update to graphs/constants.ts is required as it now dynamically imports the ordered list.
Related Skills
Dbt Transformation Patterns
Master dbt (data build tool) for analytics engineering with model organization, testing, documentation, and incremental strategies. Use when building data transformations, creating data models, or implementing analytics engineering best practices.
Senior Data Scientist
World-class data science skill for statistical modeling, experimentation, causal inference, and advanced analytics. Expertise in Python (NumPy, Pandas, Scikit-learn), R, SQL, statistical methods, A/B testing, time series, and business intelligence. Includes experiment design, feature engineering, model evaluation, and stakeholder communication. Use when designing experiments, building predictive models, performing causal analysis, or driving data-driven decisions.
Hypogenic
Automated hypothesis generation and testing using large language models. Use this skill when generating scientific hypotheses from datasets, combining literature insights with empirical data, testing hypotheses against observational data, or conducting systematic hypothesis exploration for research discovery in domains like deception detection, AI content detection, mental health analysis, or other empirical research tasks.
Ux Researcher Designer
UX research and design toolkit for Senior UX Designer/Researcher including data-driven persona generation, journey mapping, usability testing frameworks, and research synthesis. Use for user research, persona creation, journey mapping, and design validation.
Hypogenic
Automated LLM-driven hypothesis generation and testing on tabular datasets. Use when you want to systematically explore hypotheses about patterns in empirical data (e.g., deception detection, content analysis). Combines literature insights with data-driven hypothesis testing. For manual hypothesis formulation use hypothesis-generation; for creative ideation use scientific-brainstorming.
Data Engineering Data Driven Feature
Build features guided by data insights, A/B testing, and continuous measurement using specialized agents for analysis, implementation, and experimentation.
Dbt Transformation Patterns
Master dbt (data build tool) for analytics engineering with model organization, testing, documentation, and incremental strategies. Use when building data transformations, creating data models, or implementing analytics engineering best practices.
Dashboard Design
USE THIS SKILL FIRST when user wants to create and design a dashboard, ESPECIALLY Vizro dashboards. This skill enforces a 3-step workflow (requirements, layout, visualization) that must be followed before implementation. For implementation and testing, use the dashboard-build skill after completing Steps 1-3.
Ux Researcher Designer
UX research and design toolkit for Senior UX Designer/Researcher including data-driven persona generation, journey mapping, usability testing frameworks, and research synthesis. Use for user research, persona creation, journey mapping, and design validation.
Performance Testing
Benchmark indicator performance with BenchmarkDotNet. Use for Series/Buffer/Stream benchmarks, regression detection, and optimization patterns. Target 1.5x Series for StreamHub, 1.2x for BufferList.
