Material-UI v5 Emotion error: You seem to be using a value for 'content' without quotes, try replacing it with `content: '""'`

user_2433865 0
Viewed 1928

I migrated from Material-UI v4 to v5. Now I receive this error wherever I try to render my Material-UI-based components:

You seem to be using a value for 'content' without quotes, try replacing it with `content: '""'`

It seems to be caused by Emotion, the new style library used by v5.

I found a Github issue for Emotion that discusses this error, but it hasn't helped me. I shouldn't have to be fiddling with how MUI uses Emotion, right? I'd expect that complexity to be hidden from me.

Any ideas on how to fix this?

Screenshot of error

material-ui
1 Answers

I needed to change:

  MuiInputBase: {
    root: {
      "&:after": {
        content: "", <--------
        display: "table",
        clear: "both",
      },
    },
  },

to

  MuiInputBase: {
    root: {
      "&:after": {
        content: '""', <----------
        display: "table",
        clear: "both",
      },
    },
  },
user_24338650
Related