nathanfaucett / svelte-slate

slate svelte view layer
https://nathanfaucett.github.io/svelte-slate/
Apache License 2.0
61 stars 5 forks source link

[firefox] Cannot leave node with keyboard on firefox #5

Open luan opened 2 years ago

luan commented 2 years ago

This gif shows the issue:

Kapture 2022-09-11 at 13 05 55

It seems the caret is stuck in a non-editable part of the document, can't get out of it unless you click somewhere in the text. This reproduces on the any of the other editors (rich editor, etc) if you click at the end of a line.

Importanly, this does not happen on the React version of slate (slate official examples, for instance).

No errors are shown in the console, just a lack of ability to edit. Works fine on Chrome/Safari.

nathanfaucett commented 2 years ago

@luan on firefox the extra text nodes that svelte adds is causing this issue, there is some discussion around whitespace handling in svelte here https://github.com/sveltejs/svelte/issues/3080, not sure how I want to handle this issue yet, because I cant just remove the nodes cuz it breaks sveltes rendering

DataDaoDe commented 1 year ago

@nathanfaucett It looks like they are resolving this now with a preprocessor, not really sure if they actually have a solution that works for our use case here though, see: https://github.com/sveltejs/svelte/issues/189

hardyjosh commented 1 year ago

@nathanfaucett any more thoughts on this issue? this package is so great and works perfectly on chrome etc, the firefox issue is such a shame.

@DataDaoDe i tried adding the preprocessor replace in https://github.com/sveltejs/svelte/issues/189 but it didn't help unfortunately.

nathanfaucett commented 1 year ago

@hardyjosh I am not sure of a way to fix this in this library, I have tried writing something that removes the text nodes in the content editable elements, but it breaks the compiled svelte code, so unless this can be fixed in the svelte compiler, I'm not sure I know of a way to fix this issue for FireFox

hardyjosh commented 1 year ago

@nathanfaucett no worries, I tried a few quick things also but you're right.

Why are the extra text nodes such an issue in this case and not always? Is it because it's content-editable and the css is pre-wrap?

nathanfaucett commented 1 year ago

@hardyjosh its only when its content-editable from what i can tell, now the css pre-wrap i have not tried anything with yet

hardyjosh commented 1 year ago

@nathanfaucett I tried some other css but then you lose the intentional whitespace too. Although maybe there's some way to make it work.