Skip to content

Fix Slider property update freezing UI#13002

Closed
hannahblair wants to merge 2 commits intomainfrom
slider-freeze
Closed

Fix Slider property update freezing UI#13002
hannahblair wants to merge 2 commits intomainfrom
slider-freeze

Conversation

@hannahblair
Copy link
Collaborator

Summary

  • Fixes UI freeze when updating Slider properties (visibility, range) via button callbacks (Slider property update freezes UI in Gradio ≥6.6.0 (works in 6.5.1) #12995)
  • Removed redundant range_input.value direct DOM write that conflicted with Svelte's bind:value, causing value clamping against stale min/max and triggering infinite update loops
  • Made range_input reactive ($state) so the CSS progress effect re-runs when the element becomes available after visibility toggle
  • Used untrack for old_value write in change detection effect to prevent unnecessary re-runs
  • Reordered min/max attributes before bind:value on the range input to prevent browser clamping

Test plan

  • Existing slider unit tests pass (Slider.test.ts - 2/2)
  • Verify with reproduction script (Variant 1 - gr.update(visible=True))
  • Verify with reproduction script (Variant 2 - gr.Slider(...) constructor)
  • Confirm slider CSS progress bar renders correctly after visibility toggle
  • Confirm change events still fire correctly (including value=0)

Closes #12995

🤖 Generated with Claude Code

The $effect that synced range_input.value directly conflicted with
bind:value, causing value clamping against stale min/max attributes.
This led to infinite update loops when slider properties (visibility,
range) were updated via callbacks.

Three fixes:
- Remove redundant range_input.value set (bind:value handles this)
- Guard against range_input being undefined when visible=false
- Use untrack for old_value write to prevent unnecessary effect re-runs
- Reorder min/max attributes before bind:value to prevent clamping

Fixes #12995

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@gradio-pr-bot
Copy link
Collaborator

gradio-pr-bot commented Mar 12, 2026

🪼 branch checks and previews

Name Status URL
Spaces ready! Spaces preview
Storybook failed! Details
🦄 Changes detected! Details

Install Gradio from this PR

pip install https://gradio-pypi-previews.s3.amazonaws.com/546f26af7f35634ac424821d2e8a85a2f99b9739/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@546f26af7f35634ac424821d2e8a85a2f99b9739#subdirectory=client/python"

Install Gradio JS Client from this PR

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

@gradio-pr-bot
Copy link
Collaborator

🦄 change detected

This Pull Request includes changes to the following packages.

Package Version
@gradio/slider patch
gradio patch

  • Fix Slider property update freezing UI

‼️ Changeset not approved. Ensure the version bump is appropriate for all packages before approving.

  • Maintainers can approve the changeset by checking this checkbox.

Something isn't right?

  • Maintainers can change the version label to modify the version bump.
  • If the bot has failed to detect any changes, or if this pull request needs to update multiple packages to different versions or requires a more comprehensive changelog entry, maintainers can update the changelog file directly.

@hannahblair
Copy link
Collaborator Author

testing kumquat but forgot to update branch

@hannahblair hannahblair deleted the slider-freeze branch March 12, 2026 15:07
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.

Slider property update freezes UI in Gradio ≥6.6.0 (works in 6.5.1)

2 participants