List Links Draggable caused the HTML of the link to show...?

Developers
#1

I’m 99% sure this is a bug, but I haven’t figured out why it happened or how to reproduce it. Unfortunately I didn’t take screenshots either… but in the “open” tab of the sidebar, I tried to drag a tiddler to the top of the story list, and instead it showed up as:

<a class=\"tc-tiddlylink tc-tiddlylink-shadow\" href=\"#%24%3A%2Fcore%2Fui%2FEditTemplate%2Ffields\" style=\"box-sizing: border-box; text-decoration: none; font-weight: bold; color: rgba(255, 255, 255, 0.54); user-select: inherit; font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Helvetica, Arial, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;ＭＳ Ｐゴシック&quot;, &quot;MS PGothic&quot;, メイリオ, Meiryo; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(50, 50, 50);\">$:/core/ui/EditTemplate/fields</a>

(I got the above from the History List tiddler.)

When I clicked it, it opened a (missing) tiddler with that title. After messing a bit more with dragging, dropping, and closing, I noticed that the tiddler I had been trying to move was listed twice, though after dragging it again or maybe opening it (I don’t remember), the duplicate was removed.

Since I cannot reproduce it, I have not opened an issue on GitHub; I figured someone who knows the inner workings of TW better than I might be able to know what happened if I simply described it here.

(TW version: 5.3.3; browser: TiddlyDesktop; currently installed plugins: Core, Dynaview, Highlight, Internals, JSZip, KaTeX, MenuBar, XLSX Utils)

#2

I vaguely recalled having run into this sort of bug before, so I just tried it on tiddlywiki.com (in Firefox) and immediately produced a similar error:

image
image1183×455 49.4 KB

Only the first time I tried it, though… and when I reloaded, I couldn’t reproduce it at all. Never mind! It happens when (and only when) the title being dragged is highlighted… probably an unintended side-effect of the way drag-to-copy interacts with the dropzone? It’s similarly possible to add a nonexistent tiddler to the list in the Open tab by highlighting a string of words in the story river and dragging the selection into the dropzone… I’m not sure if that’s by design or not.

1 Like
#3

I can reproduce it. That should be an issue at GH.

I think this one is more “by design”. IMO it should be possible to create and open tiddlers with that mechanism.

But IMO creating an A element-link should be avoided

1 Like
#4

That’s a great idea! But as it is, when I do it with any random story river text, I get span elements and such.

The same when I highlight any random piece of text and drag and drop in the story river - it opens the Importer and, if importing, creates a tiddler called “Untitled” with said HTML element in the text field (which, when displayed in the story river, naturally displays according to the formatting on the HTML element). This has bothered me many times when I’m editing a tiddler title - I often want to select/highlight the end (last word or two) of the title in order to delete that part or it or copy it or whatever, so I click to the right of the title and drag the mouse to the left, expecting to select it, only to have it drag and drop the entire tiddler title into the story river because apparently the whole title had already been selected, and suddenly I’m wondering why my wiki wants to import something.

It’s the middle of the night for me and I intend to go back to sleep, but now that we can all easily reproduce the issue, I’ll open an issue in the morning if nobody else has done it yet.

#5

Opened [BUG] Dragging selected text onto list-links-draggable macro adds unwieldy HTML to the list · Issue #8158 · Jermolene/TiddlyWiki5 · GitHub

#6

Hi @bluepenguindeveloper I’m pretty sure that this issue reflects the peculiarities in the way that browsers handle drag and drop, and isn’t a bug in TiddlyWiki per se.

Browsers support a number of different payload types for drag and drop events. TiddlyWiki uses a custom link format as the payload format when dragging and dropping tiddlers. This all works fine when dragging the link itself.

However, if text is selected then the browser behaves completely differently. Instead of the payload being a link, it sends a fragment of HTML representing the selected text. TiddlyWiki doesn’t recognise that as a link because it isn’t a link, and so it just tries to import it as a fragment of HTML text in a new untitled tiddler.

The fact that browsers implement two semantically different types of drag and drop with almost the same user interface seems like the heart of the problem.

1 Like
#7

Interesting. Sounds like even if we requested to strip HTML in such cases, because of the way the browser sends dragged text, TiddlyWiki probably wouldn’t be able to distinguish between HTML that the browser uses to represent selected text that gets dragged, and HTML that was actually part of the text being dragged (from within a text input field for example), though I must admit I don’t know squat about how applications and OSs etc. implement drag and drop functionality in the first place.

I hope you’ll forgive me for mistaking it for a TiddlyWiki bug. (Looks like I’m not the only one either.)

#8

What ever you do don’t fix this, it is not broken, all you have to do is click, drag an drop the link rather than select, click drag and drop.

The ability to drag and drop a selection comes to you as a result of the browsers behaviour, not tiddlywikis. When tiddlywiki generates a link it converts it to html to display it, when you select, drag and drop, it truthfully copies what you selected.

  • This is very useful because you can drag and drop this link into another wiki.

If you need a workaround select you link and r-click to see the options available, if you want only the tiddler name select copy (in FireFox).

  • But the best way is tom not select, just click, drag and drop.

If you do use the html a record consider adding target="_blank" so it opens in a new tab.

Development

This is serendipitously pointing me to a trick, I want to find how to get have sauch links include a preconfigured target eg use $:/config/target set to say tiddlywiki.com so that;

<a class="tc-tiddlylink tc-tiddlylink-resolves" href="https://tiddlywiki.com/#Community">Community</a>`

would instead read;

<a class="tc-tiddlylink tc-tiddlylink-resolves" href="https://tiddlywiki.com/#Community" target="tiddlywiki.com">Community</a>`

This would allow links to the same wiki open in the same tab in the current browser.

  • I would also look at making this happen when selecting and dragging tiddler titles;

For example; Click on both of these;

HelloThere


Community

Target not working from here, in talk.TiddlyWiki