slideUp / slideDown on transition

Spoiler.js

export default class Spoiler {
    constructor(container) {
        this.container = container;
        this.opener = this.container.querySelector('.opener');
        this.content = this.container.querySelector('.content');
        this.isAnimating = false;
        this.opened = false;

        this.container.addEventListener(transitionend, ()=>{
            this.isAnimating = false;
            if (this.opened) {
                this.content.style.maxHeight = 'none';
            }
        });

        this.opener.addEventListener('click', (e)=>{
            e.preventDefault();
            this.opened ? this.close() : this.open()
        })
    }

    open() {
        if (this.isAnimating || this.opened) {
            return;
        }
        this.content.style.maxHeight = this.content.scrollHeight + 'px';
        this.isAnimating = true;
        this.opened = true;
    }

    close() {
        if (this.isAnimating || !this.opened) {
            return;
        }
        this.content.style.maxHeight = this.content.scrollHeight + 'px';
        this.isAnimating = true;
        this.opened = false;
        setTimeout(()=>{
            this.content.style.maxHeight = 0;
        }, 10);
    }
}

spoyler.styl

.spoiler
    .content
      max-height 0
      overflow hidden
      transition max-height 0.5s