adding syntax highlighting to Jupyter notebook cell magic

Question

I'm trying to figure out how to activate CodeMirror syntax highlighting for a CodeMirror-supported language (cypher) within a cell for a custom Jupyter cell magic (%%mymagic). The magic isn't associated with a special kernel - it just runs Python commands that process the string entered into the cell that I want to highlight. From what I can tell, this ostensibly can be done using something like

from notebook.services.config.manager import ConfigManager
cm = ConfigManager()
cm.update('notebook', {'CodeCell': {'highlight_modes': {'magic_cypher': {'reg': '^%%mymagic'}}}})

within the class that implements the magic. I can't seem to get this to work, however; no change in highlighting occurs when I enter stuff in a cell that starts with %%mymagic. Is the above approach accurate? Does 'magic_cypher' need to have a specific format? Does the magic need to somehow specify the MIME type CodeMirror associates with the desired highlighting language? I'm using notebook 5.0.0, jupyter_core 4.3.0, and python 2.7.13.

score 13 · Accepted Answer · edited May 23 '17 at 12:10

13

The following code works for SQL when placed in ~/.jupyter/custom/custom.js with notebook 5.x:

require(['notebook/js/codecell'], function(codecell) {
  codecell.CodeCell.options_default.highlight_modes['magic_text/x-mssql'] = {'reg':[/^%%sql/]} ;
  Jupyter.notebook.events.one('kernel_ready.Kernel', function(){
  Jupyter.notebook.get_cells().map(function(cell){
      if (cell.cell_type == 'code'){ cell.auto_highlight(); } }) ;
  });
});

Credit goes to Thomas K for this info!

edited May 23 '17 at 12:10

Community

1
1

answered Apr 28 '17 at 18:17

lebedov

1,371
2
12
27

My testing shows this works on both 5.x and 6.x - Thanks! – cco Apr 28 '17 at 21:19
@cco, have you been able to activate syntax highlighting for other languages supported by CodeMirror besides sql? – lebedov May 01 '17 at 14:50
1

I've just tried it, and adding `codecell.CodeCell.options_default.highlight_modes["application/x-cypher-query"] = {'reg':[/^%%cypher/]} ;` to custom.js (just after the similar line for SQL) seems to work correctly. The key in `highlight_modes` must match the MIME type in the `defineMIME` line of the Codemirror mode file. – cco May 02 '17 at 04:27
Turns out I had a `~/.jupyter/nbconfig/notebook.json` that was silently activating cypher mode for %%cells regardless of `~/.jupyter/custom/custom.js`. – lebedov May 02 '17 at 14:40

score 0 · Answer 2 · answered Apr 26 '17 at 20:55

0

The case where I've been successful doing this was in adding SQL highlighting for the %%sql magic. I did this by adding the following to ~/.jupyter/custom/custom.js. The first line adds the mode to the Codemirror configuration, the rest apply the style to any existing cells in the workbook that need it (later cells will get styled appropriately as they are created). I haven't been successful in having it happen when the magic is installed, although I expect that it is possible.

IPython.CodeCell.config_defaults.highlight_modes['magic_text/x-mssql'] = {'reg':[/^%%sql/]} ;
IPython.notebook.events.one('kernel_ready.Kernel', function(){
    IPython.notebook.get_cells().map(function(cell){
        if (cell.cell_type == 'code'){ cell.auto_highlight(); } }) ;
});

answered Apr 26 '17 at 20:55

cco

5,873
1
16
21

What version of Jupyter are you using? – lebedov Apr 26 '17 at 21:15
Same as you are - Notebook 5.0.5 and Jupyter 4.3.0; Python 2.7.9, but that shouldn't make any difference. – cco Apr 26 '17 at 21:26
For the `custom.js` you described, should text be styled in real-time as one enters it in a cell beginning with `%%sql`? I'm not seeing that happen for some reason after loading ipython-sql. – lebedov Apr 27 '17 at 17:48
Moreover, I verified that Jupyter sees my `custom.js` by running the notebook server in debug mode. – lebedov Apr 27 '17 at 18:11
My mistake - it worked with the 4.x notebook, but I just looked and it doesn't work with 5.0. If I get to work again, I'll let you know. – cco Apr 27 '17 at 20:52
Try switching `config_defaults` to `options_default` (sorry for the change, the frontend config machinery got reworked a bit). I think it's still subject to a race condition, but hopefully it will work well enough. – Thomas K Apr 28 '17 at 10:52
Hm..doesn't seem to have any effect on the color of the code entered after %%sql. – lebedov Apr 28 '17 at 14:05

adding syntax highlighting to Jupyter notebook cell magic

2 Answers2

Linked