Skip to content

Phase 6 findings — Tier 1 verification complete (latency-test-examples) #30

@fan-droide

Description

@fan-droide

Summary

All six framework integration examples in
https://github.com/idsinge/latency-test-examples have been verified
end-to-end against @adasp/latency-test@1.2.0 (npm + CDN where applicable).
This issue records every docs finding and code bug uncovered during that
pass, and requests explicit Phase 6 sign-off so Tier 2 work can begin.

Environment: Firefox 151.0.4 / macOS 15.4 aarch64 /
beyerdynamic DT 770 PRO 80Ω + built-in mic.


Docs findings (patches needed in this repo)

Svelte — self-closing tag triggers compiler warning

The docs snippet uses <latency-test ... /> (self-closing). Svelte 5
emits a build warning for void-like custom elements written this way.
Fix: use <latency-test ...></latency-test> (explicit close tag).
Verified against docs commit 208efe9.

Angular 22+ — zone.js and change detection not documented

Angular CLI 22 scaffolds a fully zoneless app by default — zone.js
is not included. The docs page needs a note covering:

  • Install zone.js manually: npm install zone.js --save
  • Add to app.config.ts: provideZoneChangeDetection({ eventCoalescing: true })
  • ChangeDetectorRef.markForCheck() is required after await getUserMedia()
    and inside CustomEvent callbacks — zone.js alone does not trigger change
    detection in these cases.
    Verified against docs commit 208efe9.

Next.js — JSX type declaration is required (React 19 claim is false)

The docs page states that React 19+ automatically picks up
HTMLElementTagNameMap entries for JSX. This is false in
Next.js 16 + @types/react 19.2.17. A manual declaration file is required:

// types/custom-elements.d.ts
declare module 'react' {
  namespace JSX {
    interface IntrinsicElements {
      'latency-test': React.DetailedHTMLProps<
        React.HTMLAttributes<HTMLElement>, HTMLElement
      >
    }
  }
}

Note: declare namespace JSX { ... } (without module 'react') targets
the wrong namespace in React 19 and does not work.
Verified against docs commit ffe9bbb.

Vanilla JS (CDN variant) — minor docs nits

Three small issues in the CDN snippet on the docs page:

  1. cdn.html example is missing a <title> element.
  2. No SRI hash on the CDN <script> tag (low priority, but worth noting
    since the docs advertise the CDN path as a zero-install option).
  3. Inline script runs synchronously without a customElements.whenDefined()
    guard — a pre-upgrade race if the script tag appears before the module
    loads. Adding await customElements.whenDefined('latency-test') or
    using type="module" removes the race.
    Verified against docs commit 8975f31779.

Docs bugs in connect() example code

Both bugs are in the host app's connect() function as shown in the
docs example — not in the component itself. The component's design
contract ("the host owns the AudioContext and MediaStream — the component
never closes or stops them") is not involved here. These are fixes to the
host-side example pattern the docs teach.

connect() does not reset error state on retry

If a previous run fired latency-error, the error state is never cleared
when the user retries. The stale error banner remains visible while the new
run proceeds, which is misleading.

Fix: call setError(null) (or equivalent) at the top of connect() and
also when the "Test Latency" button is clicked to start a new run.

connect() does not close AudioContext in the catch block

The connect() example creates an AudioContext synchronously, then
calls await getUserMedia(). If getUserMedia throws (mic denied, no
device), execution jumps to the catch block — but the AudioContext
created by the host is never closed there. Because getUserMedia failed,
the context was never assigned to the component, so this is entirely the
host's resource to clean up.

If the user retries, a second AudioContext is created and the first
is orphaned, holding audio hardware resources indefinitely.

Fix: in the catch block, add await audioCtxRef.current?.close(); audioCtxRef.current = null; before setting the error message. This is
purely host-side cleanup — the component is never involved.


Phase 6 sign-off request

Please confirm the sign-off criteria so Tier 2 work in
latency-test-examples can begin. Suggested criteria:

  • All docs findings above are either patched or explicitly accepted as known limitations
  • Docs bugs in connect() are either fixed or triaged with a known issue
  • This issue is closed (or a linked issue/PR marks Phase 6 done)

The Tier 2 gate in latency-test-examples/CLAUDE.md will not lift
until this sign-off lands.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions