Introduce support for Symbol named observable properties

Welcome to MobX. Please provide as much relevant information as possible!

I have a:

1. Question: Feel free to just state your question. For a quick answer, there are usually people online at our Gitter channel
2. Documentation improvement. Please don’t open an issue but create a PR instead!
3. Issue:

• Provide error messages including stacktrace
• Provide a minimal sample reproduction. Create a reproduction based on this sandbox
• Did you check this issue wasn’t filed before?
• Elaborate on your issue. What behavior did you expect?
• State the versions of MobX and relevant libraries. Which browser / node / … version?

1. Idea:

• What problem would it solve for you?
• Do you think others will benefit from this change as well and it should in core package (see also mobx-utils)?
• Are you willing to (attempt) a PR yourself?

Please tick the appropriate boxes. Feel free to remove the other sections.

Please be sure to close your issues promptly.

What

error 'set' on proxy: trap returned falsish for property 'Symbol(count)' threw when using Symbol as key in an observable,

How to reproduce

1. click the add button in normal section works fine
2. click the add button in symbol section broken 😦

[urugator]

Mobx ignores non-enumerable props (like symbols) in observable/extendObservable. The symbol is firstly introduced to the observable object during the assignment (in incSymbol). Mobx4 doesn’t support dynamic keys, so the standard JS behavior (new non-observable property is added to object) takes place, therefore no error. In Mobx5 proxy handler returns false for non-string keys, resulting in TypeError.

If Symbols where supported, could it conflict with current or future well-known symbols like: Symbol.iterator, Symbol.toStringTag, etc. ?

I don’t think so. Symbols are accessible via Object.getOwnPropertySymbols(), returning an empty array on empty objects. The argument passed to observable/extendObservable represents simple property list - not an arbitrary “smart” object (eg an object implementing a well known symbol). So if there is a symbol, it’s introduced by user and should be made observable imho (no matter what symbol it is, similary to providing toString or valueOf).

[mweststrate]

Released as 4.10.0 / 5.10.0. Thanks @loklaan !