stencil-router icon indicating copy to clipboard operation
stencil-router copied to clipboard

Active route's `display` style set to `none` until all children are rendered

Open harrysolovay opened this issue 4 years ago • 0 comments

Stencil version: 1.12.1

I'm submitting a ... [x] bug report

Current behavior:

When switching to a new active route, that route has a display style set to none, until all children are rendered. Within the route-rendered components, this route style causes limitations. For instance, one cannot utilize scrollTo in componentDidLoad / componentDidRender.

I've attempted the following workaround, wherein I emit when the route has loaded via a router-level mutation observer that looks at its changes in style. Ran into another bug trying to do so.

Expected behavior:

To have the currently-active route set to display: initial, so that children can utilize DOM methods without worry.

Related code:

In any given router-rendered component, try the following:

@Element el: HTMLElement;

componentDidLoad() {
  this.el.scrollTo({top: 100});
}

harrysolovay avatar Apr 03 '20 19:04 harrysolovay