Skip to content

fix: keep auto-sized carousel responsive after resize#908

Open
dohooo wants to merge 5 commits intomainfrom
caspian/fix-web-resize-890-retry
Open

fix: keep auto-sized carousel responsive after resize#908
dohooo wants to merge 5 commits intomainfrom
caspian/fix-web-resize-890-retry

Conversation

@dohooo
Copy link
Copy Markdown
Owner

@dohooo dohooo commented Mar 30, 2026

Summary

  • keep the rendered main axis at 100% when carousel sizing comes from automatic layout measurement
  • preserve explicit page-size behavior while avoiding the first measured width locking the container after mount
  • add issue Carousel V5 doesn't resize automatically after changing the window size #890 regressions that verify repeated onLayout updates keep size sync and rescale offset behavior

Root cause

CarouselLayout was using resolvedSize to drive the rendered container width in auto-size mode. After the first onLayout, that switched the horizontal main axis from 100% to a fixed pixel width, so later window or parent layout resizes no longer propagated naturally.

Verification

  • yarn test --runInBand src/components/Carousel.test.tsx -t "issue #890"
  • yarn test --runInBand src/components/Carousel.test.tsx src/hooks/useCommonVariables.test.tsx
  • yarn types

Closes #890.

@changeset-bot
Copy link
Copy Markdown

changeset-bot bot commented Mar 30, 2026

⚠️ No Changeset found

Latest commit: aa92a2d

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@vercel
Copy link
Copy Markdown

vercel bot commented Mar 30, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
react-native-reanimated-carousel Ready Ready Preview, Comment Mar 30, 2026 8:30am

Request Review

@dosubot dosubot bot added the size:L This PR changes 100-499 lines, ignoring generated files. label Mar 30, 2026
@codecov
Copy link
Copy Markdown

codecov bot commented Mar 30, 2026

Codecov Report

❌ Patch coverage is 77.77778% with 2 lines in your changes missing coverage. Please review.
✅ Project coverage is 84.78%. Comparing base (fec99d7) to head (aa92a2d).

Files with missing lines Patch % Lines
src/components/CarouselLayout.tsx 77.77% 0 Missing and 2 partials ⚠️
Additional details and impacted files
@@            Coverage Diff             @@
##             main     #908      +/-   ##
==========================================
+ Coverage   84.32%   84.78%   +0.45%     
==========================================
  Files          37       37              
  Lines        1040     1045       +5     
  Branches      362      365       +3     
==========================================
+ Hits          877      886       +9     
+ Misses         67       66       -1     
+ Partials       96       93       -3     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

size:L This PR changes 100-499 lines, ignoring generated files.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Carousel V5 doesn't resize automatically after changing the window size

1 participant