-
Notifications
You must be signed in to change notification settings - Fork 29.2k
Fix SliverMainAxisGroup scrollOffsetCorrection #174369
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix SliverMainAxisGroup scrollOffsetCorrection #174369
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Code Review
This pull request fixes an issue where SliverMainAxisGroup
did not correctly handle scrollOffsetCorrection
from its children. The change adds logic to RenderSliverMainAxisGroup
to check for and propagate this correction, which is the correct approach. A comprehensive regression test has been added to verify the fix in a scenario with a dynamically changing list. My review focuses on improving the new test's maintainability by addressing code duplication and inconsistency.
testWidgets( | ||
'With SliverList can handle inaccurate scroll offset due to changes in children list', | ||
(WidgetTester tester) async { | ||
bool skip = true; | ||
Widget buildItem(BuildContext context, int index) { | ||
return !skip || index.isEven | ||
? Card( | ||
child: ListTile(title: Text('item$index', style: const TextStyle(fontSize: 80))), | ||
) | ||
: Container(); | ||
} | ||
|
||
await tester.pumpWidget( | ||
MaterialApp( | ||
theme: ThemeData(useMaterial3: false), | ||
home: Scaffold( | ||
body: CustomScrollView( | ||
slivers: <Widget>[ | ||
SliverMainAxisGroup( | ||
slivers: <Widget>[ | ||
SliverList(delegate: SliverChildBuilderDelegate(buildItem, childCount: 30)), | ||
], | ||
), | ||
], | ||
), | ||
), | ||
), | ||
); | ||
// Only even items 0~12 are on the screen. | ||
expect(find.text('item0'), findsOneWidget); | ||
expect(find.text('item12'), findsOneWidget); | ||
expect(find.text('item14'), findsNothing); | ||
|
||
await tester.drag(find.byType(CustomScrollView), const Offset(0.0, -750.0)); | ||
await tester.pump(); | ||
// Only even items 16~28 are on the screen. | ||
expect(find.text('item15'), findsNothing); | ||
expect(find.text('item16'), findsOneWidget); | ||
expect(find.text('item28'), findsOneWidget); | ||
|
||
skip = false; | ||
await tester.pumpWidget( | ||
MaterialApp( | ||
home: Scaffold( | ||
body: CustomScrollView( | ||
slivers: <Widget>[ | ||
SliverMainAxisGroup( | ||
slivers: <Widget>[ | ||
SliverList(delegate: SliverChildBuilderDelegate(buildItem, childCount: 30)), | ||
], | ||
), | ||
], | ||
), | ||
), | ||
), | ||
); | ||
|
||
// Only items 12~19 are on the screen. | ||
expect(find.text('item11'), findsNothing); | ||
expect(find.text('item12'), findsOneWidget); | ||
expect(find.text('item19'), findsOneWidget); | ||
expect(find.text('item20'), findsNothing); | ||
|
||
await tester.drag(find.byType(CustomScrollView), const Offset(0.0, 250.0)); | ||
await tester.pump(); | ||
|
||
// Only items 10~16 are on the screen. | ||
expect(find.text('item9'), findsNothing); | ||
expect(find.text('item10'), findsOneWidget); | ||
expect(find.text('item16'), findsOneWidget); | ||
expect(find.text('item17'), findsNothing); | ||
|
||
// The inaccurate scroll offset should reach zero at this point | ||
await tester.drag(find.byType(CustomScrollView), const Offset(0.0, 250.0)); | ||
await tester.pump(); | ||
|
||
// Only items 7~13 are on the screen. | ||
expect(find.text('item6'), findsNothing); | ||
expect(find.text('item7'), findsOneWidget); | ||
expect(find.text('item13'), findsOneWidget); | ||
expect(find.text('item14'), findsNothing); | ||
|
||
// It will be corrected as we scroll, so we have to drag multiple times. | ||
await tester.drag(find.byType(CustomScrollView), const Offset(0.0, 250.0)); | ||
await tester.pump(); | ||
await tester.drag(find.byType(CustomScrollView), const Offset(0.0, 250.0)); | ||
await tester.pump(); | ||
await tester.drag(find.byType(CustomScrollView), const Offset(0.0, 250.0)); | ||
await tester.pump(); | ||
|
||
// Only items 0~6 are on the screen. | ||
expect(find.text('item0'), findsOneWidget); | ||
expect(find.text('item6'), findsOneWidget); | ||
expect(find.text('item7'), findsNothing); | ||
}, | ||
); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The MaterialApp
widget is constructed twice in this test, and the two instances are inconsistent as the second one (line 1243) is missing the theme
property. This could lead to subtle differences in widget sizes, making the test less reliable.1
To improve readability, reduce duplication, and ensure consistency, consider extracting the widget creation into a local helper function.
For example:
Widget buildFrame() {
return MaterialApp(
theme: ThemeData(useMaterial3: false),
home: Scaffold(
body: CustomScrollView(
slivers: <Widget>[
SliverMainAxisGroup(
slivers: <Widget>[
SliverList(delegate: SliverChildBuilderDelegate(buildItem, childCount: 30)),
],
),
],
),
),
);
}
await tester.pumpWidget(buildFrame());
// ...
skip = false;
await tester.pumpWidget(buildFrame());
Style Guide References
Footnotes
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
That's not a bad point. Are the two pumpWidgets sections of the test self contained too? Maybe you could split it into two separate tests.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Both calls of tester.pumpWidget
in same test are necessary to update the widgets tree with skip=true/false
that trigger a SliverGeometry.scrollOffsetCorrection and thus reproduce the issue.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@justinmc, , can I resolve this ? As mentioned before, both calls to tester.pumpWidget
are necessary in this test. The second call uses the skip variable to modify the SliverList
state, which is precisely what triggers the SliverGeometry.scrollOffsetCorrection
we need to verify.
@Piinks Tagged you for review since this is about Slivers. I also plan to take a look. |
// Only even items 0~12 are on the screen. | ||
expect(find.text('item0'), findsOneWidget); | ||
expect(find.text('item12'), findsOneWidget); | ||
expect(find.text('item14'), findsNothing); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nit: You could loop through 0-12 if you think it would be valuable to check everything.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hi @justinmc, thanks for your review. FYI, this test is a duplicate of "slivers_test.dart" -> "SliverList can handle inaccurate scroll offset due to changes in children list".
I modified the test with a loop, as you suggested.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is it ok for you @justinmc ?
testWidgets( | ||
'With SliverList can handle inaccurate scroll offset due to changes in children list', | ||
(WidgetTester tester) async { | ||
bool skip = true; | ||
Widget buildItem(BuildContext context, int index) { | ||
return !skip || index.isEven | ||
? Card( | ||
child: ListTile(title: Text('item$index', style: const TextStyle(fontSize: 80))), | ||
) | ||
: Container(); | ||
} | ||
|
||
await tester.pumpWidget( | ||
MaterialApp( | ||
theme: ThemeData(useMaterial3: false), | ||
home: Scaffold( | ||
body: CustomScrollView( | ||
slivers: <Widget>[ | ||
SliverMainAxisGroup( | ||
slivers: <Widget>[ | ||
SliverList(delegate: SliverChildBuilderDelegate(buildItem, childCount: 30)), | ||
], | ||
), | ||
], | ||
), | ||
), | ||
), | ||
); | ||
// Only even items 0~12 are on the screen. | ||
expect(find.text('item0'), findsOneWidget); | ||
expect(find.text('item12'), findsOneWidget); | ||
expect(find.text('item14'), findsNothing); | ||
|
||
await tester.drag(find.byType(CustomScrollView), const Offset(0.0, -750.0)); | ||
await tester.pump(); | ||
// Only even items 16~28 are on the screen. | ||
expect(find.text('item15'), findsNothing); | ||
expect(find.text('item16'), findsOneWidget); | ||
expect(find.text('item28'), findsOneWidget); | ||
|
||
skip = false; | ||
await tester.pumpWidget( | ||
MaterialApp( | ||
home: Scaffold( | ||
body: CustomScrollView( | ||
slivers: <Widget>[ | ||
SliverMainAxisGroup( | ||
slivers: <Widget>[ | ||
SliverList(delegate: SliverChildBuilderDelegate(buildItem, childCount: 30)), | ||
], | ||
), | ||
], | ||
), | ||
), | ||
), | ||
); | ||
|
||
// Only items 12~19 are on the screen. | ||
expect(find.text('item11'), findsNothing); | ||
expect(find.text('item12'), findsOneWidget); | ||
expect(find.text('item19'), findsOneWidget); | ||
expect(find.text('item20'), findsNothing); | ||
|
||
await tester.drag(find.byType(CustomScrollView), const Offset(0.0, 250.0)); | ||
await tester.pump(); | ||
|
||
// Only items 10~16 are on the screen. | ||
expect(find.text('item9'), findsNothing); | ||
expect(find.text('item10'), findsOneWidget); | ||
expect(find.text('item16'), findsOneWidget); | ||
expect(find.text('item17'), findsNothing); | ||
|
||
// The inaccurate scroll offset should reach zero at this point | ||
await tester.drag(find.byType(CustomScrollView), const Offset(0.0, 250.0)); | ||
await tester.pump(); | ||
|
||
// Only items 7~13 are on the screen. | ||
expect(find.text('item6'), findsNothing); | ||
expect(find.text('item7'), findsOneWidget); | ||
expect(find.text('item13'), findsOneWidget); | ||
expect(find.text('item14'), findsNothing); | ||
|
||
// It will be corrected as we scroll, so we have to drag multiple times. | ||
await tester.drag(find.byType(CustomScrollView), const Offset(0.0, 250.0)); | ||
await tester.pump(); | ||
await tester.drag(find.byType(CustomScrollView), const Offset(0.0, 250.0)); | ||
await tester.pump(); | ||
await tester.drag(find.byType(CustomScrollView), const Offset(0.0, 250.0)); | ||
await tester.pump(); | ||
|
||
// Only items 0~6 are on the screen. | ||
expect(find.text('item0'), findsOneWidget); | ||
expect(find.text('item6'), findsOneWidget); | ||
expect(find.text('item7'), findsNothing); | ||
}, | ||
); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
That's not a bad point. Are the two pumpWidgets sections of the test self contained too? Maybe you could split it into two separate tests.
@@ -1197,6 +1197,103 @@ void main() { | |||
expect(tester.getBottomRight(find.byKey(key)), offset - const Offset(0.0, 20.0)); | |||
}, | |||
); | |||
|
|||
testWidgets( | |||
'With SliverList can handle inaccurate scroll offset due to changes in children list', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I confirmed that this test fails on master.
if (childLayoutGeometry case SliverGeometry( | ||
:final double scrollOffsetCorrection, | ||
) when scrollOffsetCorrection != 0) { | ||
geometry = SliverGeometry(scrollOffsetCorrection: scrollOffsetCorrection); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I'll defer to @Piinks on whether this is the right way to solve this.
if (childLayoutGeometry case SliverGeometry( | ||
:final double scrollOffsetCorrection, | ||
) when scrollOffsetCorrection != 0) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can you write this differently? We have not adopted this pattern in the framework because it can be hard for readability in some cases.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Done !
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@yiiim may also be interested in this, they have made a lot of changes here recently.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This LGTM, thank you for the contribution!
There are some merge conflicts that need to be resolved here, and then this should be good to go! |
0dec903
to
482c7ea
Compare
flutter/flutter@87d5b75...973320c 2025-09-08 engine-flutter-autoroll@skia.org Roll Fuchsia Linux SDK from V_KooYFGRmGm6JrqM... to m7Qmvj5wtfPlMA8i8... (flutter/flutter#175067) 2025-09-08 engine-flutter-autoroll@skia.org Roll Packages from cab2ac2 to 24588c6 (1 revision) (flutter/flutter#175070) 2025-09-08 engine-flutter-autoroll@skia.org Roll Skia from e1a200e25998 to 0c2b0a00b7b5 (1 revision) (flutter/flutter#175065) 2025-09-08 engine-flutter-autoroll@skia.org Roll Dart SDK from c7518d480c73 to 83c6b6124380 (1 revision) (flutter/flutter#175064) 2025-09-08 engine-flutter-autoroll@skia.org Roll Skia from 87ee27220133 to e1a200e25998 (4 revisions) (flutter/flutter#175061) 2025-09-08 bkonyi@google.com [ Widget Preview ] Improve `--machine` output (flutter/flutter#175003) 2025-09-08 bruno.leroux@gmail.com Fix DropdownMenuFormField does not clear text field content on reset … (flutter/flutter#174937) 2025-09-08 engine-flutter-autoroll@skia.org Roll Skia from 310062ae6aee to 87ee27220133 (1 revision) (flutter/flutter#175051) 2025-09-08 engine-flutter-autoroll@skia.org Roll Dart SDK from 34cd2b4b56dd to c7518d480c73 (1 revision) (flutter/flutter#175049) 2025-09-07 engine-flutter-autoroll@skia.org Roll Skia from b00ca433657b to 310062ae6aee (1 revision) (flutter/flutter#175046) 2025-09-07 engine-flutter-autoroll@skia.org Roll Fuchsia Linux SDK from LRAtLJWUiZNmSVShG... to V_KooYFGRmGm6JrqM... (flutter/flutter#175040) 2025-09-07 engine-flutter-autoroll@skia.org Roll Skia from 064cf12ad0cc to b00ca433657b (1 revision) (flutter/flutter#175028) 2025-09-06 engine-flutter-autoroll@skia.org Roll Fuchsia Linux SDK from xG_uERsxHvUwFHpF2... to LRAtLJWUiZNmSVShG... (flutter/flutter#175018) 2025-09-06 engine-flutter-autoroll@skia.org Roll Dart SDK from f138e58bcf6d to 34cd2b4b56dd (2 revisions) (flutter/flutter#175017) 2025-09-06 engine-flutter-autoroll@skia.org Roll Skia from 5c60f8a66270 to 064cf12ad0cc (2 revisions) (flutter/flutter#175015) 2025-09-05 engine-flutter-autoroll@skia.org Roll Skia from f29ea2795934 to 5c60f8a66270 (2 revisions) (flutter/flutter#175010) 2025-09-05 108678139+manu-sncf@users.noreply.github.com Fix SliverMainAxisGroup scrollOffsetCorrection (flutter/flutter#174369) 2025-09-05 engine-flutter-autoroll@skia.org Roll Skia from 759f406584da to f29ea2795934 (3 revisions) (flutter/flutter#175000) 2025-09-05 engine-flutter-autoroll@skia.org Roll Dart SDK from 5e3afb74ffdf to f138e58bcf6d (15 revisions) (flutter/flutter#174994) 2025-09-05 engine-flutter-autoroll@skia.org Roll Packages from 98580c6 to cab2ac2 (2 revisions) (flutter/flutter#174998) 2025-09-05 41930132+hellohuanlin@users.noreply.github.com [ios26]fix host engine compile error (flutter/flutter#174723) 2025-09-05 30870216+gaaclarke@users.noreply.github.com Added note about how to compile licenses_cpp (flutter/flutter#174947) 2025-09-05 engine-flutter-autoroll@skia.org Roll Skia from 845ec125e94c to 759f406584da (3 revisions) (flutter/flutter#174992) 2025-09-05 mdebbar@google.com [web] Minor simplification in flutter.js loader (flutter/flutter#174963) 2025-09-05 30870216+gaaclarke@users.noreply.github.com deletes the old license checker. (flutter/flutter#174719) If this roll has caused a breakage, revert this CL and stop the roller using the controls here: https://autoroll.skia.org/r/flutter-packages Please CC stuartmorgan@google.com,tarrinneal@google.com on the revert to ensure that a human is aware of the problem. To file a bug in Packages: https://github.com/flutter/flutter/issues/new/choose To report a problem with the AutoRoller itself, please file a bug: https://issues.skia.org/issues/new?component=1389291&template=1850622 Documentation for the AutoRoller is here: https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md
Fixes : #174368
Pre-launch Checklist
///
).If you need help, consider asking for advice on the #hackers-new channel on Discord.
Note: The Flutter team is currently trialing the use of Gemini Code Assist for GitHub. Comments from the
gemini-code-assist
bot should not be taken as authoritative feedback from the Flutter team. If you find its comments useful you can update your code accordingly, but if you are unsure or disagree with the feedback, please feel free to wait for a Flutter team member's review for guidance on which automated comments should be addressed.