Element.createShadowRoot is deprecated and will be removed in M73, around March 2019. Please use Element.attachShadow instead

Question

popup.js:6 [Deprecation] Element.createShadowRoot is deprecated and will be removed in M73, around March 2019. Please use Element.attachShadow instead. See https://www.chromestatus.com/features/4507242028072960 for more details.

When i am using reactJs in my project and send something to my state. i got this warning. I searched a lot but couldn't find anything. Can someone explain what this warning is about? and how to fix it.

Answer 1

• TL;DR: It could be the google dictionary extension.

In answer to your first question 'can someone explain this error is for what?' - The warning is pretty much self explanatory, and more information can be found following the link.

And in terms of getting rid of it - it may or may not be in your control. If the warning is being triggered from the file that you have control over, then you will probably have to fix it (again, the warning that gets logged should help). But this may be getting triggered by the file that you don't have control over (E.g., browser extension or some library / framework). Here's how you can check that...

I have been seeing the same warning for quite a while now (about a month or two). In my case, it turned out to be an issue with one of the chrome extensions (google dictionary).

Here's how I figured that out...

1. check the source of the error, it was content.min.js file (highlighted below) for me. If that is not one of your files, than there may not be much that you can do.
2. Click on the source (I.e., name of the file next to this warning), and DevTools will open this file under the 'Sources' tab and it will also highlight the bit of code that generates this warning.
3. now, check the source of the file by hovering mouse over the file name or you can right click on the file and select copy link address. In my case, this was originating from the google dictionary extension.
4. Looking at the file's address, I figured it is originating from the extension with id mgijmajocgfcbeboacabfgobmjgjcoja. Then I entered the URL

chrome://extensions?id=mgijmajocgfcbeboacabfgobmjgjcoja

in chrome and it showed me google dictionary extension.

It may not necessarily be the extension, it could be one of your files or some library / framework files.

Hope this helps!

Answer 2

it happen for me to adding adblock extension.. so if you have then remove it. and reload the page see ..

Answer 3

If it is actually the google dictionary or another chrome extension triggering this, you can work around it by setting the extensions' site access to 'On click', so you don't have to deactivate or remove it. Though then you have to click the extensions every time you want to use it.

You could also set it to be allowed on certain sites only, not very useful.

I'd love to have it the other way 'round, setting sites where I don't want to use it, like the development sites I am working on.

But then again, it is only cosmetics, well, as long as you do not produce or have to work on code that uses such deprecated elements )))