container-query-polyfill icon indicating copy to clipboard operation
container-query-polyfill copied to clipboard

Container query stops working when changing DOM

Open kspar opened this issue 3 years ago • 6 comments

It seems that under some specific circumstances, changes in DOM either aren't detected or for some other reason, the generated class is not reattached to @container-affected elements.

It seems that two container queries are needed to reproduce the issue.

Minimal example: https://jsfiddle.net/edt3b1Lz/ After clicking on Render A, .a's container query stops working until the container is resized.

kspar avatar Jan 26 '22 09:01 kspar

I am experiencing the same thing, my components loads in async(about 7 secs after cqfill loads), and sometimes cqfill handles it well, but most of the time it doesn't. Looks like the style tag is modified with all the new cqfill classes, but it is not being attached to the elements inside the container. Resizing fixing my issue as well

Blazsoul avatar Jan 30 '22 16:01 Blazsoul

Are there any updates on this?

PriitPaluoja avatar Feb 03 '22 14:02 PriitPaluoja

Did anyone find any workaround ?

Blazsoul avatar Feb 20 '22 22:02 Blazsoul

My workaround so far has been to redraw the whole container, which isn't ideal.

kspar avatar Feb 22 '22 12:02 kspar

same problem here

yuuk avatar Aug 06 '22 08:08 yuuk

same problem here

yuuk avatar Aug 06 '22 08:08 yuuk

This issue should be fixed by the newest version of the polyfill (currently in alpha). Please give it a try and let me know if you run into any further issues.

Thank you!

devknoll avatar Aug 16 '22 16:08 devknoll