1. Feedback
  2. JavaScript
  3. 58025

Welcome to the JavaScript feedback portal. We’re happy you’re here! If you have feedback on how to improve the JavaScript, we’d love to hear it!

  • Check out the features or bugs others have reported and vote on your favorites. Feedback will be prioritized based on popularity.
  • If you have feedback that’s not listed yet, submit your own.

Thanks for joining our community and helping improve Syncfusion products!

1
Vote

Adding more than one css class via the cssClass property causes errors with link popup

Hi,

If set the cssClass property on the rich text editor to have more than one class (using a space separator) you get an error with the link insert popup when it closes.

To demonstrate the issue I've cloned your link example from the documentation and set two css classes via cssClass (i.e. two class names with a space separator as the string value).

https://stackblitz.com/edit/yfihl4?file=index.ts

So when you turn a piece of text into a link and click on "Insert" on the link popup you then get an error of:

"Failed to execute 'remove' on 'DOMTokenList': The token provided ('class1 class2') contains HTML space characters, which are not valid in tokens."

Looking at the stack trace this comes from when code in actions/base-quick-toolbar.js does the following:

                if (this.popupObj && this.parent.cssClass) {
                    removeClass([this.popupObj.element], this.parent.cssClass);
                    addClass([this.popupObj.element], this.parent.cssClass);
                }
And removeClass in base seems to expect either an array of single class names or a string with a single class name.
Since removeClass can take a list of classes the fix would be to change the removeClass line to do the following:
removeClass([this.popupObj.element], this.parent.cssClass.split(' '));

Note that the documentation for the cssClass property for the rich text editor says:

"One or more custom CSS classes can be added to a RichTextEditor."

So I don't think it's an error to pass in two classes separated by a space, so I think the bug is that the removeClass call here doesn't cope with this.parent.cssClass potentially having more than one CSS class in its string value.
Regards,
Matt