How to disable pointer-events on web component with polymer?

Question

How do I set temporarily disable/enable a pointer-event in polymer web component by setting css properties pointer-events: none and pointer-events: auto?

Answer 1

You could set the element's pointer-events style programmatically. For example:

this.style.pointerEvents = 'none';
setTimeout(() => {
  this.style.pointerEvents = 'auto';
}, 4000);

demo