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

Created on 15 Jun 2018  Â·  17Comments  Â·  Source: Polymer/lit-element

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

Most helpful comment

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

All 17 comments

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

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.

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

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?

@mrherndon You can just do

npm i Polymer/lit-element

This will load the current master

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)

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
.

in my node_modules/@webcomponents/webcomponentsjs/package.json first line is
"_from": "@webcomponents/[email protected]",
And in node_modules/lit-html/package.json, I have:
"_from": "[email protected]",

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!

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
.

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 "../".

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.

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.

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

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.

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.

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

Was this page helpful?
0 / 5 - 0 ratings

Related issues

zzzgit picture zzzgit  Â·  4Comments

chwzr picture chwzr  Â·  3Comments

kurukururuu picture kurukururuu  Â·  3Comments

Tanbouz picture Tanbouz  Â·  5Comments

aadamsx picture aadamsx  Â·  3Comments