search

Redbility / paper-carousel

Web component to build a responsive carousel
MIT License
44 stars 23 forks source link

Unable to make it work: Cannot read property 'children' of null and Cannot read property 'style' of null #25

Closed garcianavalon closed 7 years ago

garcianavalon commented 7 years ago

Hi there,

I followed the instructions in the webcomponents page

  1. installed with bower
  2. imported the element in my page 
    <link rel="import" href="../bower_components/paper-carousel/paper-carousel.html">
  3. Added a demo carousel 
    <paper-carousel items="1">
<div class="paper-carousel-demo-indigo" data-text="#1"></div>
</paper-carousel>

Nothing appears on the page and I get two errors in the console

Uncaught TypeError: Cannot read property 'children' of null
    at HTMLElement.getTotalItems (paper-carousel.html:13)
    at HTMLElement._setContainerSize (paper-carousel.html:13)
    at HTMLElement._onResize (paper-carousel.html:13)
    at HTMLElement.handler (polymer.html:561)
    at HTMLElement.fire (polymer.html:1327)
    at HTMLElement._fireResize (iron-resizable-behavior.html:151)
    at HTMLElement.notifyResize (iron-resizable-behavior.html:101)
    at HTMLElement._notifyDescendant (iron-resizable-behavior.html:190)
    at HTMLElement._onIronRequestResizeNotifications (iron-resizable-behavior.html:170)
    at HTMLElement.handler (polymer.html:561)

Followed by

Uncaught TypeError: Cannot read property 'style' of null
    at HTMLElement._onDrag (paper-carousel.html:13)
    at HTMLElement.attached (paper-carousel.html:13)
    at HTMLElement._invokeBehavior (polymer-micro.html:455)
    at HTMLElement._doBehavior (polymer-micro.html:445)
    at polymer-micro.html:227
    at Object.whenReady (polymer-micro.html:107)
    at HTMLElement.attachedCallback (polymer-micro.html:225)
    at HTMLElement.attachedCallback (polymer-mini.html:104)
    at HTMLElement._readySelf (polymer-mini.html:92)
    at HTMLElement._ready (polymer-mini.html:75)

Any idea of whats going on? Thanks!

oscarsolas commented 7 years ago

Hi @garcianavalon,

The component does not support native shadow-dom, only shady-dom. This issue has already been discussed in #11.

Thanks.

garcianavalon commented 7 years ago

Hi @oscarsolas,

I changed Polymer conf to use shady dom and worked perfectly, thanks!

It would be great if you added this to the README instructions as the error is quite "shady" too :)

Thanks,