Skip to content

fix Audio input in Multimodal Textbox not functional.#12999

Merged
freddyaboulton merged 2 commits intogradio-app:mainfrom
JoaoPSC87:fix-audio-recording-svelte5
Mar 11, 2026
Merged

fix Audio input in Multimodal Textbox not functional.#12999
freddyaboulton merged 2 commits intogradio-app:mainfrom
JoaoPSC87:fix-audio-recording-svelte5

Conversation

@JoaoPSC87
Copy link
Contributor

Fixes #12985

Description

After the Svelte 5 migration, audio recording in MultimodalTextbox was broken. The microphone button would get stuck at 0:00 and the stop button wouldn't work.

Root cause:
In Svelte 5, plain let variables are not reactive, so the DOM does not update when their values change. The variables controlling recording state (is_recording, seconds, has_started, etc) were declared with let instead of $state().

Changes:

  • Convert reactive variables to $state() in MinimalAudioRecorder.svelte and MinimalAudioPlayer.svelte
  • Fix stop button logic to stop recording or clear depending on state
  • Add .catch() to startMic() for safe error handling

Closes: #12985

AI Disclosure

  • I did not use AI

🎯 PRs Should Target Issues

Closes #12985

Let variables did not have $state which made the stop
button and time counter not work correctly. Also
improved the stop button logic with an error catch
and a safe exit in case of an error.
Fixes gradio-app#12985
@freddyaboulton freddyaboulton added v: patch A change that requires a patch release t: fix A change that implements a fix labels Mar 11, 2026
Copy link
Collaborator

@freddyaboulton freddyaboulton left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks @JoaoPSC87 ! This lgtm

@gradio-pr-bot
Copy link
Collaborator

gradio-pr-bot commented Mar 11, 2026

🪼 branch checks and previews

Name Status URL
Spaces ready! Spaces preview
Storybook ready! Storybook preview
🦄 Changes failed! Workflow log

Install Gradio from this PR

pip install https://gradio-pypi-previews.s3.amazonaws.com/df032a1f08a08828fced3016b3b4258ae90e70cf/gradio-6.9.0-py3-none-any.whl

Install Gradio Python Client from this PR

pip install "gradio-client @ git+https://github.com/gradio-app/gradio@df032a1f08a08828fced3016b3b4258ae90e70cf#subdirectory=client/python"

Install Gradio JS Client from this PR

npm install https://gradio-npm-previews.s3.amazonaws.com/df032a1f08a08828fced3016b3b4258ae90e70cf/gradio-client-2.1.0.tgz

@freddyaboulton freddyaboulton merged commit f32d9d6 into gradio-app:main Mar 11, 2026
21 of 22 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

t: fix A change that implements a fix v: patch A change that requires a patch release

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Audio input in Multimodal Textbox not functional

3 participants