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

Salvador-dev · 2023-12-05T20:33:38Z

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

[Paste your logs here]

parseramuser4 · 2023-12-06T06:17:11Z

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

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 · 2023-12-06T10:43:12Z

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

cgzdevelopments · 2023-12-06T12:09:31Z

@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 · 2023-12-06T12:31:38Z

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 · 2023-12-08T06:46:21Z

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

Salvador-dev · 2023-12-08T13:05:18Z

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

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

cgzdevelopments · 2023-12-09T09:09:48Z

@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 · 2023-12-09T11:03:12Z

@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 · 2023-12-09T12:04:53Z

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 · 2023-12-09T12:09:32Z

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 · 2023-12-09T12:42:36Z

Android

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

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 · 2023-12-14T06:02:56Z

@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 · 2023-12-14T06:52:49Z

@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 · 2023-12-14T07:28:01Z

@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

andrewmlevy · 2023-12-14T07:34:22Z

We are experiencing the same issue. Try running the project with a web target locally on your mac, once chrome launches open Safari and go to your localhost address with the project and you should be able to reproduce. The issue does not show up in Chrome.

andrewmlevy · 2023-12-18T02:02:19Z

@ellet0 or @singerdmx @freshtechtips were you able to reproduce? this is critical for us as well. It's fairly consistent if you run a web build and then point safari to your local server address.. Thanks!

EchoEllet · 2023-12-18T09:46:54Z

@ellet0 or @singerdmx @freshtechtips were you able to reproduce? this is critical for us as well. It's fairly consistent if you run a web build and then point safari to your local server address.. Thanks!

My apologies but until now I'm unable to reproduce the bug

andrewmlevy · 2023-12-21T20:05:54Z

Great news everyone @ellet0 @singerdmx I was able to recreate the issue

I ran this gist in Chrome and then loaded the localhost page in Safari (I haven't tested on iOS but I'm sure that will recreate it as well)
https://gist.github.com/andrewmlevy/527950deb95d3aedc0755bbf10f64019

The bug occurs when you hide the editor and then show it again. Click Hide Quill then Show Quill to recreate:

The workaround is to use the Offstage widget:
Offstage(offstage: !showQuill, child: buildEditor()), !showQuill ? Text("No Quill") : Container(),

However we would still love for the bug to be addressed; this would mean rendering a lot of content to get around it. Thanks!

EchoEllet · 2023-12-21T21:06:33Z

Great news everyone @ellet0 @singerdmx I was able to recreate the issue

I ran this gist in Chrome and then loaded the localhost page in Safari (I haven't tested on iOS but I'm sure that will recreate it as well) https://gist.github.com/andrewmlevy/527950deb95d3aedc0755bbf10f64019

The bug occurs when you hide the editor and then show it again. Click Hide Quill then Show Quill to recreate:

The workaround is to use the Offstage widget: Offstage(offstage: !showQuill, child: buildEditor()), !showQuill ? Text("No Quill") : Container(),

However we would still love for the bug to be addressed; this would mean rendering a lot of content to get around it. Thanks!

My apologies, does the bug happened on all platforms or just iOS on web browser?

andrewmlevy · 2023-12-22T19:10:22Z

My apologies, does the bug happened on all platforms or just iOS on web browser?

Correct. I have tested on Android and MacOS, the issue is not there. It is just iOS and web browser (safari).

EchoEllet · 2023-12-28T15:20:00Z

Can't test iOS apps on real iPhone for now but I will try

mtallenca · 2023-12-28T19:59:59Z

I am seeing this with Safari web on desktop. Beginning with the latest release of Safari 17.2.1 that comes with MacOS 14.2.1. I'm using flutter quill 9.1.1 - I see the same paste menu issue with 8.6.4

Mmisiek · 2023-12-30T22:29:36Z

I see this error on Safari on a Mac desktop, too. Safari version 16.5.2 no issues with Chrome on same Mac.

Mmisiek · 2023-12-30T22:50:16Z

Great news everyone @ellet0 @singerdmx I was able to recreate the issue

I ran this gist in Chrome and then loaded the localhost page in Safari (I haven't tested on iOS but I'm sure that will recreate it as well) https://gist.github.com/andrewmlevy/527950deb95d3aedc0755bbf10f64019

The bug occurs when you hide the editor and then show it again. Click Hide Quill then Show Quill to recreate:

The workaround is to use the Offstage widget: Offstage(offstage: !showQuill, child: buildEditor()), !showQuill ? Text("No Quill") : Container(),

However we would still love for the bug to be addressed; this would mean rendering a lot of content to get around it. Thanks!

I tried this solution but does not work, when Editor is visible it still is stuck in Safari ;(

EchoEllet · 2024-01-03T15:30:36Z

I see this error on Safari on a Mac desktop, too. Safari version 16.5.2 no issues with Chrome on same Mac.

I can test it on real iOS now, but I need detailed steps to reproduce the bug because I still can't reproduce
Last time I tried

Mmisiek · 2024-01-04T01:03:53Z

I see this error on Safari on a Mac desktop, too. Safari version 16.5.2 no issues with Chrome on same Mac.

I can test it on real iOS now, but I need detailed steps to reproduce the bug because I still can't reproduce Last time I tried

How about this example ? https://gist.github.com/andrewmlevy/527950deb95d3aedc0755bbf10f64019

JoepHeijnen · 2024-01-15T09:57:45Z

Is there any progress on this issue? This is quite blocking for our web app.

Albert-Jan · 2024-01-21T09:30:57Z

I'm still facing the same issue as above, even on Safari on a MacBook. Would love to help in any way :)

andrewmlevy · 2024-01-21T18:59:58Z

Same, this is still causing issues for us

Martin-QPT · 2024-01-23T23:40:37Z

Same - luckily my client primarily uses Edge per company policy but any Safari users are seeing this including myself on a physical MacBook.

EchoEllet · 2024-02-17T01:01:02Z

Hi, let me know if you still facing the issue, it has been fixed by @mtallenca

If no one is facing the issue then we should get ready to close the issue

andrewmlevy · 2024-02-17T01:08:57Z

It looks to be fixed, thanks!!!

Mmisiek · 2024-02-17T05:13:20Z

Yea ! fixed, thanks !

Salvador-dev added the bug Something isn't working label Dec 5, 2023

EchoEllet pinned this issue Dec 21, 2023

Repository owner deleted a comment from singerdmx Dec 28, 2023

This was referenced Jan 25, 2024

chore: bump flutter_quill to ^9.2.10 friebetill/delta_markdown#19

Closed

chore: uppgrade flutter_quill to ^9.2.10 Vlabs-development/delta_markdown#1

Merged

This was referenced Feb 6, 2024

Default web clipboard status to pasteable and don't make clipboard status checks on web. (fixes #1567) #1721

Closed

Fix safari clipboard bug #1722

Merged

Repository owner deleted a comment from mpalmer-sps Feb 17, 2024

EchoEllet closed this as completed Apr 22, 2024

EchoEllet unpinned this issue Apr 22, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

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

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

Salvador-dev commented Dec 5, 2023 •

edited by EchoEllet

Loading

parseramuser4 commented Dec 6, 2023 •

edited

Loading

Salvador-dev commented Dec 6, 2023 •

edited

Loading

cgzdevelopments commented Dec 6, 2023 •

edited

Loading

Joharte commented Dec 6, 2023 •

edited

Loading

EchoEllet commented Dec 8, 2023

Salvador-dev commented Dec 8, 2023

cgzdevelopments commented Dec 9, 2023

EchoEllet commented Dec 9, 2023

Joharte commented Dec 9, 2023

EchoEllet commented Dec 9, 2023

Joharte commented Dec 9, 2023

parseramuser4 commented Dec 14, 2023

EchoEllet commented Dec 14, 2023

EchoEllet commented Dec 14, 2023

andrewmlevy commented Dec 14, 2023 •

edited

Loading

andrewmlevy commented Dec 18, 2023

EchoEllet commented Dec 18, 2023

andrewmlevy commented Dec 21, 2023

EchoEllet commented Dec 21, 2023 •

edited

Loading

andrewmlevy commented Dec 22, 2023

EchoEllet commented Dec 28, 2023

mtallenca commented Dec 28, 2023 •

edited

Loading

Mmisiek commented Dec 30, 2023

Mmisiek commented Dec 30, 2023

EchoEllet commented Jan 3, 2024

Mmisiek commented Jan 4, 2024

JoepHeijnen commented Jan 15, 2024

Albert-Jan commented Jan 21, 2024

andrewmlevy commented Jan 21, 2024

Martin-QPT commented Jan 23, 2024

EchoEllet commented Feb 17, 2024

andrewmlevy commented Feb 17, 2024

Mmisiek commented Feb 17, 2024

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

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

Comments

Salvador-dev commented Dec 5, 2023 • edited by EchoEllet Loading

Is there an existing issue for this?

Flutter Quill version

Other Flutter Quill packages versions

Steps to reproduce

Expected results

Actual results

Code sample

Screenshots or Video

parseramuser4 commented Dec 6, 2023 • edited Loading

Salvador-dev commented Dec 6, 2023 • edited Loading

cgzdevelopments commented Dec 6, 2023 • edited Loading

Joharte commented Dec 6, 2023 • edited Loading

EchoEllet commented Dec 8, 2023

Salvador-dev commented Dec 8, 2023

cgzdevelopments commented Dec 9, 2023

EchoEllet commented Dec 9, 2023

Joharte commented Dec 9, 2023

EchoEllet commented Dec 9, 2023

Joharte commented Dec 9, 2023

parseramuser4 commented Dec 14, 2023

EchoEllet commented Dec 14, 2023

EchoEllet commented Dec 14, 2023

andrewmlevy commented Dec 14, 2023 • edited Loading

andrewmlevy commented Dec 18, 2023

EchoEllet commented Dec 18, 2023

andrewmlevy commented Dec 21, 2023

EchoEllet commented Dec 21, 2023 • edited Loading

andrewmlevy commented Dec 22, 2023

EchoEllet commented Dec 28, 2023

mtallenca commented Dec 28, 2023 • edited Loading

Mmisiek commented Dec 30, 2023

Mmisiek commented Dec 30, 2023

EchoEllet commented Jan 3, 2024

Mmisiek commented Jan 4, 2024

JoepHeijnen commented Jan 15, 2024

Albert-Jan commented Jan 21, 2024

andrewmlevy commented Jan 21, 2024

Martin-QPT commented Jan 23, 2024

EchoEllet commented Feb 17, 2024

andrewmlevy commented Feb 17, 2024

Mmisiek commented Feb 17, 2024

Salvador-dev commented Dec 5, 2023 •

edited by EchoEllet

Loading

parseramuser4 commented Dec 6, 2023 •

edited

Loading

Salvador-dev commented Dec 6, 2023 •

edited

Loading

cgzdevelopments commented Dec 6, 2023 •

edited

Loading

Joharte commented Dec 6, 2023 •

edited

Loading

andrewmlevy commented Dec 14, 2023 •

edited

Loading

EchoEllet commented Dec 21, 2023 •

edited

Loading

mtallenca commented Dec 28, 2023 •

edited

Loading