Hi,
We have been facing few issues around the HTML created when a font color is changed.
You can repro this in your demo page itself here - https://www.igniteui.com/html-editor/highlight-code
Steps -
In IE -
1. Select some text. Change the font color.
2. At the bottom of the editor, click on 'html ->' to check the html generated.
3. Notice that, font tags have been added with color attribute.
Example from demo page -
Use the <font color="#ff0000">Insert </font>code <font color="#00b050">snippet </font>button {;} to paste your code.
In older version of html editor, the color was in RGB like. This RBG colors has been changed to Hex in Bug No 224051 (From 2015.2 release notes)
Use the <font color="rgb(0, 176, 80)">Insert </font>code <font color="rgb(255, 0, 0)">snippet </font>button {;} to paste your code.
In Chrome -
3. Notice that, span tags have been added with color attribute.
Use the <span style="color: rgb(0, 176, 80);">Insert</span> code <span style="color: rgb(255, 0, 0);">snippet</span> button {;} to paste your code.
So, The questions are -
1. Why is the HTML different for IE and Crome ?
2. Every New line is added as a paragraph (<p>...</p>) in IE. The same is added as a div (<div>...</div>). Why ?
Is there anyway these can be made identical ?
I believe the demo version would be the latest and the issue still persists in latest version.
We are using vesion 13.2.
Any help is greatly appreciated.
Thanks & Regards,
Vaishnavi M G
Hello ,
I am able to reproduce the behavior you are describing using igHtmlEditor in IE and chrome browsers.
I am discussing this matter with the development team and can provide you an update when I hear them back.
Meanwhile if you have any further questions or concerns please let me know.
Hi Divya,
Thank you very much for the quick response.
Those are the only 2 queries we have at the moment. Please let me know when you have an update on this from your development team.
Thanks,
Vaishnavi
Thank you Divya for the details.
This has answered all my queries.
Hello Vaishnavi ,
I discussed both the behaviors with the development team and found the information as:
There are many differences between browser web-based text editing APIs.
When dealing with different browsers, the implementations for both selection and range can be different so both the behaviors are expected.
There is a blog post that is explaining most common differences; I hope you will benefit from it:
https://www.ephox.com/blog/a-quick-guide-to-browser-selection-models/
As for the mentioned Work Item 224051, the answer is yes, this behavior is expected because we've changed the value to be in Hex format:
Code snippet:
ui.value = $.ig.util.rgbToHex(ui.value);
Please let me know if you need further assistance.