This does look like a bug. What I'm not 100% sure of is how it should be fixed, since I can see at least two sensible options.
Basically, the intended purpose of this feature is to handle circular references like this:
const x = {};
const obj = { foo: x };
x.bar = x;
x.baz = obj;
console.log(obj);
which will output:
{
/**id:1**/
"foo": {
/**id:2**/
"bar": /**ref:2**/,
"baz": /**ref:1**/
}
}
The bug occurs because the duplicate reference tracking code will also trigger on situations like your example above, where the same non-circular object is included more than once in the data. However, when that happens, the duplicate object gets replaced by a /**ref:n**/
reference marker, but the corresponding /**id:n**/
anchor does not get inserted in the object's previous occurrence.
The simple fix would be to make the feature not trigger on non-circular references at all. As far as I can tell at a glance, all that should take would be wrapping lines 198–231 of the snippet console code (in the latter half of function str(key, holder)
, after the map.push(value)
line) inside a try
block, and adding finally { map.pop() }
after it. That way, your example structure would be serialized the way you'd presumably expect:
{
"foo": {},
"bar": {},
"baz": {
"x": {},
"y": []
},
"wut": [
{},
[]
]
}
A slightly fancier fix would be to keep the duplicate reference detection as it is (or maybe upgrade it into a real Map for better performance), but instead fix the output generation to insert the anchors properly even for non-circular shared sub-objects. With this option, you example data structure would look something like this in the console:
{
"foo": { /**id:1**/ },
"bar": /**ref:1**/,
"baz": {
"x": /**ref:1**/,
"y": [ /**id:2**/ ]
},
"wut": [
/**ref:1**/,
/**ref:2**/
]
}
This would be a non-trivial change, since the current stringification code assumes that no new anchors will need to be added to objects that have been fully processed, but it would let the snippet console actually indicate which of several similar looking sub-objects are really the same object. As a bonus, it would also prevent pathologically nested data structures like the following from generating exponentially large output:
const a = [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ];
const b = [ a, a, a, a, a, a, a, a, a, a ];
const c = [ b, b, b, b, b, b, b, b, b, b ];
const d = [ c, c, c, c, c, c, c, c, c, c ];
const e = [ d, d, d, d, d, d, d, d, d, d ];
const f = [ e, e, e, e, e, e, e, e, e, e ];
console.log(f);
Ps. As noted Cerbrus in the comments below, the current /**id:n**/
/ /**ref:n**/
markers are kind of ugly and non-intuitive even when they're needed. At the risk of straying a bit from the topic of this thread, perhaps something like this might be more readable:
{
"foo": _REF1 = {},
"bar": _REF1,
"baz": {
"x": _REF1,
"y": _REF2 = []
},
"wut": [
_REF1,
_REF2
]
}
or, for the example with actual circular references above:
_REF1 = {
"foo": _REF2 = {
"bar": _REF2,
"baz": _REF1
}
}
This alternative output format would at least have the advantage of being (almost) valid JavaScript code, and thus somewhat self-explanatory.
Of course, in either case (or even with the current code), you'll never see any of this ugliness unless the objects you're logging to the console actually contain the same sub-object more than once. As long as you only log simple JSON-like objects, you'll never even notice this feature, which is presumably also why this bug in it has not been reported before.