Replace chinese character with other input, someting strange

v6
1

Hello! Thank you very much for providing such an excellent editor!

I want to replace the specific user input with other input. for example, when someone inputs “a”, i will replace with ‘b’.

I use transactionFilter to do this and everything is well. But if i want to replace chinese character, it becomes strange. for example, replace ‘，’ with ‘,’ . like gif below.

animate

It will insert ‘,’ twice.

and here is my extension code

EditorState.transactionFilter.of(tr => {
    if (!tr.docChanged) {
      return tr;
    }
    let replaceTr: TransactionSpec[] = [];
    tr.changes.iterChangedRanges((fromA, toA, fromB, toB) => {  
     // if i repalce the chinese '，' with 'a', 'b' .... , everything is ok 
      if (tr.newDoc.slice(fromB, toB).toString() === '，') {
        replaceTr = [{
          changes: {
            from: fromB,
            to: toB,
            insert: ","
          },
          sequential: true,
        }];
      }
    });

    return [tr, ...replaceTr]
  })

Hope for your help. Thank you

2

I suspect the Chinese input method uses composition in this case. Unfortunately, browsers do odd buggy things if you interfere with the text around the cursor during composition, including duplicating text.

Your options are to not respond to composition-based input (for example by checking tr.isUserEvent("input.type.compose")), or to set things so that the replacement happens after composition finishes (in a view plugin listening to compositionend events).

1 Like
3

oh，i see. Thank you !