I want to debug an issue in tabulator.js tool, but I don’t know how to setup correctly for debugging. I want to try fix this bug that someone posted in this jsfiddle https://jsfiddle.net/krishnasai057/pxqrjd2b/
Here is my setup:
I have a simple flask app to serve up content
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index():
return render_template('index.html')
app.run(debug=True, host='0.0.0.0', port=5000)
with this dir structure
tree -L 2
.
├── app.py
├── static
│ ├── main.js
│ └── tabulator << this is the git clone dir
└── templates
└── index.html
and the index.html
<!DOCTYPE html>
<html>
<head>
<link href="https://unpkg.com/[email protected]/dist/css/tabulator.min.css" rel="stylesheet">
<script src="/static/tabulator/dist/js/tabulator.js"></script>
</head>
<body>
<div id="example-table"></div>
<script>
var table = new Tabulator("#example-table", {
height: "100%",
width: "100%",
data: tableData,
layout: "fitData",
columns: [
{ title: "id", field: "id", width: 150 },
{ title: "parentId", field: "parentId" },
],
dataTree: true,
dataTreeStartExpanded: false,
});
</script>
</body>
</html>
All this works where the source.map correctly points out the non minified code that it loads from <script src="/static/tabulator/dist/js/tabulator.js"></script>
say for example I want to edit the code in /static/tabulator/src/js/modules/DataTree/DataTree.js
, how does the dist/js/tabulartor.js pick up the data.
I have seen jsx compiler do similar thing for every edit it recreates the dist folder. So what am i missing ?