JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://rawgithub.com/ifandelse/gnosis/master/lib/gnosis.js"></script>
<script src="https://rawgithub.com/ifandelse/34ac33a917beb07b295b/raw/a47f20d8ff289fd707365b05aed76ed8d6b68eeb/conduitMod.js"></script>
JavaScript
window.me = {
name: "Jim",
family: ["Steph", "James", "Nate", "Ian"]
};
var behavior = {
"[object Function]": function(obj, key, val, meta) {
var old = val;
obj[key] = new Conduit({ context: obj, target: old });
Object.defineProperty(obj, key, meta);
},
"default" : function(obj, key, val, meta) {
Object.defineProperty(obj, key, (function(val, obj) {
var _v = val;
return {
get: new Conduit({
target: function () {
return _v;
},
context: obj
}),
set: new Conduit({
target: function (v) {
_v = v;
},
context: obj
})
}
}(val, obj)));
}
};
console.log(
gnosis.traverse(me, function (obj, key, val, meta) {
console.log(meta);
if (!meta.descriptor.configurable) {
return;
}
var handler = behavior[meta.type] || behavior.default;
handler(obj, key, val, meta);
},
"me", {
walkPrototype: true,
nonEnumerable: true
})
);