Best way to work with varying line heights?

What is the best way to set arbitrary line heights per line anytime using JS?

On the varying heights demo on the website, I can change the cm-header-1 class to cm-header-5 using dev tools which changes the size fine, but the cursor isn’t correct:

cm2

cm1

My use case BTW is when a user hits a key, all non-foldable lines shrink down to 2px while the foldable lines remain the same. I can set this OK by manually adding cm-header-1 (unsure if this the most advisable approach?) but of course have the problem with the cursor still:

cm3

I’ve tried refresh() but that makes no difference.

Advice much appreciated.

Have you tried addLineClass?

No, but that works great, thanks!

Is there a good way to get an array of line numbers of all fold-able lines? and if possible, an array of line numbers of all lines containing class or function declarations?