Phrase mode: browser debug hook (localStorage.phraseDebug)

This commit is contained in:
2026-09-14 01:16:21 +02:00
parent 9cb78b39d5
commit 486f3c5dcd

View File

@@ -9,7 +9,7 @@
* show a warning and an explicit octave-shift control rather than blocking * show a warning and an explicit octave-shift control rather than blocking
* the run; notes outside the playable range simply cannot be matched by mic. * the run; notes outside the playable range simply cannot be matched by mic.
*/ */
import { forwardRef, useCallback, useImperativeHandle, useMemo, useRef, useState } from 'react'; import { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
import { useSettings } from '../context/useSettings'; import { useSettings } from '../context/useSettings';
import { useAudioPlayer } from '../hooks/useAudioPlayer'; import { useAudioPlayer } from '../hooks/useAudioPlayer';
import { usePhraseTrainer, type PhraseTrainerApi } from '../hooks/usePhraseTrainer'; import { usePhraseTrainer, type PhraseTrainerApi } from '../hooks/usePhraseTrainer';
@@ -280,6 +280,26 @@ export const PhraseTrainer = forwardRef<PhraseHandle, PhraseTrainerProps>(
const staffWidth = Math.min(windowWidth - 40, 860); const staffWidth = Math.min(windowWidth - 40, 860);
// Debug hook for real-browser QA (enable with localStorage.phraseDebug = '1')
useEffect(() => {
if (typeof window === 'undefined') return;
const w = window as unknown as { __phraseDebug?: unknown };
if (localStorage.getItem('phraseDebug') === '1') {
w.__phraseDebug = () => ({
phase: trainer.phase,
currentIdx: trainer.currentIdx,
statuses: [...trainer.statuses],
summary: trainer.summary,
pool: [...pool],
firstNote: events[0]?.pitch?.midi ?? null,
scoreOk,
material: phrase.material,
});
} else {
delete w.__phraseDebug;
}
});
// ---- Render --------------------------------------------------------------- // ---- Render ---------------------------------------------------------------
return ( return (
<div className={`card sheet-music-card phrase-card ${(settings.showHint || settings.showFretboard) ? 'has-hint' : ''}`}> <div className={`card sheet-music-card phrase-card ${(settings.showHint || settings.showFretboard) ? 'has-hint' : ''}`}>