JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdn.jsdelivr.net/lodash/4.17.4/lodash.min.js"></script>
<div id="question" style="width: 150px; height: 75px; border: 5px solid red;">Click Run then press F12 to see Javascript console output.</div>

JavaScript

function test(o) {
    console.log("===============================");
    console.log("Object:", o);
    console.log("Object.width:", o.width);
    console.log("Assign test:", Object.assign({}, o));
    console.log("Keys test:", Object.keys(o));
    console.log("JSON test:", JSON.stringify(o));
}

var el = document.getElementById("question");                 /* or document.body */

test(el.style);                                               /* works as expected */
test(el.getBoundingClientRect());                             /* behaves like {} */
test(Object.assign(el.getBoundingClientRect(),{aaaa: 1111})); /* works... only for aaaa */
test(_.assignIn({}, el.getBoundingClientRect())); /* just works! */

/* ============= OP's solution ============ */

var ownify = input => Object.keys(Object.getPrototypeOf(input)).reduce((output,key) => Object.assign(output, {[key]: input[key]}), Object.assign({}, input));

test(ownify(el.getBoundingClientRect())); /* apparently works! */

/* https://stackoverflow.com/questions/42713229/why-are-properties-of-this-object-domrect-inaccessible-to-standard-javascript */