[Bug]: Datepicker not working in ShadowRoot

[Canabale]

Before submitting...

• I have searched for duplicate or closed issues.
• I have read the CONTRIBUTING document and my issue is following the guidelines.
• I have read the template completely before filling it in.

Context

Datepicker not working in shadowroot.

Current Behavior

When a datepicker is loaded in shadowroot, the queryselectors (including getElementById) will fail and cause errors.
Here is a codepen showing the issue:
https://codepen.io/Canabale/pen/OJoBRzQ

Expected behavior

Datepickers work exactly the same way, no matter whether you use them in a shadowroot or directly on the document.

Possible Solutions or Causes

There are definately multiple causes.
The biggest issues seem to be the following:

1. The element queries (querySelector, querySelectorAll, getElementById) are exectued on the document instead of the shadowRoot, which is why elements are not found, resulting in nullreference errors.
2. When elements are dynamically appended to the dom, they are also appended to the document instead of the shadowRoot.

Steps to reproduce

Here is a codepen showing the issue:
https://codepen.io/Canabale/pen/OJoBRzQ

Your Environment

• Version used: 1.2.2
• Browser Name and version: Edge, Chrome, Firefox (latest each)
• Operating System and version (desktop or mobile): windows
• Additional information you want to tell us: Materialize seems to be generally incompatible with shadowroot, which is a real shame....