Rich text rendering in Chrome

Lita Gribben
Lita Gribben Member, Data Exchange, Jama Connect Interchange™ (JCI) Posts: 90

Our users reported some items with text appearing "cut off" within a Review, which makes it a bit difficult to read. I am attaching screenshots comparing how the same item looks from the Project Single item (or Reading) view, and how it looks from the Review Center Reading View (the Review Center single item view looks fine).

I did some testing and found the following:

  • This is only noticeable in Chrome or chromium based browsers like Edge. It renders fine in Firefox.
  • When checking the source code of the item Description, I notice it came with extra html code that included a white background:

<p><span style="font-size:12pt"><span style="background-color:white"><span style="font-family:&quot;Times New Roman&quot;,serif"><span style="font-size:10.0pt"><span style="font-family:&quot;Arial&quot;,sans-serif"><span style="color:black">Requirement: Estimation<br />

  • It is this white background that makes the text look cut-off, but not on Firefox apparently.
  • I asked the item creator who incorporated this text where they copied and pasted it from, to find out where the source code was coming from, but they couldn't remember much. They thought they copied and pasted from a different item type inside of Jama, but my testing could not replicate how that background was pasted.

This is something that was not noticeable until the items were sent for review, and of course to users this only seems like a small bug on the view but not a problem with their content, especially since they rarely (if ever) check the actual source of the rich text.

Considering it's only happening on Chrome/Edge, is this something being tracked as a bug? We prefer not to restrict our users to one browser since Jama supports Chromium as well. And we have documented and advertised the "remove formatting" button, but considering the amount of data we have, most people don't have the bandwidth to do that with every single item, or they don't know and then this type of formatting just keeps being carried over. Any advice?

image 


Text obviously appears cut off, this is only visible in chrome



------------------------------
Lita Gribben
Blue Origin
------------------------------

Comments

  • [Deleted User]
    [Deleted User] Posts: 152
    edited June 2023

    Hi Lita, 

    This is an interesting one, and thanks for testing occurrence so thoroughly! Folk should definitely be able to use any of the supported browsers without seeing a significant difference in usability, we agree. Let's connect you with our Support team to dig into this deeper and see what's going on -- please file a ticket HERE and include a URL to this thread in the ticket description (we'll likely need HAR files from the current environment as well as a support bundle).

    Thanks! 

    ------------------------------
    Carly Rossi // she/her/hers
    Community Program Manager // Jama Software
    Portland, OR
    ------------------------------
    -------------------------------------------
    Original Message:
    Sent: 06-02-2023 08:21
    From: Lita Gribben
    Subject: Rich text rendering in Chrome

    Our users reported some items with text appearing "cut off" within a Review, which makes it a bit difficult to read. I am attaching screenshots comparing how the same item looks from the Project Single item (or Reading) view, and how it looks from the Review Center Reading View (the Review Center single item view looks fine).

    I did some testing and found the following:

    • This is only noticeable in Chrome or chromium based browsers like Edge. It renders fine in Firefox.
    • When checking the source code of the item Description, I notice it came with extra html code that included a white background:

    <p><span style="font-size:12pt"><span style="background-color:white"><span style="font-family:&quot;Times New Roman&quot;,serif"><span style="font-size:10.0pt"><span style="font-family:&quot;Arial&quot;,sans-serif"><span style="color:black">Requirement: Estimation<br />

    • It is this white background that makes the text look cut-off, but not on Firefox apparently.
    • I asked the item creator who incorporated this text where they copied and pasted it from, to find out where the source code was coming from, but they couldn't remember much. They thought they copied and pasted from a different item type inside of Jama, but my testing could not replicate how that background was pasted.

    This is something that was not noticeable until the items were sent for review, and of course to users this only seems like a small bug on the view but not a problem with their content, especially since they rarely (if ever) check the actual source of the rich text.

    Considering it's only happening on Chrome/Edge, is this something being tracked as a bug? We prefer not to restrict our users to one browser since Jama supports Chromium as well. And we have documented and advertised the "remove formatting" button, but considering the amount of data we have, most people don't have the bandwidth to do that with every single item, or they don't know and then this type of formatting just keeps being carried over. Any advice?

    image 
    Text obviously appears cut off, this is only visible in chrome


    ------------------------------
    Lita Gribben
    Blue Origin
    ------------------------------