Skip to content

Add native Top Pages and Traffic Sources with real EmDash screenshots - #3

Merged
christopherjnelson merged 1 commit into
mainfrom
feat/native-pages-sources
Sep 30, 2026
Merged

christopherjnelson merged 1 commit into
mainfrom
feat/native-pages-sources

Conversation

@christopherjnelson

@christopherjnelson christopherjnelson commented Sep 30, 2026 •

Copy link
Copy Markdown
Member

Summary

Add Top Pages and Traffic Sources below the native overview and chart. Both tables show views and visitors for the first ten rows ranked by OpenAnalytics, using the same selected interval and configured timezone as the overview. Source labels retain referrer and UTM attribution without implying session metrics.

Split the admin coordinator into practical range, connection, overview, and report modules. Each analytics read can fail independently: successful metrics, chart, pages, and sources stay visible, with useful empty states and section-specific errors. Suspended sites now say Tracker installed · collection suspended when the installed tracker is enabled.

Keep private credentials server-only, preserve credential-bound tracker snapshots and existing revalidation behavior, validate/project upstream responses, and add no production dependencies. Public rendering still makes no OpenAnalytics read requests.

Screenshots

Captured from an actual running EmDash 1.0.1 admin instance with this plugin installed, authenticated through EmDash's development-only test path. A loopback HTTP OpenAnalytics fixture supplies synthetic connection metadata, comparison totals, chart points, pages, and sources. No production account or credential is used.

Overview

OpenAnalytics connection, date range, totals, comparison values, freshness, and chart

Top Pages and Traffic Sources

Native Top Pages and Traffic Sources tables

Narrow viewport

OpenAnalytics native admin page at a 640px viewport

Run pnpm screenshot to reproduce all three captures. The harness creates an isolated temporary SQLite database, starts EmDash and the HTTP fixture on reserved loopback ports, configures and validates the plugin through protected admin routes, waits for actual content and a stable chart canvas, then scans HTML, DOM, browser responses, logs, and screenshot artifacts before retaining images. A separate CI job runs the same workflow and uploads the captures. PNG scanning is supplemented by DOM/HTML checks; it is not OCR.

Testing

  • 129 tests, retaining the existing 96 and adding 33 meaningful cases.
  • Full pnpm check passes locally on Node 22.23.2 and Node 24.18.0: tests, typecheck, lint, formatting, build, package verification, npm dry run, and packed-artifact credential scanning.
  • Coverage includes exact range/timezone/limit, nullable and malformed rows/metadata, additive fields, empty results, credential leakage, auth/scope/suspension/rate-limit/server errors, actual HTTP timeout and redirect refusal, native Block Kit validation, and independent section failures.
  • Screenshot workflow passed repeatedly; all three captures were inspected personally and by an independent GPT-6-Luna Medium reviewer. Meaningful review findings were fixed, including source attribution wording, chart-animation completion, nested-scroll capture, connection validation assertions, and fixture-port collision protection.
  • GitHub CI passed the full checks on Node 22 and 24 and the actual EmDash screenshot workflow on Node 24, for both push and pull-request runs. The CI-produced screenshots were also downloaded and visually inspected.

Implementation footprint

Measure Merged PR #2 PR #3
Production TypeScript LOC 1,458 1,770 (+312)
Test TypeScript LOC 1,923 2,423 (+500)
Production modules 10 14
OpenAnalytics endpoints 3 5
Production dependencies 0 0
Development dependencies 8 14
Packed npm size ~19.3 kB 23,655 bytes (~23.7 kB)

Supported endpoints: site metadata, overview, timeseries, pages, and sources. The six added development dependencies run the real EmDash host and Playwright; the plugin remains native Block Kit with no browser application. Demo code and screenshots are excluded from the seven-file npm package. docs/implementation-footprint.md retains the concrete comparison with the Black Swamp AI n8n node and explains their different responsibilities.

Current contract details and pinned upstream references are in docs/upstream-contracts.md. OpenAnalytics sources are referrer/UTM tuples with views and distinct visitors; page session decorations can be null, especially for imported or incomplete data. The compact tables intentionally omit session fields. Native EmDash charts format timestamps in the browser timezone while analytics bucket/query timezone remains explicit; the page explains this. Native tables handle overflow, and screenshot automation accounts for EmDash's inner scroll container.

Scope

This PR adds only the two summary reports, practical admin organization, resilience improvements, and reproducible real-UI captures. Geography, devices, session/visitor browsing, custom events, funnels, revenue, web vitals, realtime, editor analytics, OAuth, account/site creation, pagination, custom filters, campaign building, and automatic polling remain out of scope.

Nothing has been published to npm. This PR is ready for review and is not automatically merged.

@christopherjnelson
christopherjnelson merged commit b143a78 into main Sep 30, 2026
6 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant