Telegram-iOS icon indicating copy to clipboard operation
Telegram-iOS copied to clipboard

Scrolling issue with Telegram Web Apps for Bots

Open NelepovDmitry opened this issue 1 year ago • 7 comments

Telegram Flutter scrolling bug Platforms - Android & iOS

Steps to reproduce

1.Create Flutter app with a simple ListView (like ListView.builder for example) 2.Deploy it on any host (or for test use https://todo.hubitproject.com/flutter_bug_ck) 3.Create Telegram bot or check test bot @hubit_test_flutter_bot 3.1. Open Telegram bot father @Botfather 3.2. Type /newbot 3.3. Enter a unique name 3.3. Enter a unique bot login 3.4. Type /setmenubutton 3.5. Enter a path to flutter app from step 2 (or for test use https://todo.hubitproject.com/flutter_bug_ck) 3.6. Enter button name, for example "Test Flutter" 4.Open bot from Mobile device 5.Tap button from step 3.6 6.Expand Web App to fullscreen by dragging topbar part of webapp 7. Try scroll up (finger move up) and down (finger move down) Expected result Scroll works correctly

Actual result Scrolling down is close telegram web app

Complete code of app deployed at https://todo.hubitproject.com/flutter_bug_ck

import 'dart:math';

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget { const MyApp({super.key});

// This widget is the root of your application. @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', theme: ThemeData( primarySwatch: Colors.blue, ), home: const HomeScreen(), ); } }

class HomeScreen extends StatefulWidget { const HomeScreen({super.key});

@override State<HomeScreen> createState() => _HomeScreenState(); }

class _HomeScreenState extends State<HomeScreen> { @override Widget build(BuildContext context) { return Scaffold( body: ListView.separated( itemBuilder: (context, index) { return Container( padding: const EdgeInsets.all(32), color: Color.fromARGB( 255, Random().nextInt(255), Random().nextInt(255), Random().nextInt(255), ), child: Text('Item $index'), ); }, separatorBuilder: (context, index) { return const SizedBox( height: 32, ); }, itemCount: 100), ); } }

flutter doctor -v result

[✓] Flutter (Channel stable, 3.3.10, on macOS 13.1 22C65 darwin-arm, locale en-RU) • Flutter version 3.3.10 on channel stable at /Users/rain/Dev/flutter • Upstream repository https://github.com/flutter/flutter.git • Framework revision 135454af32 (2 months ago), 2022-12-15 07:36:55 -0800 • Engine revision 3316dd8728 • Dart version 2.18.6 • DevTools version 2.15.0

[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0) • Android SDK at /Users/rain/Library/Android/sdk • Platform android-33, build-tools 33.0.0 • Java binary at: /Applications/Android Studio.app/Contents/jre/Contents/Home/bin/java • Java version OpenJDK Runtime Environment (build 11.0.13+0-b1751.21-8125866) • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 14.2) • Xcode at /Applications/Xcode.app/Contents/Developer • Build 14C18 • CocoaPods version 1.11.3

[✓] Chrome - develop for the web • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2021.3) • Android Studio at /Applications/Android Studio.app/Contents • Flutter plugin can be installed from: 🔨 https://plugins.jetbrains.com/plugin/9212-flutter • Dart plugin can be installed from: 🔨 https://plugins.jetbrains.com/plugin/6351-dart • Java version OpenJDK Runtime Environment (build 11.0.13+0-b1751.21-8125866)

[✓] IntelliJ IDEA Community Edition (version 2022.3.2) • IntelliJ at /Applications/IntelliJ IDEA CE.app • Flutter plugin version 72.0.4 • Dart plugin version 223.8617.8

[✓] VS Code (version 1.75.1) • VS Code at /Applications/Visual Studio Code.app/Contents • Flutter extension can be installed from: 🔨 https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter

[✓] Connected device (2 available) • macOS (desktop) • macos • darwin-arm64 • macOS 13.1 22C65 darwin-arm • Chrome (web) • chrome • web-javascript • Google Chrome 109.0.5414.119

[✓] HTTP Host Availability • All required HTTP hosts are available

• No issues found!

NelepovDmitry avatar Mar 29 '23 20:03 NelepovDmitry