CODEWITHSUNDEEP
javascriptpythonreactjsace-editorreact-ace
Jayavel
Jayavel

Reputation: 3407

Enable Python syntax validation/checker in ace editor

In my web app, I'm using an ace editor with python mode as below:

var editor = ace.edit('aceEditor');
editor.setTheme("ace/theme/monokai");
editor.getSession().setMode("ace/mode/python");
editor.getSession().setUseWorker(false);
editor.setHighlightActiveLine(false);
editor.setShowPrintMargin(false);
ace.require("ace/ext/language_tools");
editor.setOptions({
    enableBasicAutocompletion: true,
    enableSnippets: true
});
editor.setBehavioursEnabled(true);
editor.setValue(`n=int(input("Enter the number of elements to be inserted: "))
          a=[]
          for i in range(0,n):
              elem=int(input("Enter element: "))
              a.append(elem)
          avg=sum(a)/n
          prin("Average of elements in the list",round(avg,2))`, -1);
#aceEditor {
 width: 100%;
 height: 260px; 
 border: "1px solid #ddd";
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.4.2/ace.js"></script>
<div id="aceEditor"></div>

If print is wrongly typed by user, I need to show validation like below:

HTML Syntax validation

ace editor have syntax validation/check for HTML, JavaScript. But In my case, I need to show errors for python and I'm open to use other editors which supports my requirement and I'm open to use react-ace also, In react-ace, can't find a solution demo on react-ace

I came across this Issue, where it states Cloud9 uses pylint to display syntax errors. If so, how to enable this in the web app and I guess ace doesn't have built-in support for this? Any help/ guide on this really helpful

Upvotes: 1

Views: 5460

Answers (1)

Don Kirkby
Don Kirkby

Reputation: 56660

I can think of a couple of options:

  1. You could find a Python parser written in Javascript. A quick Google search found filbert for me. I expect there are others.
  2. Use a full Python implementation that runs in the browser, then use Python tools to do your validation. I used the Pyodide project to build a browser version of my Live Coding in Python.

Upvotes: 2

Related Questions