Support for multiple tabs drag and drop to web-extension
Categories
(Core :: DOM: Copy & Paste and Drag & Drop, enhancement, P5)
Tracking
()
People
(Reporter: aafnbugzilla.map1bid, Unassigned)
Details
User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:71.0) Gecko/20100101 Firefox/71.0
Steps to reproduce:
- On FF 71 and upper
- Open a Web extension add-on which can receive multiple tabs drag and drop (example Bookmark Search Plus 2)
- Select mulitple tabs
- Drag and drop them to the extension
Actual results:
- The DataTransfer object only contains the first tab, there is no indication that there are other objects being dragged, and no method to access them
- items[] and types[] only contain 1 object
- getData doesn't allow to get more than 1 object
Expected results:
As per https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer/items, there should be 1 object per dragged item in items[] (and in types[])
Note that before FF71 there was a workaround using mozItemCount and mozGetDataAt() / mozTypesAt(), but this is now deprecated and not available as documented in https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer
Note that you can also use the Tree Style Tab add-on to observe the problem = drag multiple tabs to the sidebar to move them, only one will move
Comment 2•4 years ago
|
||
You look misunderstand the spec. The property event.dataTransfer.items
represents a list of different forms of single drag data. Here is an example adding element ID, HTML source, and a URL text for a dragstart: https://developer.mozilla.org/en-US/docs/Web/API/DataTransferItemList/DataTransferItem#Example_Drag_and_Drop
Comment 3•4 years ago
|
||
https://html.spec.whatwg.org/multipage/dnd.html#the-datatransferitemlist-interface
And the spec says that items
can store multiple items not multiple forms of single item only when items are File
type.
Hello Piro, you are probably right and this is why I made this request an "Enhancement".
First, we have to recognize that things are not so clear in the texts:
- https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer/items says
The read-only DataTransfer property items property is a list of the data transfer items in a drag operation. The list includes one item for each item in the operation and if the operation had no items, the list is empty.
- https://developer.mozilla.org/en-US/docs/Web/API/DataTransferItem says
The DataTransferItem object represents one drag data item. During a drag operation, each drag event has a dataTransfer property which contains a list of drag data items. Each item in the list is a DataTransferItem object.
- In those sentences, all comes to what is item.
This is not really specified, however on HTML specs describing its usage as the one you cite, I agree that what you say is on the good line.
Now look at
- https://html.spec.whatwg.org/multipage/dnd.html#list-of-dragged-nodes which decribes the case of a list of objects being dragged (list of dragged nodes).
- In particular, it says a bit later (sorry for the bad formatting):
If the list of dragged nodes is not empty, then extract the microdata from those nodes into a JSON form, and add one item to the drag data store item list, with its properties set as follows:
..The drag data item type string
....application/microdata+json
..The drag data item kind
....Text
..The actual data
....The resulting JSON string.
So I guess following this, we should have at least one more item in items[] of type "application/microdata+json", containig the json data representing the list of dragged tabs, instead of only 1 item.
Which is not the case today, it only contains one item, the URL of the first tab, of type "text/x-moz-text-internal" (I verified).
Anyway, whatever the interpretation which is right, the fact is that we are now missing the function of dragging multiple tabs to a web-extension.
Hence the demand I opened here. Or let me know what I am missing, and how you see this is functioning.
Comment 5•4 years ago
|
||
Assigning "Core: DOM: Drag & Drop" component for this.
Updated•4 years ago
|
Updated•2 years ago
|
Description
•