Implementing HTMLElement APIs

[rgrempel]

At the moment, there doesn't seem to be something that you might expect at

src/DOM/HTML/HTMLElement.purs

to cover the various things that you can do with an HTMLElement, for instance, the things here:

https://developer.mozilla.org/en/docs/Web/API/HTMLElement

The one I'm particularly interested in is doing something with the style property -- so, I was going to add that. But, then I realized that the file I would logically add it to didn't seem to be there at all ...

I'd be happy to go through the web page mentioned above, figure out which of those things are sufficiently standard, and write up an implementation. But I thought I'd ask first, in case there are considerations I'm not thinking of.

[garyb]

Indeed you are right, not sure how I missed this one!

The missing IDL:

interface HTMLElement : Element {

  // DOM tree accessors
  NodeList getElementsByClassName(in DOMString classNames);

  // dynamic markup insertion
           attribute DOMString innerHTML;
           attribute DOMString outerHTML;
  void insertAdjacentHTML(in DOMString position, in DOMString text);

  // metadata attributes
           attribute DOMString id;
           attribute DOMString title;
           attribute DOMString lang;
           attribute DOMString dir;
           attribute DOMString className;
  readonly attribute DOMTokenList classList;
  readonly attribute DOMStringMap dataset;

  // user interaction
           attribute boolean hidden;
  void click();
  void scrollIntoView();
  void scrollIntoView(in boolean top);
           attribute long tabIndex;
  void focus();
  void blur();
           attribute boolean draggable;
           attribute DOMString contentEditable;
  readonly attribute boolean isContentEditable;
           attribute HTMLMenuElement contextMenu;
           attribute boolean spellcheck;

  // styling
  readonly attribute CSSStyleDeclaration style;

  // event handler DOM attributes
           attribute Function onabort;
           attribute Function onblur;
           attribute Function onchange;
           attribute Function onclick;
           attribute Function oncontextmenu;
           attribute Function ondblclick;
           attribute Function ondrag;
           attribute Function ondragend;
           attribute Function ondragenter;
           attribute Function ondragleave;
           attribute Function ondragover;
           attribute Function ondragstart;
           attribute Function ondrop;
           attribute Function onerror;
           attribute Function onfocus;
           attribute Function onkeydown;
           attribute Function onkeypress;
           attribute Function onkeyup;
           attribute Function onload;
           attribute Function onmousedown;
           attribute Function onmousemove;
           attribute Function onmouseout;
           attribute Function onmouseover;
           attribute Function onmouseup;
           attribute Function onmousewheel;
           attribute Function onscroll;
           attribute Function onselect;
           attribute Function onsubmit;

};

We can probably skip the onevent attributes though, since event handlers are the preferred way of doing things.

[rgrempel]

Thanks!

I'll do some work on this when I get a chance -- but others can feel free to take it up -- I'll post something here when I'm actively working on it.

[rgrempel]

Given #59, I think that all that is left is:

readonly attribute DOMStringMap dataset;
attribute HTMLMenuElement contextMenu;
readonly attribute CSSStyleDeclaration style;

Which, as pointed out in #59, all would require some thought.

[metasansana]

Hi,

I don't see anything in #59 about the "event handler DOM attributes". Were these intentionally left out?

[garyb]

Yeah, I suggested we did't include them - from above:

We can probably skip the onevent attributes though, since event handlers are the preferred way of doing things.

[metasansana]

Ah I missed that thanks.

Isn't that subject to opinion though?

I use both addEventListener and the event attributes depending on the context. Generally I prefer to use the attributes because I can repeat a block of code that does without having event handling doubling up.

With the addEventListener interface I have to explicitly call removeEventListener with the handler to avoid repeated event handling.