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

fix: Backspaces do not work when the code block contains initial data. #2836

Open
wants to merge 8 commits into
base: next
Choose a base branch
from

Conversation

yosipy
Copy link

@yosipy yosipy commented Oct 4, 2024

fix: editor-js/code#75

editor-js/code#67

When we add a new code block, backspace works.

1.mp4

However, when updating a code block with initial data, backspaces do not work.

      const editorConfig = {
        data: {
          blocks: [
            
            {
              type: "code",
              data: {
                code: 'console.log("ssss")',
              },
            },
          ],
2.mp4

Cause

The value of the argument input of function isCaretAtStartOfInput (src/components/utils/caret.ts) is as follows when there is no initial value.

<textarea class="ce-code__textarea cdx-input" placeholder="Enter a code" data-empty="false"></textarea>

When there is an initial value, the value is as follows.

<textarea class="ce-code__textarea cdx-input" placeholder="Enter a code" data-empty="false">console.log("ssss")</textarea>

firstNode is the string 'console.log(“ssss”)' and isCaretAtStartOfInput()==true.

Solution

When the argument input is native input, firstNode is assigned input.

@@ -112,7 +112,7 @@ export function checkContenteditableSliceForEmptiness(contenteditable: HTMLEleme
* @param input - input where caret should be checked
*/
export function isCaretAtStartOfInput(input: HTMLElement): boolean {
const firstNode = $.getDeepestNode(input);
const firstNode = $.isNativeInput(input) ? input : $.getDeepestNode(input);
Copy link
Member

Choose a reason for hiding this comment

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

I'd suggest to update getDeepestNode instead. It already contains a logic that will return a passed node, but seems like node[child] statement does not cover this case

Copy link
Author

Choose a reason for hiding this comment

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

Thank you for pointing it out.
I think you are right too.

Fixed in 8cec5c9.

Copy link
Author

Choose a reason for hiding this comment

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

@neSpecc
Please re-review.

@yosipy yosipy requested a review from neSpecc October 5, 2024 16:23
Copy link
Member

@neSpecc neSpecc left a comment

Choose a reason for hiding this comment

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

seems ok, please add a line to the changelog

@yosipy
Copy link
Author

yosipy commented Oct 10, 2024

@neSpecc

Yes, I added it.

@yosipy yosipy requested a review from neSpecc October 10, 2024 10:52
@CasFreriks
Copy link

When will this pull request be reviewed? It's a pretty annoying bug.

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

Successfully merging this pull request may close these issues.

Backspaces do not work when the code block contains initial data.
3 participants