lit / lit-element

LEGACY REPO. This repository is for maintenance of the legacy LitElement library. The LitElement base class is now part of the Lit library, which is developed in the lit monorepo.
https://lit-element.polymer-project.org
BSD 3-Clause "New" or "Revised" License
4.49k stars 319 forks source link

error with lit-element version "^0.5.2" Uncaught TypeError: window.ShadyCSS.prepareTemplateDom is not a function #104

Closed ranjeet-choudhary closed 5 years ago

ranjeet-choudhary commented 6 years ago

Uncaught TypeError: window.ShadyCSS.prepareTemplateDom is not a function at result (shady-render.ts:54) at render (shady-render.ts:154) at HTMLElement._applyRender (lit-element.ts:286) at HTMLElement._propertiesChanged (lit-element.ts:218) at HTMLElement._flushProperties (properties-changed.js:370) at HTMLElement._flushProperties (lit-element.ts:232) at HTMLElement.ready (properties-changed.js:193) at HTMLElement.ready (lit-element.ts:119) at HTMLElement._enableProperties (properties-changed.js:347) at HTMLElement.connectedCallback (properties-mixin.js:226)

similar to https://github.com/Polymer/pwa-starter-kit/issues/157

mrherndon commented 6 years ago

I've been fighting this all morning, glad I'm not the only one.

mrherndon commented 6 years ago

It seems like the fixes for this were made in lit-html, in shady-render.js, according to the commit log (I don't know how to do cool links for these but here: https://github.com/Polymer/lit-html/commit/f9f82380753ce505fed0154916ff32bbcb0ae650). It doesn't seem to actually fix it though, at least, I'm still getting the same error on it.

edit: whatDaYaKnow, it makes the cool links for me. neato.

TimvdLippe commented 6 years ago

I think this is fixed on master, but we havent made a release for that yet. Could you try that out?

mrherndon commented 6 years ago

sure, still getting used to some of this npm stuff though. Would I have to git clone it into my project, as opposed to npm updating? Or git clone it somewhere and copy the changes over temporarily?

pshihn commented 6 years ago

@mrherndon You can just do

npm i Polymer/lit-element

This will load the current master

mrherndon commented 6 years ago

Thanks. Same error though.

shady-render.ts:54 Uncaught TypeError: window.ShadyCSS.prepareTemplateDom is not a function
    at result (shady-render.ts:54)
    at render (shady-render.ts:154)
    at HTMLElement._applyRender (lit-element.ts:286)
    at HTMLElement._propertiesChanged (lit-element.ts:218)
    at HTMLElement._flushProperties (properties-changed.js:370)
    at HTMLElement._flushProperties (lit-element.ts:232)
    at HTMLElement.ready (properties-changed.js:193)
    at HTMLElement.ready (lit-element.ts:119)
    at HTMLElement._enableProperties (properties-changed.js:347)
    at HTMLElement.connectedCallback (properties-mixin.js:226)
TimvdLippe commented 6 years ago

Could you verify you load version 2.0.2 of the webcomponents polyfill? And the latest version of lit-html as well?

On Fri, 15 Jun 2018, 21:48 mrherndon, notifications@github.com wrote:

Thanks. Same error though.

shady-render.ts:54 Uncaught TypeError: window.ShadyCSS.prepareTemplateDom is not a function at result (shady-render.ts:54) at render (shady-render.ts:154) at HTMLElement._applyRender (lit-element.ts:286) at HTMLElement._propertiesChanged (lit-element.ts:218) at HTMLElement._flushProperties (properties-changed.js:370) at HTMLElement._flushProperties (lit-element.ts:232) at HTMLElement.ready (properties-changed.js:193) at HTMLElement.ready (lit-element.ts:119) at HTMLElement._enableProperties (properties-changed.js:347) at HTMLElement.connectedCallback (properties-mixin.js:226)

— You are receiving this because you commented.

Reply to this email directly, view it on GitHub https://github.com/Polymer/lit-element/issues/104#issuecomment-397724570, or mute the thread https://github.com/notifications/unsubscribe-auth/AFrDb3kyi3P0sOiO_JOljfVrRPZ8Dia0ks5t9A-DgaJpZM4UpuTQ .

mrherndon commented 6 years ago

in my node_modules/@webcomponents/webcomponentsjs/package.json first line is "_from": "@webcomponents/webcomponentsjs@2.0.2", And in node_modules/lit-html/package.json, I have: "_from": "lit-html@0.10.2",

mrherndon commented 6 years ago

On a whim(cause I had a weird problem a few months back that reminded me of this), I deleted node_modules and re-ran npm install with --unsafe-perm and it works now. Not sure what the issue really was, but I'm glad to have fixed it. Thank you all for your help. @TimvdLippe , you're always quick to help when I need it, man!

TimvdLippe commented 6 years ago

Glad you could confirm the issue has been resolved! I will see if the team can publish a release (most of them are on vacation atm).

On Fri, 15 Jun 2018, 22:47 mrherndon, notifications@github.com wrote:

On a whim(cause I had a weird problem a few months back that reminded me of this), I deleted node_modules and re-ran npm install with --unsafe-perm and it works now. Not sure what the issue really was, but I'm glad to have fixed it. Thank you all for your help. @TimvdLippe https://github.com/TimvdLippe , you're always quick to help when I need it, man!

— You are receiving this because you were mentioned.

Reply to this email directly, view it on GitHub https://github.com/Polymer/lit-element/issues/104#issuecomment-397737629, or mute the thread https://github.com/notifications/unsubscribe-auth/AFrDbx0hWfpnxnhpeBDbq3LUgiD1rrkEks5t9B1EgaJpZM4UpuTQ .

ranjeet-choudhary commented 6 years ago

After npm i Polymer/lit-element I get below error on polymer serve Uncaught TypeError: Failed to resolve module specifier "@polymer/lit-element". Relative references must start with either "/", "./", or "../".

mrherndon commented 6 years ago

I ran into that when I was tinkering with it. I think both you and I updated in a weird in-between moment that left our node_modules folder somehow out of sync. Try copying your node_modules folder somewhere safe. Then delete the one in your project. Try 'npm install' and see if that fixes it.
If you're set up like I am, you may need to run it 'sudo npm install --unsafe-perm' to get it to install correctly.

Boyak commented 6 years ago

I run into this same problem, but any of solution above is not working. Also got problem with "Uncaught TypeError: Failed to resolve module specifier "@polymer/lit-element"." and stuck with that. One more condition from my side is that is not working only in Chrome in my case.

davie-robertson commented 6 years ago

I'm still facing this issue too.

FWIW I see that @polymer\lit-element\package.json contains "dependencies": { "@polymer/polymer": "^3.0.2", "lit-html": "^0.10.0" },

this is after I've tried deleting the node_modules, reinstalling them (even adding the --unsafe-perm.

Is there a simple fix that I'm missing?

EDIT: rm -rf node_modules/ package-lock.json followed by npm i sorted it out

petecarapetyan commented 6 years ago

I'm seeing the problem on one project, but note that my pwa-starter-kit by Meownica's team is working fine with the same lit dependencies that are failing on my mixed polymer/lit project. Guessing that it doesn't like me to be mixing lit and polymer elements on the same app, at least with these particular versions.

sorvell commented 5 years ago

Looks like these issues have been resolved by now. LitElement uses the correct ShadyCSS version, but this can conflict if you have an older version of the webcomponentsjs polyfill installed. If you're hitting this issue, please make sure to update the webcomponentsjs polyfill to at least version 2.0.3.

aaron-peloquin commented 5 years ago

I'm still getting this issue while trying to update my the /src/app-view-home.js file in my app. I am using webcomponentsjs v2.1.1

https://github.com/aaron-peloquin/tabletopdice-project