Missing getClientRects method and other stuff

[flip111]

I want to implement this code here https://stackoverflow.com/a/3028037/1833322

which has the line

const isVisible = elem => !!elem && !!( elem.offsetWidth || elem.offsetHeight || elem.getClientRects().length )

For that i need getClientRects. This method is not available in the documentation

https://pursuit.purescript.org/packages/purescript-web-dom/4.0.1/docs/Web.DOM.Element

I also saw a bunch of other properties, methods and event handlers that don't seem to be implemented

From: https://developer.mozilla.org/en-US/docs/Web/API/Element

properties

Element.computedName
Element.computedRole
Element.innerHTML
Element.outerHTML
Element.part
NonDocumentTypeChildNode.nextElementSibling
NonDocumentTypeChildNode.previousElementSibling
Element.shadowRoot
Element.slot
Element.undoManager
Element.undoScope
Slotable.assignedSlot

event handlers

Element.onfullscreenchange
Element.onfullscreenerror

methods

EventTarget.addEventListener()
Element.attachShadow()
Element.animate()
Element.closest()
Element.createShadowRoot()
Element.computedStyleMap()
EventTarget.dispatchEvent()
Element.getAnimations()
Element.getAttributeNames()
Element.getAttributeNS()
Element.getBoundingClientRect()
Element.getClientRects()
Element.hasAttributeNS()
Element.hasPointerCapture()
Element.insertAdjacentElement()
Element.insertAdjacentHTML()
Element.insertAdjacentText()
Element.matches()
Element.pseudo()
Element.querySelector()
Element.querySelectorAll()
Element.releasePointerCapture()
ChildNode.remove()
Element.removeAttributeNS()
Element.removeAttributeNode()
EventTarget.removeEventListener()
Element.requestFullscreen()
Element.requestPointerLock()
Element.scroll()
Element.scrollBy()
Element.scrollIntoView()
Element.scrollTo()
Element.setAttributeNS()
Element.setPointerCapture()
Element.toggleAttribute()

[garyb]

A lot of these are defined in https://github.com/purescript-web/purescript-web-html

The DOM API applies to XML, SVG, etc. and the HTML API extends it. See the READMEs of the respective libraries for links to the relevant specs 🙂

[flip111]

I don't find the getClientRects function when i search on pursuit. I searched for some other things as well and i can't find them either.

[garyb]

Ah yeah, some of them, like getClientRects is part of CSSOM-view: https://drafts.csswg.org/cssom-view/#dom-element-getclientrects, which there isn't really a library for yet. There's a CSSOM lib but that's also lacking stuff, and CSSOM-view is a separate spec again.

There are definitely things from your list that already exist elsewhere though, a random selection:

• https://pursuit.purescript.org/packages/purescript-web-events/2.0.1/docs/Web.Event.EventTarget#v:addEventListener
• https://pursuit.purescript.org/packages/purescript-web-html/2.3.0/docs/Web.HTML.HTMLElement#v:getBoundingClientRect
• https://pursuit.purescript.org/packages/purescript-web-dom/4.0.1/docs/Web.DOM.ParentNode#v:querySelector

It's not uncommon for people to request things from the MDN listings, but we don't go from those listings - they cut across multiple specifications, and not everything listed is even specified - some of the properties and functions are experimental/deprecated/from obsolete proposals.

The goal of the purescript-web libraries is to implement individual specifications. This has become a little harder since things were switched over to living standards rather than the previous versioned specifications admittedly, but the idea is to avoid opinionating the libraries and instead having them as basic building blocks that people can rely on and build on top of if they want to improve the ergonomics to their taste.

[flip111]

@garyb what are the steps to add getClientRects? I can try to do it

Should it go here? https://github.com/purescript-web/purescript-web-cssom
Or new purescript-web-cssom-view?

What's the "living standard?". MDN is not a standard, but it's an authority in the field though.

btw i already left out the deprecated and obsolute items.

[keijokapp]

I made my own purescript-web-geometry for DOMRect and DOMRectList, and purescript-web-cssom-view which should implement all interfaces in CSSOM View Module except

• The features argument to the open() method
• Extensions to the Document Interface
• The CaretPosition Interface
• Extensions to the Range Interface
• Extensions to the MouseEvent Interface
• The GeometryUtils Interface
• Events

These packages are not fully tested yet - I'd like to get some kind of approval before spending more time on it.

What's the process of getting these packages reviewed, added to purescript-web, and published?

[thomashoneyman]

@keijokapp you can ping myself and @garyb to review your library, and I can take care of transferring the library into purescript-web and migrated in the registry / published. You'd be a maintainer on the library. We're both active in Slack, or on the PureScript Discourse.

[JordanMartinez]

This should also be done with the next round of breaking changes.