Jest wouldn't setProperty of style

I'm testing injection of css variables in my react components. I have a test like this:

  it('observes --ion-border-color css variable', () => {
    const w = mount(
      <ThemeProvider >
        <WBordered >Hello</WBordered>
      </ThemeProvider>
    )
    const node = w.find(WBordered)
    node.getDOMNode().style.setProperty('color', 'cyan')
    node.getDOMNode().style.setProperty('--ion-color', 'black')
    logg(node.getDOMNode().style, 'zeStyle')
  })

logg basically delegates to console.log. This prints out:

+++ zeStyle: CSSStyleDeclaration {
      '0': 'color',
      _values: { color: 'cyan' },
      _importants: { color: undefined },
      _length: 1,
      _onChange: [Function (anonymous)]
    }

And my question is, shouldn't I be seeing --ion-color as a property of CSSStyleDeclaration? Basically setProperty works on setting normal css attributes but doesn't work for variables. Why is that?

The code works as expected outside tests: the styled component picks up the css var defined on :root.

In test, I also tried setting the variable on document:

document.documentElement.style.setProperty("--ion-border-color", "red")

This didn't work either.

Update: This works in dev server, but does not work in jest:

// tmp.module.scss
.tmp {
  --ion-border-color: cyan;
  border: 2px solid var(--ion-border-color);
}

// a component:
import * as styles from "./tmp.module.scss"
const A = () => <div className={styles.tmp} />

Currently trying to figure out what the jest config should be, for me it currently is:

"moduleNameMapper": {
      "^react-native$": "react-native-web",
      "^.+\\.module\\.(css|sass|scss)$": "jest-transform-css",
      "\\.(css|less|sass|scss)$": "jest-transform-css",
      "\\.(eot|gif|jpg|jpeg|png|svg|ttf)$": "<rootDir>/config/fileMock.js",
      "^\\$components(.*)\\.jsx$": "<rootDir>/src/components$1"
    },