Escaped url when setting a css variable with js

Question

im trying to set a css custom property with js. The name of the property should be "--path" and the value should be "url(test.png)".

My code looks like this:

window.document.body.style.setProperty("--path", "url(test.png)");

My problem is that now the value of --path is "url(test\.png)". How can i prevent the escaping of this dot?

Answer 1

Add quotes to the path:

window.document.body.style.setProperty("--path", "url('test.png')");