react-monaco-editor icon indicating copy to clipboard operation
react-monaco-editor copied to clipboard

All content in editor is automatically selected

Open HaydenOrz opened this issue 2 years ago • 0 comments

Describe the bug All content in the editor is automatically selected after changing the value.

To Reproduce This is my code

import { useEffect, useState } from 'react';
import MonacoEditor from 'react-monaco-editor';

export default function IndexPage() {
  const [ value, setValue ] = useState('')

  useEffect(() => {
     setTimeout(() => {
      setValue(`create table if not exists hudi_cow (
        _hoodie_commit_time string,
        _hoodie_commit_seqno string,
        _hoodie_record_key string,
     ) using hudi 
     tblproperties ( 
        'totalSize'='866815',
        'last_commit_time_sync'='20230614194950434',
        'last_commit_completion_time_sync'='20230614194958496',
     )`)
    }, 1000)
  }, [])

  return (
    <div style={{ height: 300, width: 800, margin: 30, border: "1px solid #DDD" }}>
      <MonacoEditor
        value={value}
        language='sql'
      />
    </div>
  );
}

setTimeout in code is used to simulate the backend interface.
Note that if the initial value is not an empty string, this bug will not occur, such as

  const [ value, setValue ] = useState(' ')

Expected behavior I hope that the auto-selected one does not appear.

Tips This bug may be related to this issue of monaco-editor.

  • [ ] I will try to send a pull request to fix this issue.

HaydenOrz avatar Jul 13 '23 06:07 HaydenOrz