React-ace: Ctrl-F cannot be used

[pian01]

Ctrl-F lookup cannot be used

[AlonBe]

Did you had any errors on the console?

Ctrl-F tries to load the searchbox extension

Try using: import 'brace/ext/searchbox';

[gillesdemey]

I can confirm that it works when importing import 'brace/ext/searchbox', thanks @AlonBe!

I suggest we close this one?

[securingsincity]

thanks @AlonBe and @gillesdemey

[KurtPreston]

Is there any way to disable the Ctrl-F functionality instead, so the browser's native search can still be used?

[KurtPreston]

This StackOverflow post describes how Ace Editor supports removing the command via

editor.commands.removeCommand('find');

Is there a way to do this in react-ace?

[securingsincity]

https://github.com/securingsincity/react-ace/blob/master/docs/FAQ.md#how-do-call-methods-on-the-editor-how-do-i-call-undo-or-redo explains how to call methods on the editor. also onLoad returns the instance of the editor so you could also do that there.

[yamyamyuo]

thanks @AlonBe this works for me!

[hkedia321]

Hi @yamyamyuo @securingsincity, I am trying this, but getting the error: Uncaught TypeError: _this.requestEditor.removeCommand is not a function
My code:

this.requestEditor = React.createRef()
.......
this.requestEditor.current.editor.removeCommand('find')
.......
<AceEditor
       ref={this.requestEditor}
/>

Can someone please help me?
@yamyamyuo If it has worked for you can you please share the syntax?

[stuartcrobinson]

@hkedia321 this works for me to remove search (ctrl/cmd-f) from react-ace

  componentDidMount() {
    this.reactAceComponent.editor.commands.removeCommand('find');
    //...
  }

...

  <AceEditor
    ref={refs => { this.reactAceComponent = refs }}
    //...
  />

[dadwic]

import "ace-builds/src-noconflict/ext-searchbox";