[SuperEditor][SuperReader] On desktop, with fixed height and in presence of a parent scrollable, doesn't scroll parent when over scrolled within editor

[rutvik110]

Issue:

On desktop, when a SuperEditor or SuperReader is given a fixed height, and is present within a parent scrollable like a ListView, over scrolling within the editor doesn't scroll the parent scrollable.

Reproducible example:

import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:super_editor/super_editor.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  late ScrollController _scrollController;
  late MutableDocument _doc;
  late MutableDocumentComposer _composer;
  late Editor _docEditor;

  @override
  void initState() {
    super.initState();
    _scrollController = ScrollController();
    _doc = _createInitialDocument();
    _composer = MutableDocumentComposer();

    _docEditor = createDefaultDocumentEditor(document: _doc, composer: _composer);
  }

  @override
  void dispose() {
    _doc.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Builder(builder: (context) {
        return ListView(
          padding: EdgeInsets.all(0),
          children: [
            SizedBox(
              height: MediaQuery.of(context).size.height * 0.5,
              width: double.infinity,
              child: const Placeholder(
                child: Center(
                  child: Text("Content"),
                ),
              ),
            ),
            SizedBox(
              height: 350,
              width: double.infinity,
              child: ListView(
                padding: EdgeInsets.all(0),
                children: [
                  SuperEditor(
                    document: _doc,
                    composer: _composer,
                    scrollController: _scrollController,
                    editor: _docEditor,
                  ),
                ],
              ),
            ),
            SizedBox(
              height: MediaQuery.of(context).size.height,
              width: double.infinity,
              child: const Placeholder(
                child: Center(
                  child: Text("Content"),
                ),
              ),
            ),
          ],
        );
      }),
    );
  }
}

MutableDocument _createInitialDocument() {
  return MutableDocument(
      nodes: List.generate(
    20,
    (index) => ParagraphNode(
        id: Editor.createNodeId(),
        text: AttributedText(
          "${index + 1} Scrollable content",
        )),
  ));
}

On desktop:

Screen.Recording.2024-01-14.at.1.59.42.PM.mov

But the issue isn't present on web. The parent scrollable scrolls as you overscroll within the editor.

Screen.Recording.2024-01-14.at.2.05.31.PM.mov

Expected behaviour:

Once the editor's scrollable content is consumed, it should scroll the parent scrollable if one's present and has scrollable content.

[rutvik110]

Currently, to give editor a fixed height within a scrollable, it's set up as follow,

SizedBox(
              height: 350,
              width: double.infinity,
              child: ListView(
                padding: EdgeInsets.all(0),
                children: [
                  SuperEditor(
                    document: _doc,
                    composer: _composer,
                    scrollController: _scrollController,
                    editor: _docEditor,
                  ),
                ],
              ),
            ),

Beside the page scrollable, I'm wrapping the editor with another scrollable after giving it an explicit height. This is to overcome the issue #1734.

This additional scrollable might be part of the problem, but I'm not sure yet coze this issue isn't seen on web.