fitty
fitty copied to clipboard
rikschennink
oldValue and newValue are NaN
Hi, I'm having this weird issue with fitty.
I have the following HTML structure:
And I'm using muicss together with this simple stylesheet:
And then at the end of the body, I import fitty via jsdelivr and initialise it with the right elements:
(The updateBadge function uses the form fields to change the innerText of the .example elements, but otherwise doesn't modify them)
The fit event triggers correctly on content change, but it doesn't actually update the font size. It doesn't even seem to get the current font size. Here is the log output of the fit event:
The first event is when fitty is initialised, the second when the event triggers from a content change. As you can see it cannot compute the new value, and even the current is a NaN after the first event.
I tried everything I can think of, including removing all styles (with the exception of no-wrap and inline-block).
Here is the index file (minus the backend template parts). The actual web app has already been updated with a different method so no online test alas :/
GitHub doesn't allow HTML extensions, so I had to change it to txt index.txt.
It would be easiest if you can create a reproduction on codesandbox.io
Here it is https://codesandbox.io/s/fitty-test-29ksf
Didn't know about that website, thanks for the suggestion!
It throws an "Cannot import an empty path" error, not sure what I should be looking at?
Fixed it. It's a codesandbox error, apparently it doesn't like empty src attributes. To see the error just enter values in the username and label fields. The example tags update the content correctly, but the fit events cannot determine their font size.
Tried to find the issue but wasn't successful.
I'd restart with a basic page and then work my way from there to find at what point the calculations go wrong.