v4.0.0

Breaking: Important Notice

The overall purpose of this project has changed. Please read carefully.

Motivation

ExtraJS-dom is no longer an independent implementation of DOM. It is now a supplement to jsdom, which I use and fully endorse. jsdom strictly adheres to the W3C and WHATWG standards, and a standards-based approach the best route for web developers.

I am still keeping this project open, however, for helper functions. The aim of this rewrite is to reduce conflict between “native” (DOM API) and this project’s custom API.

The New Role of ExtraJS-dom

This project will no longer "extend" the DOM API classes. Rather, the custom methods and helper functions will be exported in static classes, much like Underscore or ExtraJS. For regular DOM programming, developers are encouraged to use jsdom, but may use ExtraJS-dom to extend DOM functionality and use helper classes.

Therefore, you should import ExtraJS-dom classes with an xjs namespace.

const xjs = {
  // Object: require('extrajs').Object, // optional
  HTMLElement: require('extrajs-dom').HTMLElement,
}
// const xjs = require('extrajs-dom') // simply if you are not `require('extrajs')`

const document // see `jsdom` on how to create a document

// create a new element
let my_element = document.createElement('div') // correct
// my_element = new xjs.HTMLElement('div') // wrong!

// use helper functions
new xjs.Element(my_element).attr({ class: 'a b c', id: 'd' })
xjs.DocumentFragment.concat('hello', my_element, 'world')

let link = document.querySelector('a')
let url = 'http://schema.org/'

// separately
if (url) link.href = url
else link.removeAttribute('href')
link.rel = 'external'
link.textContent = 'the schema'

// together
let xlink = new xjs.HTMLAnchorElement(link)
xlink
  .attr({
    href: url || null, // setting null removes it
    rel : 'external',
  })
  .textContent('the schema')
document.body.append(xlink.node) // refers to original `link`

Non-Breaking Changes

• more thorough & updated documentation
• add xjs.HTMLTemplateElement static methods:
  • .fromFile()
  • .fromFileSync()
  • both new methods return an xjs.HTMLTemplateElement object

Fixes

• move jsdom to prod dependencies