Material-design-icons: Website Broken when LastPass extension installed

[miguel-orange]

When using Google Chrome Version 61.0.3163.14 (Official Build) dev (64-bit) your searchable icon website will say label names but not render icons. In IE it's fine, as well as icons on my site.

[steventango]

Can't reproduce bug on https://material.io/icons/ with Chrome 60.0.3112.78

[matthaywardwebdesign]

I'm also seeing a similar issue where the site won't load on Chrome due to Polymer being undefined and a number of assertions failing. Chrome Version 59.0.3071.115 (Official Build) (64-bit)

[shyndman]

@miguel-orange, we pushed a new version to correct the issue.

@matthaywardwebdesign, mind doing a cache bypass refresh (cmd/ctrl+shift+r)? Does it still happen then?

[matthaywardwebdesign]

@shyndman Have cleared the cache, issue still occurring.

[shyndman]

Does this URL work? https://20170801t144119-dot-material-io.appspot.com/icons/

[miguel-orange]

@shyndman,
I cleared the cache and today I'm seeing a lot of console errors from webcomponents.js. From both https://material.io/icons/ and https://20170801t144119-dot-material-io.appspot.com/icons/

Similar behavior on Version 61.0.3163.25 (Official Build) dev (64-bit) and Version 61.0.3163.26 (Official Build) dev (64-bit)

webcomponents.js?v13:4855 Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.
    at addCssToDocument (webcomponents.js?v13:4855)
    at webcomponents.js?v13:4877
    at webcomponents.js?v13:4931

[matthaywardwebdesign]

Same issue as well. No change.

[shyndman]

@matthaywardwebdesign, does the same problem occur in other browsers? In Chrome, can you verify that third-party.html?v13 and third-party.js are being fetched successfully? (The .js file contains Polymer).

BTW, thanks for your help diagnosing. This is a bit of a mystery.

[dlevis]

Same issue here too with Chrome. When I go to https://material.io/icons/ I see a blank page.

It works fine in Firefox, IE 11 and Edge. In Chrome's Network tab I can see that third-party.html?v13 and third-party.js are fetched successfully.

But I see a bunch of errors in the console:

webcomponents.js?v13:217 [Deprecation] 'webkitURL' is deprecated. Please use 'URL' instead.
getDescriptor @ webcomponents.js?v13:217
installProperty @ webcomponents.js?v13:236
registerInstanceProperties @ webcomponents.js?v13:182
registerInternal @ webcomponents.js?v13:272
register @ webcomponents.js?v13:263
(anonymous) @ webcomponents.js?v13:4368
(anonymous) @ webcomponents.js?v13:4370
webcomponents.js?v13:4855 Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.
    at addCssToDocument (webcomponents.js?v13:4855)
    at webcomponents.js?v13:4877
    at webcomponents.js?v13:4931
addCssToDocument @ webcomponents.js?v13:4855
(anonymous) @ webcomponents.js?v13:4877
(anonymous) @ webcomponents.js?v13:4931
webcomponents.js?v13:116 Uncaught Error: Assertion failed
    at assert (https://material.io/icons/webcomponents/bower_components/webcomponentsjs/webcomponents.js?v13:116:21)
    at assertIsNodeWrapper (https://material.io/icons/webcomponents/bower_components/webcomponentsjs/webcomponents.js?v13:1609:7)
    at GeneratedWrapper.insertBefore (https://material.io/icons/webcomponents/bower_components/webcomponentsjs/webcomponents.js?v13:1823:9)
    at GeneratedWrapper.appendChild (https://material.io/icons/webcomponents/bower_components/webcomponentsjs/webcomponents.js?v13:1820:21)
    at HTMLHeadElement.constructor.(anonymous function) [as appendChild] (https://material.io/icons/webcomponents/bower_components/webcomponentsjs/webcomponents.js?v13:353:28)
    at https://material.io/icons/webcomponents/third-party.js:10:332
    at https://material.io/icons/webcomponents/third-party.js:10:2672
assert @ webcomponents.js?v13:116
assertIsNodeWrapper @ webcomponents.js?v13:1609
insertBefore @ webcomponents.js?v13:1823
appendChild @ webcomponents.js?v13:1820
constructor.(anonymous function) @ webcomponents.js?v13:353
(anonymous) @ third-party.js:10
(anonymous) @ third-party.js:10
first-party.js:1 Uncaught ReferenceError: Polymer is not defined
    at first-party.js:1
(anonymous) @ first-party.js:1
deps-1.7.html:5600 Uncaught TypeError: Polymer17.DomModule.import is not a function
    at Object.cssBuildTypeForModule (deps-1.7.html:5600)
    at HTMLStyleElement._prepStyles (deps-1.7.html:6174)
    at HTMLStyleElement._registerFeatures (deps-1.7.html:6945)
    at HTMLStyleElement.registerCallback (deps-1.7.html:195)
    at desugar (deps-1.7.html:79)
    at window.Polymer17 (deps-1.7.html:63)
    at deps-1.7.html:6998
    at deps-1.7.html:7100
cssBuildTypeForModule @ deps-1.7.html:5600
_prepStyles @ deps-1.7.html:6174
_registerFeatures @ deps-1.7.html:6945
registerCallback @ deps-1.7.html:195
desugar @ deps-1.7.html:79
window.Polymer17 @ deps-1.7.html:63
(anonymous) @ deps-1.7.html:6998
(anonymous) @ deps-1.7.html:7100
deps-1.7.html:5600 Uncaught TypeError: Polymer17.DomModule.import is not a function
    at Object.cssBuildTypeForModule (deps-1.7.html:5600)
    at HTMLElement._prepStyles (deps-1.7.html:6174)
    at HTMLElement._registerFeatures (deps-1.7.html:6945)
    at HTMLElement.registerCallback (deps-1.7.html:195)
    at desugar (deps-1.7.html:79)
    at window.Polymer17 (deps-1.7.html:63)
    at material-io-nav-1.7.html:5
cssBuildTypeForModule @ deps-1.7.html:5600
_prepStyles @ deps-1.7.html:6174
_registerFeatures @ deps-1.7.html:6945
registerCallback @ deps-1.7.html:195
desugar @ deps-1.7.html:79
window.Polymer17 @ deps-1.7.html:63
(anonymous) @ material-io-nav-1.7.html:5
deps-1.7.html:5600 Uncaught TypeError: Polymer17.DomModule.import is not a function
    at Object.cssBuildTypeForModule (deps-1.7.html:5600)
    at HTMLElement._prepStyles (deps-1.7.html:6174)
    at HTMLElement._registerFeatures (deps-1.7.html:6945)
    at HTMLElement.registerCallback (deps-1.7.html:195)
    at desugar (deps-1.7.html:79)
    at window.Polymer17 (deps-1.7.html:63)
    at material-io-nav-1.7.html:502
cssBuildTypeForModule @ deps-1.7.html:5600
_prepStyles @ deps-1.7.html:6174
_registerFeatures @ deps-1.7.html:6945
registerCallback @ deps-1.7.html:195
desugar @ deps-1.7.html:79
window.Polymer17 @ deps-1.7.html:63
(anonymous) @ material-io-nav-1.7.html:502
webcomponents.js?v13:116 Uncaught Error: Assertion failed
    at assert (webcomponents.js?v13:116)
    at assertIsNodeWrapper (webcomponents.js?v13:1609)
    at GeneratedWrapper.insertBefore (webcomponents.js?v13:1823)
    at (index):51
    at (index):52
assert @ webcomponents.js?v13:116
assertIsNodeWrapper @ webcomponents.js?v13:1609
insertBefore @ webcomponents.js?v13:1823
(anonymous) @ (index):51
(anonymous) @ (index):52

[kyle-mccarthy]

Same error as @dlevis on Version 60.0.3112.78 (Official Build) (64-bit). Others at my work have the same issue, one is on build Version 59.0.3071.115 (Official Build) (64-bit), third-party.html?v13 and third-party.js are being fetched successfully.

[shyndman]

I'm now testing on a Windows box, and I'm still not able to repro.

Does the same problem occur incognito? (ie. no extensions)

[kyle-mccarthy]

@shyndman For what it is worth I am on macOS Sierra 10.12.5. I went ahead an checked it out in incognito and the problem didn't occur. So I went through and started disabling extensions to try and debug it. For whatever reason, it seems that the LastPass Extension causes the errors. It hasn't happened for me before, so I am not sure what changed.

[shyndman]

We did release an update that forces the use of a Shadow DOM polyfill, even if the browser natively supports the APIs. It's a temporary workaround for the removal of the /deep/ selector in Chrome, which we'll need to support on the site for awhile longer.

[matthaywardwebdesign]

Interestingly I also have LastPass installed. Haven't tested without it yet
(not at the computer) but sounds like that could be the cause. As others
have said working in other browsers.

On Thu, Aug 3, 2017, 8:23 AM Kyle McCarthy [e-mail] wrote:

@shyndman https://github.com/shyndman For what it is worth I am on
macOS Sierra 10.12.5. I went ahead an checked it out in incognito and the
problem didn't occur. So I went through and started disabling plugins to
try and debug it. For whatever reason, it seems that the LastPass
Extension
https://chrome.google.com/webstore/detail/lastpass-free-password-ma/hdokiejnpimakedhajhdlcegeplioahd?hl=en-US
causes the errors. It hasn't happened for me before, so I am not sure what
changed.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/google/material-design-icons/issues/658#issuecomment-319815444,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AF3v3AR-91NG3f54VMef0IdmfxAxbqdJks5sUPbrgaJpZM4Ooryl
.

[shyndman]

Awesome. If we can get confirmation I'll let LastPass know. What we're doing is pretty unusual, but an extension shouldn't ever break the page.

[miguel-orange]

I also have LastPass installed, and incognito works swimmingly. I haven't seen this be an issue with other pages.

[shyndman]

I'll take that as confirmation. I've filed a bug with LastPass. Thanks everyone.

[shyndman]

I spent some time looking at this and I have a fix. I'll clean it up and we'll push it live Monday.

Thanks for your help everyone.

[shyndman]

Fix is live. :shipit:

[TrebuhD]

@shyndman , do you happen to remember what the fix was? I'm having the same problem with my site, and I can't see any commits containing this aforementioned fix from August 6-8 in this repository.