Invalid template for "AppPlatformSearchPopularItem" / <app-platform-search-popular-item> at path "app-platform-search-popular-item < div[id="starred"] < div[id="popular-links"][hide] < div[id="container"][data-page="search-tables"][data-initializing][data-deferring][data-status="loading"] < app-platform-search < x-switch[id="pages"][valid][value="app-platform-search"] < div[id="body"] < div[id="application"][data-show-menu][data-show-scratchpads][style="--app-scrollbar-height: 0px;"] < div[id="viewport"][selected="appPlatformSearch"] < app-view[show-new-scratchpad-button] < app-root < body < html[lang="en"]".
Caused by: Error: Found invalid template at line 52 within string `` at ``.
It’s better because:
The line number where the issue occurred in the template is printed. Worth its weight in gold.
The custom element name is printed with angle brackets in addition to the constructor name — this is incredibly helpful because you can easily search for like customElements.define usage with the provided string literal. We cannot really point to the actual file path, but this is pretty much as good.
The repetitive error chaining is no longer necessary (error causes get printed the way you want in the console now).
Current
Found invalid template string "" at "". — Invalid template for "AppPlatformSearchPopularItem" at path "app-platform-search-popular-item < div[id="starred"] < div[id="popular-links"][hide] < div[id="container"][data-page="search-tables"][data-initializing][data-deferring][data-status="loading"] < app-platform-search < x-switch[id="pages"][valid][value="app-platform-search"] < div[id="body"] < div[id="application"][data-show-menu][data-show-scratchpads][style="--app-scrollbar-height: 0px;"] < div[id="viewport"][selected="appPlatformSearch"] < app-view[show-new-scratchpad-button] < app-root < body < html[lang="en"]"
Caused by: Error: Found invalid template string "" at "".
Context
I was actually unable to quickly detect where the problem was in the template… so much so that I hacked in the proposed output which could tell me which line the issue occurred on. Of all the changes here, that’s incredibly helpful. In this case, it was caused by a weird attribute binding like this foo="${bar}${baz}" (hence the cryptic error with the empty strings).
Proposed
It’s better because:
customElements.defineusage with the provided string literal. We cannot really point to the actual file path, but this is pretty much as good.Current
Context
I was actually unable to quickly detect where the problem was in the template… so much so that I hacked in the proposed output which could tell me which line the issue occurred on. Of all the changes here, that’s incredibly helpful. In this case, it was caused by a weird attribute binding like this
foo="${bar}${baz}"(hence the cryptic error with the empty strings).