Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

<template> displayed in DOM #6

Closed
Archelyst opened this issue May 4, 2018 · 7 comments · Fixed by #7
Closed

<template> displayed in DOM #6

Archelyst opened this issue May 4, 2018 · 7 comments · Fixed by #7

Comments

@Archelyst
Copy link
Contributor

I'm submitting a bug report

  • Library Version:
    0.1.0

Please tell us about your environment:

  • Operating System:
    OSX 10.13.4

  • Node Version:
    8.9.4

  • NPM Version:
    5.8.0

  • Browser:
    Firefox 59

  • Language:
    TypeScript

Current behavior:
Thanks for the quick support with #4. Exposing the app itself as webcomponent seems like an obvious and useful thing to do. However, I'd like to take an element and use it as a webcomponent.

Starting from the project in #4 I added my-component to the global resources. Also I added a little bit of static content to the template of my-component so that the following is more obvious: the "empty" template is display in the final document.

The zipped project (as usual without node_modules) is here:
comptest.zip (I also added a poly fill because I'm using Firefox.)

That's how it looks like:

bildschirmfoto 2018-05-04 um 15 30 58

The first occurance of static content is the template, I guess.

@Archelyst
Copy link
Contributor Author

Just added another instance of <my-component> and with it got another "ghost" static content (making it four). So probably my assumption is wrong that it is the template that is visible here.

@Archelyst
Copy link
Contributor Author

And another observation: When using the web-component outside the app, it works as expected, no additional ghost.

@EisenbergEffect
Copy link
Contributor

Thanks for the sample! I'll look at this over the weekend hopefully.

@Archelyst
Copy link
Contributor Author

I've used Aurelia for a while but I'm not at all familiar with the internals of the framework. I'd really like to help here. Are there any docs about the internal design which could help me get my feet wet?

@EisenbergEffect
Copy link
Contributor

Obviously, I didn't get to this over the weekend ;( I've got a backup of several critical PRs to review, so this might take a bit longer. Unfortunately, I don't have any arch diagrams or notes to provide on the internal workings of this part of the system.

@Archelyst
Copy link
Contributor Author

This only happens if - like in our example app - the au-app element is used. If I use a different element (my-component) and omit au-app from index.ejs the extra bits don't get rendered.

@EisenbergEffect
Copy link
Contributor

I'm behind a bit, but wanted to let you know I haven't forgotten about this...

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants