search

vuejs / Discussion

Vue.js discussion
167 stars 17 forks source link

Who is adding shadow-dom elements to my dom? #482

Open mark-hahn opened 8 years ago

mark-hahn commented 8 years ago

When I put this in as the template ...

<select class="pop-du" v-model="duPop" options="duArr"></select>

I get this in the DOM ...

screenshot 2016-01-20 at 7 04 11 pm

Does anyone have any idea what is adding the shadow dom elements? I doubt it is vue. I also get them on text inputs. I'm guessing it is on any form input. This is really breaking my code because as you can see the options aren't working.

I'm on Vue 0.12.16 and Ubuntu 14.04. I have tried it with all chrome extensions off. I can't find anything googling.

FDiskas commented 8 years ago

As you can see in the screenshot (user-agent) this is your browser added that. ex:

<input type="date" />

In chrome browser you will see nice date picker. And then check that input shadow dom :) You can disable in dev tools settings.

yordis commented 7 years ago

This is the beauty of Web components 😄

@mark-hahn most of the "native" inputs and the newest elements in Chrome are made using the web components technology (In this case at least Custom Element and Shadow DOM)