Glitch editor caret moves to the right side of a character even if you click to the left of the center of that character

In this video I’m continuously clicking the “g” character, steadily moving to the left with each successive click:

You can see that the caret only appears on the left side of the “g” when my cursor gets right up to the left edge of the “g”.

Instead, the caret should appear on the left side of the “g” if I click just one pixel to the left of the center of the “g”.

This seems like a small thing, but it’s quite annoying. I’m having to build new “glitch editor” neurons in my head to subconsciously adjust for this.

3 Likes

This is a major issue I have with glitch also - very frustrating as I often have to retype or edit as I have missed 1 character. It would be fantastic to fix this.

1 Like

@Gareth can you replicate this? Definitely isn’t a problem with codemirror itself: http://jsbin.com/nixututaxo/edit?html,output though it could be something to do with a mode or some plugin.

Yes, I can - I’ll see if I can find out what’s causing it. Thanks.

1 Like

How did you go @joe and @Gareth ?

I think the team must be pretty busy with some other issues. I’m definitely looking forward to a fix for this. Probably my second most wanted bug fix only after the inability to prevent auto restarts without watch.json boilerplate and other hacks (which isn’t really a bug - more of a feature request).

Hey Gareth, any progress on this?

No, not that I’m aware of. We’ll update this topic when it has been fixed.

1 Like

Hi @Gareth @cori, I know you said you’d update this when it is fixed, but it’s been quite a while now - any chance this one could be bumped up the priority list a bit? Lots of great improvement to the editor lately, but it seems like this bug has been neglected relative to the amount of friction it causes. Might just be me though!

Hi @joe,

I’m sorry this has not been fixed yet. Honestly, it may be a while until our team gets around to this.

In the meantime, your post about this issue will remain here; as it is valid feedback and a good explanation of the problem. Thank you for taking the time to document this issue, and we appreciate your patience!

2 Likes

I experience this often - clicking on the left side of a character but the cursor appearing on the right - and it leads to typing in the wrong position, which means having to go back and correct it.

glitch-cursor

2 Likes

@tasha I understand this may take a while, but I’m just purely curious as to why? No passive-aggressive stuff here, just pure curiosity! Is it just an extremely hard bug to find? Or is it just not a priority? The latter seems unlikely because of the recent changes like the env editor being fairly trivial in comparison to a problem like this.

I know it’s not something fundamental to CodeMirror, because I use it on some of my projects with not problems. So I’m guessing it is something that your team has tried to look at but just can’t work it out?

I’ve introduced a couple of people to Glitch and they have found this annoying too, so it just seems unusual that this problem has been around for years without getting fixed.

Oh… The problem is just a single weird CSS rule:

.text-editor .CodeMirror-cursors, .text-editor .CodeMirror-line, .text-editor .CodeMirror-selected {
  transform: translateX(3px);
}

In this file: webpack:///styles/editor.styl

@hubgit @tomglynch If you get the “Custom JavaScript For Websites 2” chrome extension, you can add this code to fix it:

let customStyles = document.createElement("style")
customStyles.type = "text/css"
customStyles.innerText = `
.text-editor .CodeMirror-cursors, .text-editor .CodeMirror-line, .text-editor .CodeMirror-selected {
  transform: none !important;
}
`;
document.head.appendChild(customStyles);
1 Like

Wow, great solution. @joe does this seem to break anything else? @Gareth @tasha is there some reason for this translation across?

@tomglynch It doesn’t seem to break anything for me! :tada: