Wait for dom ready without useShadowDom

Question

I want to wait until my component is fully loaded. The current approach would be to implement the ShadowRootAware interface. However this does not work, if the component disables the use of shadow dom:

@Component(
    selector: 'travel-step',
    templateUrl: 'packages/TravelPlanner/travelstep/travel_step_component.html',
    useShadowDom: false,
    publishAs: 'cmp')
class TravelStepComponent extends AttachAware{

I need to disable the usage of ShadowDom, because I want to use styles from my parent object (e.g. Bootstrap). Is there another way to wait for the dom to be ready?

I want to reference a file upload input. At the moment (angular v.012) there seems to be no other way to upload a file.

Answer 1

You can implement ShadowRootAware interface. For example:

class NgFreeTree implements ShadowRootAware { 
  void onShadowRoot(ShadowRoot shadowRoot) { ... }
}

It should work regardless of useShadowDom attribute.

Answer 2

It does not give you the error message if you use the following signature:

void onShadowRoot(Node n) {
    HtmlElement element = n;
    ...
}