Search code examples
polymerpolymer-1.0

Debounce job name - job name issue


Using Polymer 1.0...

The debounce method expects the job name to be some kind of object. I get Cannot read property 'foo' of undefined.

From documentation, the job name is a string. I thought the job name was just to reference the debounce object later, but I guess I am wrong.

What am I doing wrong here? Note, this is outside a custom element so that is why I am using Polymer.Base

function scrollSnap() {
  Polymer.Base.debounce('foo', ()=> {
    if (app.selected === 'portfolio') {
      if (panel.scroller.scrollTop > 75 && panel.scroller.scrollTop < 200) {
        panel.scroller.scrollTop = 400;
      } else if  (panel.scroller.scrollTop > 350 && panel.scroller.scrollTop < 400) {
        panel.scroller.scrollTop = 0;
      }
    }
  }, 1000)
} 

Solution

  • This happens because the internal debouncer map is not initialized, so when Polymer tries to do a debouncer-name lookup, it dereferences an uninitialized/undefined array.

    Since this debouncer call is being used outside a Polymer element, you'd have to manually call the setup function that would've normally been done in the element's initialization (i.e., _setupDebouncers()):

    Polymer.Base._setupDebouncers();
    
    for (let i=0; i<100; i++) {
      Polymer.Base.debounce('foo', () => console.log('debounced'), 1000);
    }
    

    demo