Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Firefox wrong Range from proto.getSelection #393

Open
the-djmaze opened this issue Sep 7, 2020 · 1 comment
Open

Firefox wrong Range from proto.getSelection #393

the-djmaze opened this issue Sep 7, 2020 · 1 comment

Comments

@the-djmaze
Copy link

the-djmaze commented Sep 7, 2020

When typing in Firefox and then calling an action like Squire.bold() the cursor jumps and causes action on the wrong place.
This is because the wrong Range is used.
Replace if ( this._isFocused && sel && sel.rangeCount ) {
With if ( sel && sel.rangeCount ) {

Or add:
this.addEventListener( 'keyup', ()=>this.getSelection() ); this.addEventListener( 'touchend', ()=>this.getSelection() );

@bobmagicii
Copy link

bobmagicii commented Nov 29, 2022

greetings from 2022.

behaviour i was observing:

select text "dolor sit amit". click bold. sometimes you:

  • end up with the entire block from where you clicked, to the end of it, selected afterwards.
  • end up with only some of the text you had selected getting the bold.

image

the first fix from op did not work for me. originally my goal was to just unselect what was selected because of how it selected the entire box. while debugging i found that if you disable _getRangeAndRemoveBookmark instead of getting a full fucky range you only get a mildly fucky range, based on how much longer the content got from the insertion of the html tags. this put me on the warpath of trying to actually salvage the selection.

op was on to something regarding focus. my fix is equally dumb, too. as long as i focus the editable viewport first, everything works as intended.

additionally, this also accidentally "fixed" iOS in that when i click the bold button, my selection is no longer lost.

editors note: i bet it "fixes" ios in that, the editor is re-focused before ios has time to fade the current one out and that it cancels it canceling itself. no idea but the caused behaviour is better.

in this following code:

  • this.editor.viewport.element is the html element that i targeted with new Squire
  • this.editor.api is the result of new Squire

image

image

the tl;dr code for anyone doing it raw would probably look more like

let el = document.getElementById('Editor');
let api = new Squire(el);

el.focus();
api.changeFormat(...);

some public lamenting of debugging: https://twitter.com/bobmagicii/status/1597376241728122880

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants