x-tag / core-2

X-Tag 2 - A tiny Web Components library that packs a big punch
MIT License
37 stars 8 forks source link

::template(true) not working with connectedCallback #9

Open progelio opened 6 years ago

progelio commented 6 years ago
    xtag.create('x-test', class extends XTagElement {
        connectedCallback() { } //if I remove this, then it renders.
        name() { return "My Test Tag" }
        "::template(true)" () {
            return `<h2>I am ${this.name()}</h2>`
        }
    })
ghost commented 6 years ago

@csuwildcat I just plugged this into jasmine and it's working as described by @progelio

progelio commented 6 years ago

I don't know what jasmine is. I will find out. Try this:

<!DOCTYPE html>

ghost commented 6 years ago

If you have codepen I could provide a link to it with the test

progelio commented 6 years ago

Ok, just made a codepen account. Here it is:

https://codepen.io/progelio/pen/VxMgme

csuwildcat commented 6 years ago

The template extension is a class mixin that uses the connectedCallback, so I'm guessing if you call super() in the custom element's connectedCallback declaration, it will work as intended.

On Sun, May 6, 2018, 9:25 AM progelio notifications@github.com wrote:

Ok, just made a codepen account. Here it is:

https://codepen.io/progelio/pen/VxMgme

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/x-tag/core-2/issues/9#issuecomment-386891297, or mute the thread https://github.com/notifications/unsubscribe-auth/AAICyqvmitvLoqWRRaOALTMkrFuHvWIkks5tvyPygaJpZM4T0FvX .

ghost commented 6 years ago

Got the error below.

SyntaxError: super() is only valid in derived class constructors.

progelio commented 6 years ago

this.render() works instead of super(). But, I think the presence of "connectedCallback" shouldn't interfere with "::template(true)"

ghost commented 6 years ago

image here is a image tof he jasmine stack trace, would you like a pr with the Jasmine @csuwildcat ?

ghost commented 6 years ago

thanks @progelio.

progelio commented 6 years ago

Not a problem. This is actually a great project. Awesome work.

ghost commented 6 years ago

Jasmine Spec list image:
image

ghost commented 6 years ago

@csuwildcat could this.render() be kickstarting the behavior by initiating the promise?

ghost commented 6 years ago

https://codepen.io/kipomaha/pen/XqeGNd

here is a link to a codepen I created with a codepen jasmine template @progelio

ghost commented 6 years ago

for some reason its not passing the specs like in the jasmine image above

ghost commented 6 years ago

If you go to settings on the codepen you can see the dependencies by clicking the javascript tab when the settings screen pops up

ghost commented 6 years ago

okay @progelio @csuwildcat I got the pen working here => https://codepen.io/kipomaha/pen/XqeGNd [at the same pen url]

ghost commented 6 years ago

you can fork if you want their is a total of three errors

csuwildcat commented 6 years ago

I modded the original pen that had the error with the super call and it works: https://codepen.io/csuwldcat/pen/QrJrRg

csuwildcat commented 6 years ago

If you override a function, you must call super.FN_NAME(), so that the previous version of the function in the prototype chain is also called.

ghost commented 6 years ago

Nice did you want that to be put on the jasmine for the docs?

ghost commented 6 years ago

lol...I just looked in to super more I forgot you can use it like that duh...super.funct()....probably good that I don't use it much. Thanks for the information

csuwildcat commented 6 years ago

Yeah, we should probably document that functions that are extended require this.

On a more general point: I want to get more of your contributions in, I just been trying to find a way of taking some as smaller pulls that I can digest easier. This is more about all the outstanding ones, not this exact issue.

On Thu, May 17, 2018, 6:11 PM KIP notifications@github.com wrote:

lol...I just looked in to super more I forgot you can use it like that duh...super.funct()....probably good that I don't use it much. Thanks for the information

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/x-tag/core-2/issues/9#issuecomment-390063328, or mute the thread https://github.com/notifications/unsubscribe-auth/AAICyjJNS93hsZ7-Yx7DqmybY6nTHttyks5tzh_bgaJpZM4T0FvX .

ghost commented 6 years ago

It's not a big deal, I stopped making PR's, because I figured you'd get to it when you got to it. 👍