astroturfcss / astroturf

Better Styling through Compiling: CSS-in-JS for those that want it all.
https://astroturfcss.github.io/astroturf/
MIT License
2.28k stars 60 forks source link

JSX style element wrongly interpreted (v1.0.0-beta.15) #655

Open mikestopcontinues opened 3 years ago

mikestopcontinues commented 3 years ago

I'm trying to write an inline style element component, but Astroturf is getting in the way. This fails:

function InlineStyle({value, ...props}) {
  return (
    <style {...props} dangerouslySetInnerHTML={{__html: value}} />
  );
}

With this error:

AstroturfLoaderError: /<PATH>/InlineStyle.js: Cannot read property 'name' of undefined
    at Array.some (<anonymous>)
    at Array.filter (<anonymous>)

But this works:

function InlineStyle({value, ...props}) {
  const El = 'style'; // secret sauce

  return (
    <El {...props} dangerouslySetInnerHTML={{__html: value}} />
  );
}

I'm running the most recent beta using the webpack loader via NextJS 10. I think Astroturf should be able to infer the context.