search

lit / lit

Lit is a simple library for building fast, lightweight web components.
https://lit.dev
BSD 3-Clause "New" or "Revised" License
18.5k stars 914 forks source link

copy of shop-product element gives error when trying to print button below show-item #512

Closed mfons closed 5 years ago

mfons commented 5 years ago

Sorta like this problem

In a derivation from pwa-starter-kit, I am getting the following error from trying to open the bean-counter nutrients of interest page :

VM4530 async.js:44 Uncaught TypeError: Cannot read property 'value' of null at new Template (VM4510 lit-html.js:292) at TemplateInstance.result [as _getTemplate] (VM4489 shady-render.js:43) at NodePart._setTemplateResult (VM4510 lit-html.js:545) at NodePart.setValue (VM4510 lit-html.js:498) at NodePart._setIterable (VM4510 lit-html.js:603) at NodePart.setValue (VM4510 lit-html.js:500) at TemplateInstance.update (VM4510 lit-html.js:662) at render (VM4489 shady-render.js:126) at HTMLElement._applyRender (VM4470 lit-element.js:230) at HTMLElement._propertiesChanged (VM4470 lit-element.js:168)

Now I saw in the pwa-starter-kit README.md that in node 10 I might get some issue like this, but I am using version 9.5...so?

mfons commented 5 years ago

Now I basically I am trying to initially create a clone of the "shop" page (page 3, my-view3.js) called bc-nutrientsofinterest.js. Where my-view3.js calls shop-products I call nutrientsofinterest-nutrients. Where these elements call shop-item, I call nutrientsofinterest-item.

All this works fine but when I try to put the

aadamsx commented 5 years ago

Always helps to put out a CodePen or jsbin.

mfons commented 5 years ago

apologies...github source is not good enough I guess. I was hoping since my code is such a minor variation on pwa-starter-kit that it might be considered a minimal example

justinfagnani commented 5 years ago

A runnable reproduction is just usually easier to debug.

mfons commented 5 years ago

Sorry: how about my site itself the error occurs when the page renders. I have turned off minification and bundling.

This page is simply trying to clone my-view3.js only with different names.

mfons commented 5 years ago

The error occurs in nutrientsofinterest-nutrients.js in _render() when I try to add in the button using the same js values that just worked. If you remove the <button> element it works...

(If this example is not good enough, I will work on getting a code pen for you...never done that...so it will be a good learning experience for me.)

justinfagnani commented 5 years ago

It looks like you have an old version of lit-html, and this has been fixed.

mfons commented 5 years ago

hm...I changed package.json to ^0.6.1 for lit-element, ran npm i, and on local and in deployed firebase hosted version the issue seems to persist.

mfons commented 5 years ago

stopped the local firebase server, ran npm update in my apps root directory, restarted local firebase server and still I get this error...is this something I am doing?

mfons commented 5 years ago

how do I tell if anybody is looking at my problem or not?

CaptainCodeman commented 5 years ago

You'll have more chance of someone looking if you create a clear cut-down example of the issue as suggested in the first reply. Right now you're effectively just asking people to debug your project for you. The shop codebase shows a working example and you're the person most familiar with what has been changed from that.

mfons commented 5 years ago

ok, fair enough! I will do that. Thank you @CaptainCodeman

mfons commented 5 years ago

well I figured out I had commented out some markup in render() which gives lit-element heartburn. I also upgraded the pwa-starter-kit that I had by hand-upgrading my code to work with lit-element 6.1 once I upgraded it. Not sure I had to upgrade it to get it to work though... Also used the chrome dev-tools debugger on lit-element and saw where in the code it was having problems.