samdenty / console-feed

Captures console.log's into a React Component 🔥
https://stackblitz.com/~/github.com/samdenty/console-feed
MIT License
649 stars 106 forks source link

Set array items display incorrectly #84

Open lbogdan opened 3 years ago

lbogdan commented 3 years ago

Brace yourselves, issues from CodeSandbox incoming! 😃

Consider this code:

const testSet = new Set();

testSet.add(1);
testSet.add(2);
testSet.add({ foo: 'bar' });
testSet.add([3, 4]);

console.log(testSet);

Expected output (from Chrome's console):

image

Actual output:

image

(note that objects are handled fine)

Reproduction sandbox: https://codesandbox.io/s/console-feed-set-array-item-f3dmn

Related CodeSandbox issue: https://github.com/codesandbox/codesandbox-client/issues/5493

samdenty commented 3 years ago

I believe this stems from the underlying react-inspector library. With all the past issues opened though from styling/virtualization, I'm tempted more towards a rewrite.

I saw that https://github.com/facebook/flipper started using it too a while back. I briefly played around with it locally and it looked amazing - not sure if they ran into perf issues & are still using it CC @mweststrate I'm curious to learn more

samdenty commented 3 years ago

we'd need a new transform similar to the promise one https://github.com/samdenty/console-feed/issues/86.

https://github.com/samdenty/console-feed/blob/0405ab2602c9eb14a4bac7499aa86189531827e6/src/Component/react-inspector/index.tsx#L86

though the promise state can't update due to lack of virtualization