Doesn't work with styled-components createGlobalStyle about css-vars-ponyfill HOT 3 CLOSED

I found which usage is causing the problem. It only occurs when you try to use css variables inside createGlobalStyle.

So like:

const GlobalStyles = createGlobalStyle`
  :root {
    --color-background: #000;
  }

  body {
    background-color: var(--color-background);
  }
`;

Defining variables in createGlobalStyle and using them in modules scss files works.

It only crashes when variables are used in createGlobalStyle.

from css-vars-ponyfill.

Hi @lprokein --

It sounds like the "source" <style> element generated by styled-components is inserted into the DOM but then removed before the ponyfill can use it to insert its own <style> element in the correct DOM location. It could be an easy fix, but without a demo to work with I can't say for sure.

Would you be able to create a basic demo that has the same issue so I can troubleshoot?

from css-vars-ponyfill.

@lprokein --

Closing due to inactivity. Happy to reopen if necessary. Thanks!

from css-vars-ponyfill.