Skip to content

Stores on the server aren't proxies #1733

@thetarnav

Description

@thetarnav

Describe the bug

Both createMutable and createStore pass through the state object input as the returned value on the server.

image

This leads to referential and proxy checks to behave differently on client and server.

const [state, setState] = createStore({})

//                          CLIENT   |   SERVER
state === unwrap(state) //  false    |   true
$TRACK in state         //  true     |   false
$RAW in state           //  true     |   false
$PROXY in state         //  true     |   false
state[$PROXY]           //  (proxy)  |   undefined
state[$RAW]             //  (object) |   undefined

This is probably intentional for performance reasons, but it feels inconstant and may lead to random unpredictable bugs.

I've stumbled on it when making a primitive for observing changes to stores, which lead to a hydration error as the initial value on the server was an empty array, and the initial store state on the client.

export function createStoreDelta<T extends Static>(store: T): () => StoreDelta<T> {
  if (!($TRACK in store)) {
    return () => [];
  }

  const cache: StoreDeltaCache = {};
  return () => {
    CurrentDelta = [];
    compareStoreWithCache(store, cache, "root", []);
    return CurrentDelta;
  };
}

This is a very edge-casey thing which I probably need to work around better.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions