question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Don't overwrite old styles when updating nodes with inline styles.

See original GitHub issue

The current strategy for applying inline styles is to merge the old node styles with the new node styles, producing a new set of styles that has all the keys, iterate over them, apply the new styles and erase the old styles.

Old Styles

{
 color: red;
 fontSize: 14;
}

New Styles

{
 color: blue;
}

Result

{
 color: blue;
}

Should we change this behavior and instead produce the following result:

Proposed Result

{
 color: blue;
 fontSize: 14;
}

/cc @mindplay-dk @zaceno

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:6 (6 by maintainers)

github_iconTop GitHub Comments

2reactions
SkaterDadcommented, Jan 3, 2018

In your proposed output, the font size is still being set on the DOM node even though the property wasn’t present in the “new styles” object. At least that’s how I interpret your post. That seems strange, and I called it orphaned because the vdom didn’t want it there and presumably isn’t controlling it.

Am I reading this wrong?

0reactions
jorgebucarancommented, Jan 4, 2018

@SkaterDad Correct, but it’s not being set, it’s what was already in the element. Thanks for the feedback, I’m calling this one off! 💯

Read more comments on GitHub >

github_iconTop Results From Across the Web

javascript - Override inline styles with !important properties?
I want to remove styles from #cartDiv AND all child elements below it. Edit to add - Here is an exmaple of some...
Read more >
How to override inline styles with external in CSS
In this article, we are going to learn how we can override inline styles with external CSS. Generally, we use inline CSS to...
Read more >
Override Inline Styles with CSS
Often we think of inline styles as a way to override styles we set up in the CSS. 99% of the time, this...
Read more >
New inline CSS rules for nested blocks difficult to override
No, because that css is auto-generated, it is not included by styles files. 1
Read more >
Why you shouldn't use inline styling in production React apps
One of the main reasons that inline styling is not a good choice for your application is because it does not support (or...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found