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

RichText: Removing/merging richtext should only trigger if the selection is collapsed #8651

Merged
merged 3 commits into from
Aug 7, 2018

Conversation

youknowriad
Copy link
Contributor

@youknowriad youknowriad commented Aug 7, 2018

closes #8639
closes #8638

Testing instructions

Repeat the testing instructions from the issue, it should work as intended.

@youknowriad youknowriad added the [Feature] Rich Text Related to the Rich Text component that allows developers to render a contenteditable label Aug 7, 2018
@youknowriad youknowriad self-assigned this Aug 7, 2018
@youknowriad youknowriad requested review from ellatrix and a team August 7, 2018 11:26
@@ -437,8 +437,10 @@ export class RichText extends Component {
const { keyCode } = event;

if (
( keyCode === BACKSPACE && isHorizontalEdge( rootNode, true ) ) ||
( keyCode === DELETE && isHorizontalEdge( rootNode, false ) )
window.getSelection().isCollapsed && (
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should we continue with setting it at the top as browser dependencies? const { getSelection } = window;

( keyCode === BACKSPACE && isHorizontalEdge( rootNode, true ) ) ||
( keyCode === DELETE && isHorizontalEdge( rootNode, false ) )
window.getSelection().isCollapsed && (
( keyCode === BACKSPACE && isHorizontalEdge( rootNode, true ) ) ||
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For some reason I would have thought that isHorizontalEdge also does the check, as navigating also requires it.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, I noticed it was also checked in the WritingFlow. I didn't want to change isHorizontalEdge behavior as I wasn't sure about the implications

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe. As it reads, I see no reason why isHorizontalEdge should have any concern about whether the selection is collapsed or not. This assumes there's a use case for wanting to know if there's an uncollapsed selection at the horizontal edge. We don't have this need in our project, which might bias our opinion on it. Or maybe "is horizontal edge" is meant to mean that pressing ArrowLeft/ArrowRight would have no effect (in a traditional input).

Copy link
Member

@tofumatt tofumatt left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tested locally, works, nice 👍

@@ -87,4 +87,18 @@ describe( 'splitting and merging blocks', () => {

expect( await getEditedPostContent() ).toMatchSnapshot();
} );

it( 'Should not merge paragraphs if the selection is not collapsed', async () => {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We should have a rule but I think in general these should be lowercase. It's inconsistent now in the code though so whatever 😆

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Starting today (if I remember :P)

@@ -12,6 +12,16 @@ exports[`splitting and merging blocks Should merge into inline boundary position
<!-- /wp:paragraph -->"
`;

exports[`splitting and merging blocks Should not merge paragraphs if the selection is not collapsed 1`] = `
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As mentioned, it does make these specs read weirdly though.

@youknowriad youknowriad merged commit 42b870c into master Aug 7, 2018
@youknowriad youknowriad deleted the fix/backspace-collapsed-selection branch August 7, 2018 12:23
@aduth
Copy link
Member

aduth commented Aug 7, 2018

This duplicated effort from #8306

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Rich Text Related to the Rich Text component that allows developers to render a contenteditable
Projects
None yet
5 participants