Anti-framework 0.2

Working single events removal.

by Julien Etienne

HTML

<span>HELLO WORLD <a>fwefw</a> iwerghefiwuehfiuweh</span>

JavaScript

const _store = {
  referencedEl: {},
  templates: {},
  singleEvents: new WeakMap(),
  singleEventsAncestors: []
}



// If traversing from `document` is a problem you should be using a 
// virtual-list to manage off-screen DOM elements
const query = selector => document.querySelector(selector)
const queryAll = selector => [...document.querySelectorAll(selector)]

// Removes all child nodes not just children
const replaceChildNodes = parent => {
  while (parent.hasChildNodes()) {
    parent.removeChild(parent.lastChild)
  }
}

// Gets a list of all ancestors up to the body
const getAncestors = (el) => {
  const ancestors = [el],
    {
      body
    } = document
  while (el.parentElement !== body) {
    el = el.parentElement;
    ancestors.push(el)
  }
  return ancestors
}

const storeReferencedEl = (selector, HTML, ref) => {
  if (!_store.templates[selector]) {
    console.error(`Template ${selector} is in use.`)
    return
  }
  // Add the new template
  const template = _store.templates[selector] = document.createElement('template')

  // Add a base element to template
  template.append(document.createElement('div'))
  const {
    firstElementChild
  } = template

  // Create the HTMl and insert the into the base element 
  firstElementChild.insertAdjacentHTML('afterbegin', HTML)

  // Store the referenced element
  _store.referencedEl[ref] = firstElementChild.firstElementChild
}



const removeDescendentEvents = (el) => {
  const eventsToRemove = _store.singleEventsAncestors.reduce((acc, entry, i) => {
    if (entry.indexOf(el) > -1) {
      _store.singleEventsAncestors[i] = null
      acc.push(entry[0])
    }
    return acc
  }, [])

  // Remove events 
   eventsToRemove.forEach(boundedElement => {
    const elEvent = _store.singleEvents.get(boundedElement)
    const {
      selector,
      event,
      eventHandler,
      options
    } = elEvent

    boundedElement.removeEventListener(event, eventHandler, options)
    boundedElement = null
  }) 
} 



const...