When is it acceptable to asign CSS styles using JS?

Developers: Plugin & API
1

I am designing a plugin that modifies the text cursor icon (among other things). However, I received the following automated response when submitting to the plugins library:

“You should avoid assigning styles via JavaScript or in HTML and instead move all these styles into CSS so that they are more easily adaptable by themes and snippets.”

There are two main instances of assigning styles via JS in my code.

  1. Dynamically updating cursor icon position and other properties: Each frame I use js to dynamically update properties of my cursor icon CSS class; for example, its position.
  2. Assigning values from user settings: In the plugin settings, users can assign various properties; for example, the colour of the cursor icon. This works by calling a JS function on setting change that updates the CSS property colour value.

Both of these feel like unavoidable uses of JS to update properties, but I might be missing something. For example, maybe there is a way to update CSS properties ‘directly’ in response to user settings? I am new to plugin development so any feedback would be great!

1 Like
2

I think that rule is a safe guard against people using styles directly when they could be defining classes. I think if it makes sense to use style directly, then it’s acceptable? But it might slow down your plugin approval process because the bot will complain.

3

Ah okay, that makes sense! I spent a while worrying about how I could change it, but in the end I was able to get past the bot review process and the human reviewers haven’t left any comments regarding it. Thanks for the help!

1 Like
4

I think if you instead of el.style.property = value use the following alternative, the bot won’t complain