-
Notifications
You must be signed in to change notification settings - Fork 1.6k
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
Fix triple-click selection on chromium #753
Conversation
const selection = view.getSelection(); | ||
if (selection !== null) { | ||
selection.focus.key = selection.anchor.key; | ||
selection.focus.offset = selection.anchor.getNode().getTextContentSize(); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Couldn't selection.anchor.getNode()
be a block node too?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Also you should never really mutate the focus or anchor points like this, instead prefer using the set
method.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Also you should never really mutate the focus or anchor points like this, instead prefer using the set method.
I was curious about this - decided to just wait for your comments in the PR instead of asking. Good to know.
I'm curious what bug the triple click brings? It seems to occur in other editors too. Why does patching it matter? I guess there are two things:
|
The bug occurs in a pretty basic use case. if I type two lines of text (two paragraphs) then I triple click to select the entire first one and try to format it to Bold or something, that style gets applied to the entire second paragraph as well. I don't think this can be considered "sane" behavior, from a UX standpoint, even if other editors are doing it that way. The Gmail composer doesn't have this behavior, neither does Quip, just from a cursory glance. Something else we can consider is whether it makes sense to just patch it in the BizComposer. Maybe it doesn't need to be in Outline at all. |
Aha, Triple click here isn’t the bug. Rather there’s a bug with the format logic.
if you’re selecting a text node at offset 0, we shouldn’t be applying any formatting or styling to that node, it should be skipped. |
e5d1cf6
to
d895cb9
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Awesome stuff! :)
// if the entire last node isn't selected, split it | ||
if (endOffset !== lastNodeTextLength) { | ||
[lastNode] = lastNode.splitText(endOffset); | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Should we fix this here? AFAIK the problem is with the split text logic. Usually you want to handle index case 0, because otherwise instead of the expected [before, after]
you get [after, undefined]
. Which sounds like the logic you've introduced after to address this
// if the entire last node isn't selected, split it | |
if (endOffset !== lastNodeTextLength) { | |
[lastNode] = lastNode.splitText(endOffset); | |
} | |
// if the entire last node isn't selected, split it | |
if (endOffset !== 0) { | |
if (endOffset !== lastNodeTextLength) { | |
[lastNode] = lastNode.splitText(endOffset); | |
} | |
lastNode.setFormat(lastNextFormat); | |
} |
@@ -357,8 +359,19 @@ export function getSelectionStyleValueForProperty( | |||
): string { | |||
let styleValue = null; | |||
const nodes = selection.getNodes(); | |||
const anchor = selection.anchor; | |||
const focus = selection.focus; | |||
const isBefore = anchor.isBefore(focus); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
const isBefore = anchor.isBefore(focus); | |
const isBefore = selection.isBackward(); |
* fix triple-click issue in formatting helper * ignore triple-click e2e test in plain-text environment. * implement suggested changes. Co-authored-by: Acy Watson <acy@fb.com>
Workaround for chromium issue:
https://bugs.chromium.org/p/chromium/issues/detail?id=575136