Large space next to CKEditor 4 footnote when value is empty

Created on 3 December 2023, 7 months ago
Updated 26 May 2024, about 1 month ago

Following up on ✨ Fn value in the backend Fixed and after upgrading to Footnotes 3.1.0, we now have a long white space next to the footnote in the back-office.
We left the value to blank so the footnote number is automatically calculated but it shows [0] and a whitespace (see screenshot) :

This comes from an error in the length calculation of the footnote which will create an SVG image like this :

data:image/svg+xml;utf8,<svg width='NaN' height='14' xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg'><text fill='blue' style='font-size:0.7em;font-weight:500;font-family: sans-serif;' x='0' y='9'>[0]</text></svg>

Note the NaN which comes from this code when the default value is 0 and value.length will return undefined.

            const value = element['attributes']['value'] ? element['attributes']['value'] : 0;
            const svgWidth = 10 + value.length * 6;

A simple fix is to cast it as a string.

πŸ› Bug report
Status

Needs review

Version

3.1

Component

Footnotes

Created by

πŸ‡«πŸ‡·France tostinni

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Merge Requests

Comments & Activities

Production build 0.69.0 2024