Css transitions on marked text

Hi! I’m trying to highlight some variables using markText() and make the highlight have a subtle fade-in, but I’m not being able to make the css transition work. Currently I’m a passing a className: "highlighted" and using the following css to add a background color to them:

.cm-variable {
    border-radius: 3px;
    transition: all 0.3s;

.cm-variable.highlighted {
    background-color: rgba(65, 105, 225, 0.15);

The class and background color get applied properly but the transition doesn’t work, does anyone know what may be the problem?

Huge thanks in advance!

The editor is redrawing the nodes whose marks changed, so CSS transitions don’t get started.

Ooooh, that was the problem. Will try to find a workaround and report back. Thanks for the quick response Marijn! (and for such an awesome editor :raised_hands:t3:)