Skip to content

Sayali: resolve Firefox timer not stopping and audio not playing#5279

Open
sayali-2308 wants to merge 3 commits into
developmentfrom
Sayali_Fix_Firefox_Timer_Bug
Open

Sayali: resolve Firefox timer not stopping and audio not playing#5279
sayali-2308 wants to merge 3 commits into
developmentfrom
Sayali_Fix_Firefox_Timer_Bug

Conversation

@sayali-2308
Copy link
Copy Markdown
Contributor

image

Description

Fixes Firefox Timer Bug (Priority Medium)

Related PRs:

None — frontend only

Main changes explained:

  • Fixed Timer.jsx interval cleanup so the timer properly stops in Firefox by restructuring the useEffect to always return the clearInterval cleanup function with the correct interval ID
  • Fixed Firefox audio autoplay policy by wrapping all .play() calls in Promise handlers with .catch(() => {}) to prevent unhandled rejection errors
  • Added audioUnlockedRef and an unlock useEffect that silently primes both audio elements on first user click, bypassing Firefox's autoplay restrictions

How to test:

  1. Check out branch Sayali_Fix_Firefox_Timer_Bug
  2. npm install && npm run start:local
  3. Clear cache, log in as admin
  4. Open Firefox and go to localhost:5173
  5. Click anywhere on the page (to unlock audio)
  6. Start the timer and let it run to 0 — verify it stops automatically
  7. Verify the ding sound plays when timer hits 0
  8. Verify the Stop button manually stops the timer
  9. Verify dark mode works

Screenshots:

image

Note:

This is a frontend-only fix. No backend changes required. Bug was confirmed in Firefox — timer would not stop automatically and ding sound was silenced due to Firefox's strict autoplay policy.

@netlify
Copy link
Copy Markdown

netlify Bot commented May 16, 2026

Deploy Preview for highestgoodnetwork-dev ready!

Name Link
🔨 Latest commit 8830da3
🔍 Latest deploy log https://app.netlify.com/projects/highestgoodnetwork-dev/deploys/6a090bdbcded6d0008131b21
😎 Deploy Preview https://deploy-preview-5279--highestgoodnetwork-dev.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

@sonarqubecloud
Copy link
Copy Markdown

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