Upgrade CodeMirror

[simonw]

Datasette currently bundles 5.31.0 (from October 2017) - latest version is 5.57.0 (August 2020). https://codemirror.net/doc/releases.html

[simonw]

CodeMirror 6 is in pre-release at the moment and is a complete rewrite. I'll stick with the 5.x series for now. https://github.com/codemirror/codemirror.next/

[simonw]

It would also be interesting to try out the SQL hint mode, which can autocomplete against tables and columns. This demo shows how to configure that: https://codemirror.net/mode/sql/

[simonw]

Minifying using npx:

npx uglify-js codemirror-5.57.0.js -o codemirror-5.57.0.min.js
npx uglify-js codemirror-5.57.0-sql.js -o codemirror-5.57.0-sql.min.js
npx clean-css-cli codemirror-5.57.0.css -o codemirror-5.57.0.min.css

[simonw]

One catch: this stripped the license information from the top of the JS.

I fixed this by editing the license to be a single /* ... */ block comment instead of multiple // lines and running this:

npx uglify-js codemirror-5.57.0.js -o codemirror-5.57.0.min.js --comments '/LICENSE/'

[simonw]

So the steps needed are:

• Download and extract latest CodeMirror zip file
• Rename lib/codemirror.js to codemirror-5.57.0.js
• Rename lib/codemirror.css to codemirror-5.57.0.css
• Rename mode/sql/sql.js to codemirror-5.57.0-sql.js
• Edit both JS files to make the top comment a /* */ block
• Minify JavaScript files like this:
  • npx uglify-js codemirror-5.57.0.js -o codemirror-5.57.0.min.js --comments '/LICENSE/'
  • npx uglify-js codemirror-5.57.0-sql.js -o codemirror-5.57.0-sql.min.js --comments '/LICENSE/'
• Check that the LICENSE comment did indeed survive minification
• Minify CSS file like this:
  • npx clean-css-cli codemirror-5.57.0.css -o codemirror-5.57.0.min.css
• Edit the _codemirror.html template to reference the new files
• git rm the old files, git add the new files

[simonw]

I'll wait for this to deploy to https://latest.datasette.io/ and then test it in various desktop and mobile browsers.

[simonw]

Copy and paste on mobile safari seems to work now. #655

[simonw]

I added documentation on how to upgrade CodeMirror for the future here: https://docs.datasette.io/en/latest/contributing.html#upgrading-codemirror