Skip to content

Editor for web app keeps showing "paste" dialog everytime in a read only content page from IOS web browser  #1567

Closed
@Salvador-dev

Description

@Salvador-dev

Is there an existing issue for this?

  • I have searched the existing issues

Flutter Quill version

8.6.4

Other Flutter Quill packages versions

No response

Steps to reproduce

i'm trying to use the widget in a flutter web app but this issue doesn't have solution since 2022 where another person have the same problem

Expected results

Don't show the dialog or only one time on the first time in the app.

Actual results

Showed the dialog every time.

Code sample

class ReadingDetailDialog extends StatefulWidget {
  final Reading reading;
  final User user;
  final BaseSubCategory? subCategory;

  const ReadingDetailDialog({
    super.key,
    required this.reading,
    required this.user,
    this.subCategory,
  });

  @override
  State<ReadingDetailDialog> createState() => _ReadingDetailDialogState();
}

class _ReadingDetailDialogState extends State<ReadingDetailDialog>
    with Notificable, Tools, UsesBreakpoints {
  final ReadingBloc _readingBloc;

  _ReadingDetailDialogState()
      : _readingBloc = getIt(),
        super();

  @override
  void initState() {
    _readingBloc.add(RequestOne(widget.reading.id));
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return DialogsLayout(
      padding: const EdgeInsets.symmetric(horizontal: 25),
      appBarLeadingWidget: _clientAppBarLeading,
      appBarTitle: _adminAppBarTitle,
      child: BlocBuilder<ReadingBloc, BaseState>(
        bloc: _readingBloc,
        builder: (context, state) {
          if (state is ItemLoaded<DetailedReading>) {
            return _getContent(state.item);
          } else if (state is BaseError) {
            return const TryAgainLaterScreen();
          }
          return LoadingScreen(resource: tr('fields.audio'));
        },
      ),
    );
  }

  Widget get _clientAppBarLeading => widget.user.isClient
      ? CustomDialogDefaults.clientAppBarLeading(
          widget.reading.id,
          getIt<ReadingFavoriteCubit>(),
        )
      : Container();

  Widget? get _adminAppBarTitle =>
      widget.user.isAdmin && widget.subCategory != null
          ? CustomDialogDefaults.adminAppBarTitle(widget.subCategory!)
          : Container();

  Widget _getContent(DetailedReading reading) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.start,
      mainAxisSize: MainAxisSize.max,
      children: [
        Flexible(
          child: NFMarquee(
            text: reading.name,
            style: GoogleFonts.italianno(
              color: Colors.black,
              fontSize: 45,
              fontWeight: FontWeight.bold,
            ),
          ),
        ),
        Flexible(
          child: RichText(
            text: TextSpan(
              children: [
                TextSpan(
                  text: "por",
                  style: GoogleFonts.italianno(
                    color: Colors.black87,
                    fontSize: 30,
                    fontWeight: FontWeight.normal,
                  ),
                ),
                TextSpan(
                  text: " some name",
                  style: GoogleFonts.italianno(
                    color: Colors.black,
                    fontSize: 30,
                    fontWeight: FontWeight.bold,
                  ),
                ),
              ],
            ),
            textAlign: TextAlign.right,
          ),
        ),
        const Divider(height: 20),
        QuillProvider(
          configurations: QuillConfigurations(
            controller: _getController(reading),
          ),
          child: Expanded(
            flex: 10,
            // child: QuillEditor.basic(
            //   configurations: const QuillEditorConfigurations(
            //     readOnly: true,
            //     enableInteractiveSelection: false,
            //   ),
            // ),
            child: QuillEditor.basic(
              configurations: const QuillEditorConfigurations(
                readOnly: true,
                showCursor: false,
                enableSelectionToolbar: false,
                scrollable: true,
                autoFocus: false,
              ),
            ),
          ),
        ),
      ],
    );
  }

  QuillController _getController(DetailedReading reading) {
    final controller = QuillController.basic();
    if (reading.format == "html") {
      controller.document = Document.fromDelta(
        HtmlToDeltaConverter.htmlToDelta(
          reading.text!,
        ),
      );
    } else {
      controller.document = Document.fromJson(
        jsonDecode(
          reading.text!,
        ),
      );
    }

    return controller;
  }
}

Screenshots or Video

Logs
Logs
[Paste your logs here]

Activity

parseramuser4

parseramuser4 commented on Dec 6, 2023

@parseramuser4

Hello. This issue has been happening to me for a few days, and I've tried every method to solve it without success. In the simplest use case, using this editor on the web on iOS, this problem exists. As far as I understand, this occurs when tapping on any element of the editor, and typing also prevents the user from continuing to type. I created a blank page with the editor, and no specific settings have been applied. Please investigate and resolve this issue as soon as possible.

Flutter Quill version : 8.6.4
Flutter version : 3.16.2

Simulator Screen Shot - iPhone 13 Pro Max - 2023-12-06 at 09 30 32

import 'package:flutter/material.dart';
import 'package:flutter_quill/flutter_quill.dart';

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

  @override
  State<Test> createState() => _TestState();
}

class _TestState extends State<Test> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: QuillProvider(
      configurations: QuillConfigurations(
        controller: QuillController.basic(),
        sharedConfigurations: const QuillSharedConfigurations(),
      ),
      child: Column(
        children: [
          const QuillToolbar(),
          Expanded(
            child: QuillEditor.basic(
              configurations: QuillEditorConfigurations(
                readOnly: false,
              ),
            ),
          )
        ],
      ),
    ));
  }
}
Salvador-dev

Salvador-dev commented on Dec 6, 2023

@Salvador-dev
Author

Yeah this is the same problem we have, even on the latest versions of IOS

WhatsApp Image 2023-12-05 at 4 31 32 PM (1)
WhatsApp Image 2023-12-05 at 4 31 32 PM

cgzdevelopments

cgzdevelopments commented on Dec 6, 2023

@cgzdevelopments

@Salvador-dev Hi! We have the same problem with our app. The Paste dialog does not allow the user to continue using the app and the editor is in "readonly" mode.

Flutter version
3.16.1

Flutter Quill version
8.6.4

Joharte

Joharte commented on Dec 6, 2023

@Joharte

Good day, the same thing happens to me in my web application. In the case of android I see a dialog that wants to see the text and images that have been copied to the clipboard and in the case of IOS as soon as I touch the screen the paste button appears even when I am in read only (bad experience for the user who is only going to read and says Paste) I ask you please can help me with this

Flutter Quill version : 8.6.4
Flutter version : 3.16.1

EchoEllet

EchoEllet commented on Dec 8, 2023

@EchoEllet
Collaborator

Hi, can you tell me how to encounter the issue in detail? I can't get it
Besides the toolbar in read-only mode usually hidden
image

Salvador-dev

Salvador-dev commented on Dec 8, 2023

@Salvador-dev
Author

Hi, can you tell me how to encounter the issue in detail? I can't get it Besides the toolbar in read-only mode usually hidden image

You are using the same versions? (Flutter Quill version : 8.6.4, Flutter version : 3.16.1)

cgzdevelopments

cgzdevelopments commented on Dec 9, 2023

@cgzdevelopments

@freshtechtips Hi, thanks for looking at this issue. I've noticed that it doesnt happen on simulator as i've tested on a IOS 15, 16 and 17 simulator and is working fine (no "Paste" dialog shows up). But i also tested on IOS 15, 16 and 17 real devices and "Paste" dialog shows up.

EchoEllet

EchoEllet commented on Dec 9, 2023

@EchoEllet
Collaborator

@freshtechtips Hi, thanks for looking at this issue. I've noticed that it doesnt happen on simulator as i've tested on a IOS 15, 16 and 17 simulator and is working fine (no "Paste" dialog shows up). But i also tested on IOS 15, 16 and 17 real devices and "Paste" dialog shows up.

Thanks for the info

That's might be the problem

We are checking if the iOS is a simulator in some places

Joharte

Joharte commented on Dec 9, 2023

@Joharte

Exactly in the simulator you don't see the "Paste" but on Apple devices it does appear and on Android devices it asks for permission only the first time you enter I was reading the documentation and I saw
RawEditorState extends EditorState please review and help me

EchoEllet

EchoEllet commented on Dec 9, 2023

@EchoEllet
Collaborator

Exactly in the simulator you don't see the "Paste" but on Apple devices it does appear and on Android devices it asks for permission only the first time you enter I was reading the documentation and I saw
RawEditorState extends EditorState please review and help me

On Android, can you tell me which permissions it asks for?

Joharte

Joharte commented on Dec 9, 2023

@Joharte

Android
issue

real devices read-only mode (in the text viewer) if you do not accept "paste" the data does not appear

issue ios apenas abro el visor

It seems that the editor will store the information on the clipboard, Only if I press the paste button does the text in the viewer appear

Thank you for your prompt response

parseramuser4

parseramuser4 commented on Dec 14, 2023

@parseramuser4

@singerdmx @freshtechtips
Hello. Has any action been taken on this issue? My application has become unusable for iOS users. This problem has been occurring for two weeks, and no action has been taken yet. Please prioritize addressing this issue. Many users are affected by this, but they may not have noticed it yet. Thank you for the time you spend on maintaining this practical extension.

EchoEllet

EchoEllet commented on Dec 14, 2023

@EchoEllet
Collaborator

@singerdmx @freshtechtips
Hello. Has any action been taken on this issue? My application has become unusable for iOS users. This problem has been occurring for two weeks, and no action has been taken yet. Please prioritize addressing this issue. Many users are affected by this, but they may not have noticed it yet. Thank you for the time you spend on maintaining this practical extension.

Hi, I will try to reproduce it again and debug it today

EchoEllet

EchoEllet commented on Dec 14, 2023

@EchoEllet
Collaborator

@singerdmx @freshtechtips Hello. Has any action been taken on this issue? My application has become unusable for iOS users. This problem has been occurring for two weeks, and no action has been taken yet. Please prioritize addressing this issue. Many users are affected by this, but they may not have noticed it yet. Thank you for the time you spend on maintaining this practical extension.

Still can't reproduce the issue

telegram-cloud-photo-size-2-5465388860059013600-y
telegram-cloud-photo-size-2-5465388860059013601-y
telegram-cloud-photo-size-2-5463014713806935419-y

28 remaining items

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

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Participants

      @andrewmlevy@mtallenca@Mmisiek@Albert-Jan@JoepHeijnen

      Issue actions

        Editor for web app keeps showing "paste" dialog everytime in a read only content page from IOS web browser · Issue #1567 · singerdmx/flutter-quill