<commit_before><template>
  <div class="absolute-full overflow-hidden invisible" style="z-index: -1">
    <div
      ref="expand"
      class="absolute-full overflow-hidden invisible"
      @scroll="onScroll"
    >
      <div ref="expandChild" class="absolute-top-left transition-0" style="width: 100000px; height: 100000px;"></div>
    </div>
    <div
      ref="shrink"
      class="absolute-full overflow-hidden invisible"
      @scroll="onScroll"
    >
      <div class="absolute-top-left transition-0" style="width: 200%; height: 200%;"></div>
    </div>
  </div>
</template>

<script>
function getSize (el) {
  return {
    width: el.offsetWidth,
    height: el.offsetHeight
  }
}

export default {
  name: 'q-resize-observable',
  methods: {
    onScroll () {
      const size = getSize(this.$el.parentNode)

      if (size.width === this.size.width && size.height === this.size.height) {
        return
      }

      if (!this.timer) {
        this.timer = window.requestAnimationFrame(this.emit)
      }

      this.size = size
    },
    emit () {
      this.timer = null
      this.reset()
      this.$emit('resize', this.size)
    },
    reset () {
      const ref = this.$refs
      ref.expand.scrollLeft = 100000
      ref.expand.scrollTop = 100000
      ref.shrink.scrollLeft = 100000
      ref.shrink.scrollTop = 100000
    }
  },
  mounted () {
    this.$nextTick(() => {
      this.size = {}
      this.onScroll()
    })
  },
  beforeDestroy () {
    this.$emit('resize', {width: 0, height: 0})
  }
}
</script><commit_msg>fix: QResizeObservable erroring out in certain scenarios<commit_after><template>
  <div class="absolute-full overflow-hidden invisible" style="z-index: -1">
    <div
      ref="expand"
      class="absolute-full overflow-hidden invisible"
      @scroll="onScroll"
    >
      <div ref="expandChild" class="absolute-top-left transition-0" style="width: 100000px; height: 100000px;"></div>
    </div>
    <div
      ref="shrink"
      class="absolute-full overflow-hidden invisible"
      @scroll="onScroll"
    >
      <div class="absolute-top-left transition-0" style="width: 200%; height: 200%;"></div>
    </div>
  </div>
</template>

<script>
function getSize (el) {
  return {
    width: el.offsetWidth,
    height: el.offsetHeight
  }
}

export default {
  name: 'q-resize-observable',
  methods: {
    onScroll () {
      const size = getSize(this.$el.parentNode)

      if (size.width === this.size.width && size.height === this.size.height) {
        return
      }

      if (!this.timer) {
        this.timer = window.requestAnimationFrame(this.emit)
      }

      this.size = size
    },
    emit () {
      this.timer = null
      this.reset()
      this.$emit('resize', this.size)
    },
    reset () {
      const ref = this.$refs
      if (ref.expand) {
        ref.expand.scrollLeft = 100000
        ref.expand.scrollTop = 100000
      }
      if (ref.shrink) {
        ref.shrink.scrollLeft = 100000
        ref.shrink.scrollTop = 100000
      }
    }
  },
  mounted () {
    this.$nextTick(() => {
      this.size = {}
      this.onScroll()
    })
  },
  beforeDestroy () {
    this.$emit('resize', {width: 0, height: 0})
  }
}
</script>
{'fraction_non_alphanumeric': 0.15670941507663436, 'fraction_numerical': 0.029402564904598062, 'mean_word_length': 2.3557187827911856, 'pattern_counts': {'":': 0, '<': 31, '<?xml version=': 0, '>': 33, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1363321', 'n_tokens_mistral': 1123, 'n_tokens_neox': 1022, 'n_words': 203}