Empty range for InputRule matching anything

revidee commented 1 year ago

What’s the bug you are facing?

Description An InputRule matching /./, i.e. any single character should trigger for each added character. It does, but the range in the handler is incorrect. The range.from and range.to is always the same.

Bonus Bug, probably a followup: When doing CTRL+A and then typing a single character, the matched range of the InputRule includes the complete document (from: 1, to: doc.length) - however, since everything was selected beforehand, there is nothing left in this range, making the range effectively invalid.

My Best guess: The input rule adds the inserted item as a 'fake' addition to the editor's text content. The input rule matcher matches and returns a range. The range's 'to' field exceeds the editor state's valid range and is being limited.

Real World Use case To replace content based on some input. This is used in a project to replace any valid Emoji-Unicode-Sequence with an EmojiNode. For that, the range of the matched handler shall be replaced with a NodeView. However, due to the range being incorrect, this causes no replacement, rather a simple addition.

commands.command(({ tr }) => {
            tr.replaceWith(
                range.from,
                range.to,
                this.type.create({
                    id: emojiHexcode
                })
            );
            return true;
        });

Which browser was this experienced in? Are any special extensions installed?

Chrome, Firefox, StarterKit + Custom-but-minimal-Extension with a custom InputRule matching anything (/./).

How can we reproduce the bug on our side?

Use minimal starting template

Add new Extension with an InputRule:

Node.create({
      name: "TestingInputRule",
      group: "inline",
      inline: true,
      selectable: false,
      atom: true,
      addInputRules() {
        return [
          new InputRule({
            find: /./,
            handler: ({ range }) => {
              console.log(JSON.stringify(range));
              return true;
            },
          }),
        ];
      },
    }).configure()

Add the extension to the editor
Type any single character
Look into the console output

Alternatively, take a look at the Codesandbox.

Can you provide a CodeSandbox?

https://codesandbox.io/s/still-cdn-qjtljj

What did you expect to happen?

The range should be of length 1 for single characters.
Unicode Characters inserted via ALT+ should allow for even bigger ranges.
The state of the InputRule's handler should include the state WITH the appended character. I.e. it should represent the state in which the Rule matched.
Thus, state.doc.textBetween(range.from, range.to) should return the matched character(s)

Anything to add? (optional)

Tested & Broken on Version beta.209 and beta.218.

Did you update your dependencies?

[X] Yes, I’ve updated my dependencies to use the latest version of all packages.

Are you sponsoring us?

[ ] Yes, I’m a sponsor. 💖

github-actions[bot] commented 1 year ago

This issue is stale because it has been open 45 days with no activity. Remove stale label or comment or this will be closed in 7 days

revidee commented 1 year ago

Still the same issue present in the most recent releases

revidee commented 1 year ago

Again, still present in the latest release.

Updated Codesandbox: https://codesandbox.io/s/nice-http-8hsz3m

revidee commented 1 year ago

Quarterly bump. Still relevant, as described. Tested with 2.1.11 https://codesandbox.io/s/crazy-mccarthy-y6s7w7

revidee commented 5 months ago

Again, more than 6 months later, this is still the case.

https://codesandbox.io/p/sandbox/optimistic-babycat-s86kh9

ueberdosis / tiptap