Decorating newline characters

v6
1

I’d like to make newline characters (\n) visible. I tried to adapt highlightWhitespace as follows:

function matcher(decorator: MatchDecorator): Extension {
    return ViewPlugin.define((view) => ({
        decorations: decorator.createDeco(view),
        update(u): void {
            this.decorations = decorator.updateDeco(u, this.decorations);
        },
    }), {
        decorations: (v) => v.decorations,
    });
}

const newlineHighlighter = matcher(
    new MatchDecorator({
        regexp: /\n/g,
        decoration: (match) => Decoration.mark({ class: 'cm-newline' }),
    }),
);

However this doesn’t work … the documentation states for regexp:

The regular expression to match against the content. Will only be matched inside lines (not across them). Should have its ‘g’ flag set.

I assume this doesn’t work because the newline isn’t considered to be part of the line? How could I make this work?

2

Indeed, line breaks aren’t part f the text. You could write an extension that adds a widget to every line except the last line to get something like this, I suppose.

3

Ah ok thanks … using widget decorators indeed works :slight_smile:

(sidenote: I tried using an empty mark decoration but apparently mark decorations cannot be empty … hence a widget decoration)