How best to convert a ClientRect / DomRect into a plain Object
Warning: non-standard behavior (doesn't work in Firefox < 62, including ESR 60 and possibly other browsers other than Chrome)
var obj = el.getBoundingClientRect().toJSON();
Let's not overcomplicate things!
function getBoundingClientRect(element) {
var rect = element.getBoundingClientRect();
return {
top: rect.top,
right: rect.right,
bottom: rect.bottom,
left: rect.left,
width: rect.width,
height: rect.height,
x: rect.x,
y: rect.y
};
}
ES2015:
const getBoundingClientRect = element => {
const {top, right, bottom, left, width, height, x, y} = element.getBoundingClientRect()
return {top, right, bottom, left, width, height, x, y}
}
console.log(
getBoundingClientRect( document.body )
)
This is something that I can live with:
const persistRect = JSON.parse(JSON.stringify(someElement.getBoundingClientRect()))