We create many `useDebugValue` helpers, loggers and so one now, so we can feel less pain.

What matter (**Updated**)
- previewing complex values brifely like chrome devtools does it for arrays, sets, maps, objects,,,

I [wrote related twit](https://twitter.com/mxtnr/status/1178271362890240001) recently with one of my DebugValue helpers. screenshot out here:
<img width="556" alt="Screenshot 2019-09-29 at 14 01 53" src="https://user-images.githubusercontent.com/6201068/66700775-5648bf80-ecfd-11e9-93fe-089d451bcffa.png">
_my named hooks currently require a `label` option unless react babel cannot transform name of variable automatically_
payload.value.props = dehydrateHelper(payload.value.props);
          payload.value.state = dehydrateHelper(payload.value.state);
        }
        resolve(payload);
      };
      bridge.addListener('inspectedElement', onInspectedElement);
      bridge.send('inspectElement', {id, path, rendererID});
      jest.runOnlyPendingTimers();
    });
  }
  beforeEach(() => {
    bridge = global.bridge;
    store = global.store;
    hydrate = require('react-devtools-shared/src/hydration').hydrate;
    meta = require('react-devtools-shared/src/hydration').meta;
    
    
    jest.mock('react', () => jest.requireActual('react-15/dist/react.js'));
    jest.mock('react-dom', () =>
      jest.requireActual('react-dom-15/dist/react-dom.js'),
    );
    React = require('react');
    ReactDOM = require('react-dom');
  });
  it('should inspect the currently selected element', async done => {
    const Example = () => null;
    act(() =>
      ReactDOM.render(<Example a={1} b="abc" />, document.createElement('div')),
    );
    const id = ((store.getElementIDAtIndex(0): any): number);