question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Drag'n'Drop of selected formatted text not working

See original GitHub issue

Steps for Reproduction

  1. Visit https://jsfiddle.net/RheaMars/qsq7wtzc/
  2. Select the text
Some text in a div.
More text in another div.
  1. Drag and drop the text in the quill editor right above

Expected behavior: The text should be visible in the quill editor. Ideally it should be formatted as it was in the original. Note: this applies to a lot of HTML formatting, but not all of it (e.g. a wrapping in bold-tags works)

Actual behavior: Most of the time, non of the selected text is pasted into quill (see below for details). This used to work with Quill Editor v0.20.1

Platforms: Not working at all: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.89 Safari/537.36 OPR/49.0.2725.39 The given range isn't in document. setNativeRange @ quill.js:3145 (anonymous) @ quill.js:2824 emit @ quill.js:8591 emit @ quill.js:1893 update @ quill.js:4333 (anonymous) @ quill.js:7118 quill.js:4329 Uncaught TypeError: Cannot read property 'emit' of undefined at Scroll.update (VM61 quill.js:4329) at MutationObserver.<anonymous> (VM61 quill.js:7118) Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Ubuntu Chromium/64.0.3282.140 Chrome/64.0.3282.140 Safari/537.36 Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:58.0) Gecko/20100101 Firefox/58.0 TypeError: this.emitter is undefined

Partially working: Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko (the first line of text is pasted)

Couldn’t test in: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36 Edge/16.16299 (jsfiddle refuses to run the test and I don’t know why)

Version: 1.3.6 (see jsFiddle)

Edit: Included error-messages of Opera and Firefox

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:3
  • Comments:7

github_iconTop GitHub Comments

8reactions
aboosoyeedcommented, Nov 25, 2018

You can add this

var Block = Quill.import(‘blots/block’); class Div extends Block { } Div.tagName = “div”; Div.blotName = “div”; Div.allowedChildren = Block.allowedChildren; Div.allowedChildren.push(Block) Quill.register(Div);

0reactions
aboosoyeedcommented, Oct 15, 2020

@awais2080 my pleasure

Read more comments on GitHub >

github_iconTop Results From Across the Web

Disable drag and drop of selected text - javascript
This didn't solve my problem. If you run the code snippet, type in some text into the input, select all of it, and...
Read more >
Can you 'drag and drop' text and drop formatting at once?
I'd like need to drag and drop heaps of texts between documents, and rather copy only the text, without formatting. Is there any...
Read more >
Word XP: Cut, Copy, Paste, and Drag and Drop - GCF Global
Working with blocks of text. To cut and paste a block of text: Select the text you want to move. Click the Cut...
Read more >
Drag operations - Web APIs - MDN Web Docs - Mozilla
Note: When an element is made draggable, text or other elements within it can no longer be selected in the normal way by...
Read more >
Drag and drop elements within your rich text editor - TinyMCE
It's a straightforward procedure to configure the editor for specific drag and drop cases. It does not require setting a “draggable” attribute ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found