[Feat] better console.log behavior for events
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 8.5k
- Forks
- 1.4k
- Avg merge
- 5d 17h
- Merged PRs (30d)
- 3
Description
Target Use Case
As a first time user with react-map-gl, when using a map with interactiveLayerIds=[SomeLayer..id] and doing console.log(event) in the onClick EventHandler, you see the following output in console:
Now you start wondering where the crucial "features" property is and try to fix things in your code. Of course nothing will change whatever you do .Then, after copy/pasting an official example (cluster example) into my codebase and also doing console.log(), you see that its the same there too. Now you realize, that console.log() just doesnt print out the "features" property. The only way to print out this property is the following:
console.log(Object.getOwnPropertyNames(event));
Which gets you this:
So you fought an error which wasnt one in the first place and thats kind of horrible.
Proposal
Dont know a proposal. Would like to see console.log include this important property when its there. Not a JS pro so i cant even figure out why its not there in the first place. Perhaps something todo with the js prototype property?
What would have helped is a hint in the docs for the interactiveLayerIds=[SomeLayer..id] property so that developers dont search for the resulting "features" property in the event via console.log() which is a quite normal quck and dirty way to inspect stuff. After this, most likely i will start sooner firing up a debugger with a breakpoint
Appendix: thanks for this great library.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the interactiveLayerIds and onClick event documentation, then compare the official cluster example's event object with the console output described here. Determine whether the requested behavior or a documentation hint is appropriate; done means the features property is discoverable through normal inspection or the docs clearly explain how to inspect it.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend, web-dev
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 32/100