Last Updated: 25 Jan 2022 14:28 by ADMIN
Created on: 19 Aug 2021 12:59
Category: Editor
Type: Bug Report
Spelling correction leads to DOM change and incompatibility with the fontsize tool

Correcting a misspelled word with some fontsize decoration results in Chrome changing the DOM element to font tag and style to face attribute.

This leads to the font tool not recognizing the font size and shows inaccurate value.

Reproduction of the problem

  1. Delete all content
  2. Type 'Heloo' and change its font size
  3. Correct the misspelled word.

Current behavior

Dom is changed to font tag with size attribute. And the font tool not showing the correct font size.

Expected/desired behavior

Either the Editor to retain or bring back the proper tag and style. Or update the font size to recognize the font size from font tag and size attribute


  • Browser: [ Chrome 92.0.4515.15 ]
Posted on: 25 Jan 2022 14:27

Hi Chinmaya,

I have replied in the support thread regarding the issue. However, as it could be helpful to the other users I will leave a comment below as well.

When the browser spellchecker is used a size attribute is injected by the browser. Currently, the fontSize tool reads the value of the 'size' attribute. However, the values of the size attribute correspond to values such as "x-small", "small", etc. Such values are absolute-size keywords, based on the user's default font size. The Editor does not contain "x-small", "small", etc. in the list of predefined sizes for its fontSize tool. It is also hard to predict what will be the value of "x-small", "small", etc. in pixels. For this reason, in such a case, the value of the size attribute injected by the browser spell correction is displayed in the fontSize dropdown.

The fontSize tool can be configured to use values in pixels. Thus, pixels will be displayed in the tool even after using the browser spellchecker.

tools: [              
                name: "fontSize",
                items: [
                  { text: "8px",  value: "8px" },
                  { text: "14px", value: "14px" },
                  { text: "16px", value: "16px" },
                  { text: "20px", value: "20px" }

Dojo with sample configuration is linked here.

Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Posted on: 21 Jan 2022 03:37


Can we get to know when can this be taken up. Our customers are waiting for this and we have no news to share.