<commit_before>'use strict';

{
  const select = document.createElement('div');
  const layer  = document.createElement('div');

  select.classList.add('spoilblock-select-box');

  layer.classList.add('spoilblock-select-layer');
  layer.appendChild(select);

  document.body.appendChild(layer);

  document.body.addEventListener('mouseover', function (event) {
    let target  = event.target;
    let display = (target.currentStyle ? target.currentStyle : getComputedStyle(target, null)).display;

    while (display !== 'block') {
      target  = target.parent;
      display = (target.currentStyle ? target.currentStyle : getComputedStyle(target, null)).display;
    }

    const rect = target.getBoundingClientRect();

    select.style.top  = (window.scrollY + rect.top)  + 'px';
    select.style.left = (window.scrollX + rect.left) + 'px';

    select.style.width  = rect.width  + 'px';
    select.style.height = rect.height + 'px';
  });

  browser.runtime.onMessage.addListener((message) => {
    if (typeof message === 'object' && message.action === 'disable') {
      document.body.removeChild(layer);
    }
  });
}<commit_msg>Create CSS selector for target on click<commit_after>'use strict';

{
  const select = document.createElement('div');
  const layer  = document.createElement('div');

  select.classList.add('spoilblock-select-box');

  layer.classList.add('spoilblock-select-layer');
  layer.appendChild(select);

  document.body.appendChild(layer);

  let target = null;

  document.body.addEventListener('mouseover', function (event) {
    target  = event.target;

    let display = (target.currentStyle ? target.currentStyle : getComputedStyle(target, null)).display;

    while (display !== 'block') {
      target  = target.parentElement;
      display = (target.currentStyle ? target.currentStyle : getComputedStyle(target, null)).display;
    }

    const rect = target.getBoundingClientRect();

    select.style.top  = (window.scrollY + rect.top)  + 'px';
    select.style.left = (window.scrollX + rect.left) + 'px';

    select.style.width  = rect.width  + 'px';
    select.style.height = rect.height + 'px';
  });

  document.body.addEventListener('click', function (event) {
    const selector = createSelector(target);

    event.stopPropagation();
    event.preventDefault();
  }, true);

  browser.runtime.onMessage.addListener((message) => {
    if (typeof message === 'object' && message.action === 'disable') {
      document.body.removeChild(layer);
    }
  });

  function createSelector(element) {
    const selectors = [];

    let current  = element;
    let parent   = current.parentElement;

    selectors.unshift(current.tagName.toLowerCase() + (current.id !== '' ? '#' + current.id : ''));

    while (parent !== null && current.id === '') {
      const siblings = Array.prototype.filter.call(parent.children || [], function (item) {
        return (item.tagName === current.tagName);
      });

      if (siblings.length > 1) {
        let index = 0;

        while (siblings[index] !== current) {
          index++;
        }

        selectors[0] += ':nth-of-type(' + (index + 1) + ')';
      }

      current = parent;
      parent  = current.parentElement;

      selectors.unshift(current.tagName.toLowerCase() + (current.id !== '' ? '#' + current.id : ''));
    };

    return selectors.join(' > ');
  }

}
{'fraction_non_alphanumeric': 0.16145367887995235, 'fraction_numerical': 0.0011915400655347036, 'mean_word_length': 3.2941176470588234, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 7, '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': '3273617', 'n_tokens_mistral': 1026, 'n_tokens_neox': 994, 'n_words': 183}