Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

oldValue and newValue are NaN #81

Open
MatteoCampinoti94 opened this issue Jan 19, 2022 · 8 comments
Open

oldValue and newValue are NaN #81

MatteoCampinoti94 opened this issue Jan 19, 2022 · 8 comments

Comments

@MatteoCampinoti94
Copy link

Hi,
I'm having this weird issue with fitty.

I have the following HTML structure:
Screenshot 2022-01-19 at 11 27 53

And I'm using muicss together with this simple stylesheet:
Screenshot 2022-01-19 at 11 19 35

And then at the end of the body, I import fitty via jsdelivr and initialise it with the right elements:
Screenshot 2022-01-19 at 11 15 08

(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:
Screenshot 2022-01-19 at 11 17 48
Screenshot 2022-01-19 at 11 17 55

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).

@rikschennink
Copy link
Owner

can you create a public test case for this?

@MatteoCampinoti94
Copy link
Author

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.

@rikschennink
Copy link
Owner

It would be easiest if you can create a reproduction on codesandbox.io

@MatteoCampinoti94
Copy link
Author

MatteoCampinoti94 commented Jan 20, 2022

Here it is https://codesandbox.io/s/fitty-test-29ksf

Didn't know about that website, thanks for the suggestion!

@rikschennink
Copy link
Owner

It throws an "Cannot import an empty path" error, not sure what I should be looking at?

@MatteoCampinoti94
Copy link
Author

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.

@rikschennink
Copy link
Owner

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.

@MatteoCampinoti94
Copy link
Author

Will try 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants