Shadow DOM - Should we use it?

[SkyeHoefling]

I created a private fork of this project for some close source projects to see how the components will handle in the real world. I am very happy with how things are working but we need to have a discussion around the shadow dom.

In my scenario I tested my new autocomplete control (i haven't made a PR yet) located at

https://github.com/HoeflingSoftware/nvQuickComponents/tree/autocomplete

The problem

I had issues with being able to apply css styles to the Shadow DOM vs no Shadow DOM. The challenge was I found myself starting to maintain 2 sets of styles a shadow DOM version and a polyfill version. I decided in my private repo that it would be best to not support the shadow DOM.

Browsers I tested

• Edge
• Firefox
• Chrome

Edge and Firefox looked perfect since they both used polyfill where chrome was the outlier that had issues.

When I submit the PR for the autocomplete I will not be using the Shadow DOM for it (unless otherwise directed during code review). I want to start the conversation about what our standard will be for the component library. There should be consistency across the components so they can be used and styled in similar fashions in the various projects.

[david-poindexter]

@ahoefling I have still sadly not had time to test this, but will try to find some time this weekend. I am very curious about this.

[SkyeHoefling]

Now that I have had more time to test this in the field I have came up with more findings and recommendations.

• If the component is designed to be styled with CSS by the consumer it should be built without the shadow DOM. This supports the original argument of the thread
• If the component is built with styling properties built in it should be built with the shadow DOM. In this case the extensibility is built in so there should be no need to to style as a consumer
  • This idea may be difficult and I am still testing it in the field, but it looks promising.

[david-poindexter]

This is making sense to me (for now at least). :)

[SkyeHoefling]

I'm going to close out this issue since we have decided direction. We can always revisit this in the future