default values + argument unpacking causes observable syntax highlighter to slightly break

In the following, both a and b should be parsed as arguments:

f = ([a=1, b=2]) => a + b

But in Observable’s code viewer, a is colored black while b is gray.

1 Like

Thanks for identifying this issue! It’s an upstream bug in CodeMirror, which we use for text editing. I’ve written a PR to fix it in CodeMirror for everyone, and once that’s resolved we’ll pull changes back down to fix it in Observable.


I assumed as much. I was just too lazy to track the bug further upstream. Thanks!

While you’re at it :slight_smile:, some syntax highlighting bugs occurring with multiline function signatures :

We’re discovering a lot of things to fix in CM :slight_smile: The first bug - defaults in array destructuring - is fixed upstream in CodeMirror and deployed to Observable. Looking into the second, which might be a bit trickier. CodeMirror’s syntax highlighting is streaming/online so it doesn’t really backtrack, which means that its arrow-function highlighting relies on this self-described ‘crude hack’, which, in this case, is apparently too crude.

1 Like

Wow, what a fast turnaround! Awesome.

My code highlights correctly now,

Look above. Now, look at me. Now, look back above. Now, look back at me.

The variables defined in the destructured object parameter are not recognized by the syntax highlighter. They appear as faded, which implies the variable has not been in previous context. This is false. The variable selectedTopic should be blue.