Jump to content
GreenSock

SIeepwalker

Chrome devtools makes SplitText break lines at wrong point

Recommended Posts

I just found a weird bug. I have SplitText set on type: "lines" for a p in my code. It renders like this:

 

image.thumb.png.1f111bb7b1630af608522f3fde9ebfb9.png

 

However, if I reload the page, the lines break at weird points like so:

 

image.thumb.png.b2efb6e7301851a750874637f25d3878.png

 

It doesn't seem to be a window size issue as I do not have this problem if I close devtools and resize the page manually before reloading.

Since it works fine without devtools open, it is not really an issue but I am curious as to what would cause this.

(Also, since I always dev with devtools open, it took me way longer than I would admit to find the source of the problem, and I was pulling my hairs out 🤦‍♂️).

 

Thank you for your time reading this and happy Tweening :)

 

EDIT: added codepen with my full code (missing some images and fonts) but the problem does not reproduces inside of codepen.

See the Pen dyVQKzV by sieepwalker (@sieepwalker) on CodePen

Link to comment
Share on other sites

Welcome to the forums @SIeepwalker

 

Do you think you can make a minimal demo that shows the issue so we can investigate the problem? Thanks!

Link to comment
Share on other sites

44 minutes ago, OSUblake said:

Welcome to the forums @SIeepwalker

 

Do you think you can make a minimal demo that shows the issue so we can investigate the problem? Thanks!

Thank you for your answer. I tried to make a codepen but didn't manage to reproduce the bug inside of it.

I will edit my post to add it anyway so you can see my full code. It is missing some fonts and images that I only have locally on my machine.

Link to comment
Share on other sites

@OSUblake Wow, this was actually the cause, thank you very much.

 

I didn't even consider something like that, the SplitText posts I've checked didn't mention it either, sorry that I didn't find the right one(s).

Makes sense that devtools would trigger the issue now, as I have it prevent caching when open.

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×