Skip to content

Conversation

@AdamMcCormick
Copy link

I'm attempting to use rangy to apply highlights and notes to a document reader application. While the library is really good at applying the highlights, I need to add several different classes to each highlight. I can't seem to find any means of doing that with the ClassApplier as-is. This change allows the caller to pass a space-separated list of classes to a ClassApplier and thereby add as many classes as needed.

My apologies if this isn't the right process to make such a suggestion.

@nicholascloud
Copy link

+1 for this feature request.

Rangy used to support this in 1.3alpha.722 because it appended to an element's className property, whereas now classList is used.

// old 1.3alpha.722 function
function addClass(el, cssClass) {
    if (el.className) {
        if (!hasClass(el, cssClass)) {
            el.className += " " + cssClass;
        }
    } else {
        el.className = cssClass;
    }
}

@geirsagberg
Copy link

I am also in need of this functionality, would be awesome is this is merged in.

@LeZuse
Copy link

LeZuse commented Dec 2, 2015

I am using this workaround:

    rangy.createClassApplier('snippet', {
      elementTagName: 'span',
      onElementCreate: el => {
        el.className = cx(el.className, 'another-class');
      },
    });

@MimmyJau
Copy link

MimmyJau commented Feb 21, 2023

A documented solution for adding an extra class is to use the className property in the elementAttributes object.

rangy.createClassApplier('firstClass', {
    elementAttributes: {
        className: 'secondClass'
    }
});

But I wasn't able to get this method to work for more than one extra class since the className property doesn't accept any tokens with whitespace. If anyone knows better let me know. For now, @LeZuse's solution still works.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants