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

[android]: mark in editor.marks is not inserted on insertText #4405

Closed
imdbsd opened this issue Jul 30, 2021 · 2 comments
Closed

[android]: mark in editor.marks is not inserted on insertText #4405

imdbsd opened this issue Jul 30, 2021 · 2 comments

Comments

@imdbsd
Copy link
Contributor

imdbsd commented Jul 30, 2021

Description
Currently on rich text example, if accessed from android device the mark is not inserted on the inserted text.

Recording
bug-mark

Sandbox
It was replicated on https://www.slatejs.org/examples/richtext by accessing the site from android phone or chrome desktop with device set to google pixel that emulate android

Steps
To reproduce the behavior:

  1. https://www.slatejs.org/examples/richtext
  2. toggle mark button
  3. insert some text
  4. text inserted without the mark

Expectation
mark should be inserted with the selected mark

Environment

  • Slate Version:
    • slate: 0.63.0
    • slate-react: 0.65.2
  • Operating System: Android 9 - 11
  • Browser: Chrome

Context
i found out here, the mark is not checked when inserting text on android. im opening a PR #4342 but is there any concern why insert text is not reading the editor mark before?

@imdbsd
Copy link
Contributor Author

imdbsd commented Aug 2, 2021

if anybody facing the same issue as me. My current workaround was checking the editor.marks in onDOMBeforeInput on Editable

<Editable
{...editableProps}
onDOMBeforeInput={(event) => {
if (event.type === 'beforeinput' && event.inputType === 'insertText' &&  IS_ANDROID) {
      const text = event.data;
      const marks = editor.marks;
      if (typeof text === 'string' && marks) {
        event.preventDefault();
        const node = {text, ...marks};
        Transforms.insertNodes(editor, node, {
          match: Text.isText,
          at: editor.selection,
          select: true,
        });
        editor.marks = null;
      }
}
}}
 />

@imdbsd
Copy link
Contributor Author

imdbsd commented Aug 13, 2021

Closed, since #4342 was merged

@imdbsd imdbsd closed this as completed Aug 13, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant