Hacker News Reader

Comment by chrisacky | Hacker News Reader

Why on earth can CSS load JS. Is this an oversight or does --javascript actually exist for this exact purpose. I cannot find any details on this in any spec or rfc etc.

View on HN

Reading TFA:

> One of the recent additions to the CSS language was a feature that would allow it to load and run JavaScript code from within a CSS rule.

What in the actual fuck?!?

Then, looking at the actual code:

  <script type="text/javascript" xml="space">// <![CDATA[
  new Function(getComputedStyle(document.documentElement)?.getPropertyValue('--script'))();
  ...

Okay, just accessing some random CSS variable from a script tag.

I wish tech journalists could ask someone with technical knowledge to double check before parroting hyped BS like this.

Someone with technical knowledge is not going to talk to a journalist. Ugh, now I have to wash my hands after typing that word.

Which word, knowledge?

I wouldn’t put Catalin Cimpanu in that category. I find his articles to generally be technically-accurate and thorough. Everyone makes mistakes, though, and he’s certainly gotten a lot more popular following his transition to ZDNet. (Perhaps the link was changed? The current article seems to explain the issue accurately and completely; I doubt that was a simple edit.)

The article author replied to a comment below by saying that they corrected ("fixed") the article.

Glad to hear it was fixed, although it's unfortunate that such an error was published. Mistakes do happen, I suppose. His articles are usually pretty thorough.

Catalin Cimpanu is one of the better journalists, and is usually quite good when it comes to technical accuracy.

If the article ever had the quote you included, it appears to have been removed and replaced with a fairly thorough explanation of what’s actually happening. (Perhaps the link has been changed?)

Just to be clear, this would’ve worked decades ago. There’s no inherent need to use CSS3 variables for this. It could’ve just as easily been hidden in a normal property.

The quote is present in the first Internet Archive snapshot of the article: https://web.archive.org/web/20201209131227/https://www.zdnet...

That’s a shame. I’m glad it was fixed, though.

I remember when media, even websites, would issue corrections eg "An earlier version of this article incorrectly claimed that a new feature of CSS allows javascript execution. The article has been updated with correct information. ZDNet regrets the error"

Indeed. That would’ve been nice. It may even be there, but there was so much other junk on the page that I could barely tell what was the article and what was an ad on a mobile device.

He’s really not.

https://www.zdnet.com/article/unsecured-mongodb-databases-ex...

You’d think that basic critical thinking would keep anyone from putting their name on this story.

It looks like `--script` is just an arbitrary string, it is only executed because a real `<script>` tag retrieves the property and evals it through `(new Function())()? https://twitter.com/sansecio/status/1336614850047381506/phot...

Why there's "new Function()" that looks for CSS computed styles with "--script"? Is this some pattern with a popular JS framework?

New Function() is just another name for eval(). It has nothing specificly to do with css.

Okay but what is the purpose of this code? why would you eval() CSS?

The purpose of the code is to steal credit cards.

> why would you eval() CSS?

It’s really as simple as “because you can”. This is just an obfuscation technique.

From my understanding, the code that the devs wrote is not to steal credit cards but to create some UI, however they do it in such a way that JS hidden in CSS that would normally won't run. gets run and which results in credit cards being stolen.

You can see the code in the tweet linked earlier. The hackers injected a small JS snippet on the page that fetches the value of —script from the CSS and evals it.b

Why would they fetch --script from CSS instead of getting the information from the DOM and sending it to their serves straight away if the can already put a JS on the page that gets executed?

This is an obfuscation technique, it’s not supposed to make sense.

Oh O.K, so it's not a CSS hack. I thought it's something smarter like exploiting a JS pattern to trick it to run JS from CSS.

So, the hackers need to have access both to CSS and HTML to put the malicious JS that looks innocent in the HTML and load the malicious JS from the CSS.

Now it makes sense, thanks.

Which honestly seems like a pretty bad obfuscation technique. Loading a string from a css file and then executing as js is suspicious af. There is literally no reason to ever do that normally.

Of course, detecting this in general is not easy to do.

Quick correction: it is not the same as eval. It does not have access to the current scope. It is technically a fair bit safer when trying to run code from a string.

It may have access to the window object, however, so if something important is there, if can probably mess with that.

Its pretty hard to imagine a situation where full access to the global scope (including DOM) is fine as long as the attacker doesn't have access to the current function's scope. Performance difference, sure, but safety difference is pretty far fetched.

Because the skimmer developer wanted to obfuscate their code a little?

As I understand it: --script is just the name of the variable. JS has the ability to look up variables from CSS. --script could have been --helloworld, think of it as a selector (if you're more familiar with CSS than JS), which is then grabbed and evaled by the JS code.

> Is this some pattern with a popular JS framework?

I've never seen this anywhere before, JS grabbing values from CSS, but I mostly done ClojureScript development for the last 2 years.

It doesn't look for `--script`. The hackers just retrieve the value of the `--script` value in JS and pass it to `new Function()`.

Things beginning with -- are generally just variables in css that can be retrieved later.

Older browsers used to have lots of ways to execute js from css (e.g. expression()) but all the browser vendors realized that that was terrible and are careful not to allow it. Most modern pure css attacks (in general, not what this article is about) involve loading different background images based on page content to exfiltrate secrets.

css custom property. doesn’t run anything, but it holds a string verbatim, that js code can read

Reply on news.ycombinator.com