12

JavaScript Set appears to be entirely incompatible with JavaScript proxies, attempting to Proxy() a Set()

var p = new Proxy(new Set(), {
  add(target, val, receiver) {
    console.log('in add: ', target, val, receiver)
  }
})
p.add(55)

results in a VMError:

Uncaught TypeError: Method Set.prototype.add called on incompatible receiver [object Object]
    at Proxy.add (native)
    at <anonymous>:1:3

In fact, proxying a Set() in any way breaks it categorically - even if our proxy handler does nothing at all! Compare p = new Proxy({}, {}) vs p = new Proxy(new Set(), {}). (This applies both in Firefox (52.0.2) and Chromium (57.0.2987.133).)

I can't seem to find a credible reference or documentation for this, why cannot JavaScript Proxy a Set object and why is it hitting a VM Error?

user3840170
  • 26,597
  • 4
  • 30
  • 62
user3467349
  • 3,043
  • 4
  • 34
  • 61
  • There is no `add` trap in proxies. It looks like you're looking for a subclass, not a proxy (which is not a `Set` and can't be used with Set methods) – Bergi May 12 '17 at 03:33
  • @Bergi Where do you see this answered? The answer for Map does not apply to Set and neither does it explain why an empty handler will break a Set Proxy. As for the lack of a trap: is this documented anywhere? Why does an empty trap `{}` cause VMErrors for a Set Proxy? – user3467349 May 12 '17 at 10:47
  • No, I'm not looking for a subclass, please read the question before closing it as duplicate next time... – user3467349 May 12 '17 at 10:55
  • The explanation does apply, `Map`s and `Set`s work alike. And really, it *does* look like you're looking to intercept `add` method calls, for which subclasses are the easiest solution. – Bergi May 12 '17 at 13:17
  • I'm asked 2 questions which are clearly stated in my question (neither of which are answered in the linked to 'duplicate' questions): Where is it documented (or is it) that `Proxy` is incompatible with `Set`? Why does it cause a VMError even on an *empty handler*? No where in my question does it ask "how do I intercept add calls". – user3467349 May 12 '17 at 13:32
  • Well, the declaration of the `add` function certainly implies that :-) That's as good as an empty [proxy handler](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler) object. – Bergi May 12 '17 at 13:45
  • The duplicate explains that the method "*is called with `this` set to the proxy, not the `Map` — which `Map` [methods don't] like.*". See also the explanation [here](http://stackoverflow.com/a/29926193/1048572) – Bergi May 12 '17 at 13:49
  • > Well, the declaration of the add function certainly implies that - No it doesn't it illustrates that the `add` fails to trap calls to Proxy - but it doesn't explain why and neither does the documentation which you linked to. In fact the documentation explicitly states *All traps are optional. If a trap has not been defined, the default behavior is to forward the operation to the target.* - which is the expected behavior we see with e.g. `p = new Proxy({}, { doesNotCaptureAnything() { }})` (as you say equivalent to an empty-handler). – user3467349 May 12 '17 at 15:00
  • On the other-hand none of that explains why `p = new Proxy(new Set(), {})` (have you actually tried running it?) completely breaks the target, that is explicitly contradicting the docs the *forward the operation to the target* fails. So with that established I would expect/hope (as someone potentially surprised by this) to be able to google and see an Stackoverflow answer with a link say to the ES5/ES6 spec, or otherwise explaining how it happens? (Is it just a coincidental implementation detail that *happens* to coincide in Node, Firefox, Chrome ?) – user3467349 May 12 '17 at 15:03

1 Answers1

17

I am attempting to Proxy() a Set()

However, you haven't used any of the available traps - there is no add one. All that you can intercept in the call p.add(55) is the property access to .add on the proxy, which goes through the get trap and returns a function.

If you want to intercept calls to the add method, you don't need a proxy at all, better (subclass and) overwrite that method similar to how .set was overridden here and here for Map.

proxying a Set() in any way breaks it categorically

Yes, because the proxy is not a Set any more.

var s = new Set([42]);
var p = new Proxy(s, {});
s.has(42) // true
console.log(s === p) // false
p.has.call(s, 42) // true
p.has(42) // exception - calls `has` on `p`, not on `s`

Calling Set methods on objects that are no True Sets does throw an exception (which e.g. can be used for detecting them). For your particular case, see ECMAScript 6 §23.2.3.1:

"If S does not have a [[SetData]] internal slot, throw a TypeError exception."

And indeed, p is a proxy (which does have the internal Proxy methods and slots, especially [[ProxyHandler]] and [[ProxyTarget]]) instead of a set like s with its [[SetData]] internal slot.

You reasonably were expecting that "if a trap has not been defined, the default behavior is to forward the operation to the target", however that only applies to standard behaviours like property access, and not the internal slots of exotic objects.

Community
  • 1
  • 1
Bergi
  • 630,263
  • 148
  • 957
  • 1,375