connectedCallback()

in x-test.js [302:338]


  connectedCallback() {
    this.setAttribute('ok', '');
    this.setAttribute('testing', '');
    this.style.height = localStorage.getItem('x-test-reporter-height');
    if (localStorage.getItem('x-test-reporter-closed') !== 'true') {
      this.setAttribute('open', '');
    }
    this.shadowRoot.getElementById('toggle').addEventListener('click', () => {
      this.hasAttribute('open') ? this.removeAttribute('open') : this.setAttribute('open', '');
      localStorage.setItem('x-test-reporter-closed', String(!this.hasAttribute('open')));
    });
    const resize = event => {
      const nextHeaderY = event.clientY - Number(this.getAttribute('dragging'));
      const currentHeaderY = this.shadowRoot.getElementById('header').getBoundingClientRect().y;
      const currentHeight = this.getBoundingClientRect().height;
      this.style.height = `${Math.round(currentHeight + currentHeaderY - nextHeaderY)}px`;
      localStorage.setItem('x-test-reporter-height', this.style.height);
    };
    this.shadowRoot.getElementById('header').addEventListener('pointerdown', event => {
      if (this.hasAttribute('open')) {
        const headerY = this.shadowRoot.getElementById('header').getBoundingClientRect().y;
        const clientY = event.clientY;
        this.setAttribute('dragging', String(clientY - headerY));
        addEventListener('pointermove', resize);
        for (const iframe of document.querySelectorAll('iframe')) {
          iframe.style.pointerEvents = 'none';
        }
      }
    });
    addEventListener('pointerup', () => {
      removeEventListener('pointermove', resize);
      this.removeAttribute('dragging');
      for (const iframe of document.querySelectorAll('iframe')) {
        iframe.style.pointerEvents = null;
      }
    });
  }