material ui: find which component create this tag

Question

I would like to find which React.Component create this tag:

I use styled component:

import { styled } from '@mui/material/styles';

const Tabs = styled('div')(({theme})=>({
  display: 'flex',
  flexDirection: 'column',
}));

Answer 1

You can add a label property to your component to make it easier to find the element inside DOM-tree:

const Tabs = styled('div')(({theme})=>({
  label: 'test,
  display: 'flex',
  flexDirection: 'column',
}));

After that, the class of the element will get a suffix and it'll look like:

<div class="css-w35fh1-test">

This property comes from emotion.