seth
/
jam-cloud
mirror of https://bitbucket.org/jamkazam/jam-cloud.git
1
0
Fork 0
Code Issues Actions Packages Projects Releases Wiki Activity

fix(uat-02-01): add defensive checks for NaN values in playback monitoring 

Addresses UAT-002 (to be logged): Player showing NaN:NaN for time displays

Problem: jamClient methods returning undefined/null/NaN values causing
time displays to show "NaN:NaN" and slider to position incorrectly.

Solution:
- Add null/NaN checks to formatTime utility (return "0:00" for invalid values)
- Add validation in initialization useEffect for duration values
- Add validation in polling useEffect for position and duration values
- Add console logging to diagnose what jamClient methods are returning

This ensures the UI displays valid times even when jamClient returns
unexpected values, and provides logging to diagnose the root cause.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
Nuwan 2026-01-14 10:40:39 +05:30
parent 94d43fe9ce
commit 0561c8988b
1 changed files with 22 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
jam-ui/src/components/client/JKSessionBackingTrackPlayer.js
View File

@ -26,6 +26,10 @@ const JKSessionBackingTrackPlayer = ({
// Utility function to format milliseconds to M:SS format
const formatTime = (ms) => {
// Handle undefined, null, or NaN values
if (ms == null || isNaN(ms) || ms < 0) {
return '0:00';
}
const seconds = Math.floor(ms / 1000);
const minutes = Math.floor(seconds / 60);
const remainingSeconds = seconds % 60;
@ -42,8 +46,12 @@ const JKSessionBackingTrackPlayer = ({
// Fetch and set duration immediately when track loads
try {
const durationInMs = jamClient.SessionGetTracksPlayDurationMs();
setDurationMs(durationInMs);
setDuration(formatTime(durationInMs));
console.log('JKSessionBackingTrackPlayer: Duration from jamClient:', durationInMs, 'Type:', typeof durationInMs);
// Ensure we have a valid number
const validDuration = (durationInMs != null && !isNaN(durationInMs) && durationInMs >= 0) ? durationInMs : 0;
setDurationMs(validDuration);
setDuration(formatTime(validDuration));
} catch (error) {
console.error('Error fetching track duration:', error);
setDuration('0:00');
@ -66,10 +74,16 @@ const JKSessionBackingTrackPlayer = ({
const durationInMs = jamClient.SessionGetTracksPlayDurationMs();
const trackIsPlaying = jamClient.isSessionTrackPlaying();
setCurrentPositionMs(positionMs);
setCurrentTime(formatTime(positionMs));
setDurationMs(durationInMs);
setDuration(formatTime(durationInMs));
console.log('JKSessionBackingTrackPlayer polling:', { positionMs, durationInMs, trackIsPlaying });
// Ensure valid numbers
const validPosition = (positionMs != null && !isNaN(positionMs) && positionMs >= 0) ? positionMs : 0;
const validDuration = (durationInMs != null && !isNaN(durationInMs) && durationInMs >= 0) ? durationInMs : 0;
setCurrentPositionMs(validPosition);
setCurrentTime(formatTime(validPosition));
setDurationMs(validDuration);
setDuration(formatTime(validDuration));
// Sync playing state if changed
if (trackIsPlaying !== isPlaying) {
@ -353,7 +367,7 @@ const JKSessionBackingTrackPlayer = ({
onClick={handlePlay}
disabled={!backingTrack}
>
<FontAwesomeIcon icon={isPlaying ? faPause : faPlay} />
<FontAwesomeIcon icon={isPlaying ? faPause : faPlay} /> Play/Pause
</Button>
<Button
@ -361,7 +375,7 @@ const JKSessionBackingTrackPlayer = ({
onClick={handleStop}
disabled={!backingTrack}
>
<FontAwesomeIcon icon={faStop} />
<FontAwesomeIcon icon={faStop} /> Stop
</Button>
</div>