Ref: https://github.com/reactjs/rfcs/pull/147#issuecomment-623740218

React version: 0.0.0-experimental-e5d06e34b

## Steps To Reproduce

1. createMutableSource that contains functions
2. getSnapshot returns one of the functions

Link to code example:

https://codesandbox.io/s/jovial-dew-1eg4t?file=/src/App.js

## The current behavior

If getSnapshot returns a function, it will run the function in render. This results in various errors.

My workaround: return an object wrapping a function, and destruct on caller.

> For now, you can work around this by returning a function that returns your function

I don't know how this works as workaround.

## The expected behavior

It would be nice if returning a function just works.

Note: this is not a rare use case in my library https://github.com/dai-shi/use-context-selector
because we often pass `[state, setState]` in a context value.
});
  
  it('should clear the update queue when source changes with pending lower priority updates', async () => {
    const sourceA = createSource('initial');
    const sourceB = createSource('initial');
    const mutableSourceA = createMutableSource(sourceA);
    const mutableSourceB = createMutableSource(sourceB);
    function App({toggle}) {
      const state = useMutableSource(
        toggle ? mutableSourceB : mutableSourceA,
        defaultGetSnapshot,
        defaultSubscribe,
      );
      const result = (toggle ? 'B: ' : 'A: ') + state;
      return result;
    }
    const root = ReactNoop.createRoot();
    await act(async () => {
      root.render(<App toggle={false} />);
    });
    expect(root).toMatchRenderedOutput('A: initial');
    await act(async () => {
      ReactNoop.discreteUpdates(() => {
        
        sourceA.value = 'Update';
        sourceB.value = 'Update';
        
        root.render(<App toggle={true} />);
      });