Is there a method to force the script to re-calculate?

Question

Is there a method to force the script to re-calculate?

FrDH opened this issue 4 years ago · 4 comments

Hi,
In my case, I add a classname to the body with javascript that changes the value of a css variable, but the polyfill does not pick up on this change.

For example, the text should turn red after adding the classname "red" to the <body> with javascript:

:root {
   --color: blue;
}
.red {
   --color: red;
}

body {
   color: var(--color);
}

document.body.classList.add("red");

I can imagine it is impossible for the polyfill to automatically pick up this change (except for maybe adding an MutationObserver for the classList on each and every DOM element...), so therefor a method to force the script to re-run would come in handy. Something like:

document.body.classList.add("red");
ie11CustomProperties.reRun();

Answer 1 · 2020-07-01T08:54:14.000Z

Hi,
A test-case would be great, actually all mutations are monitored with a MutationObserver.

Answer 2 · 2020-07-01T08:59:13.000Z

I do not have an API for this, but the following forces a redraw for "body":

document.body.classList.add("red");
document.body.setProperty('--x','');

Answer 3 · 2020-07-01T11:14:24.000Z

thanks, will try that.

Answer 4 · 2020-07-06T07:00:03.000Z

did it work?