state_descriptors_fixed error when testing writable with nested data structure and Immer

[alter-kaker]

Describe the bug

state_descriptors_fixed error updating nested data passed as props from test in conjunction with immer

Reproduction

Reproduction repo link
The repository includes a the immer library to make it easier to work with immutable data. The tests demonstrate the issue when passing a nested data structure to a Page component, and then attempting to update it using a callback method that's activated by a button in the component.

There are two tests in the repo:

• update the data with Immer
• update the data without Immer

The second one passes. Both buttons cause no issues when I test them manually in my browser (I am using Vivaldi, which is Chrome based).

If the nested field is removed, I no longer see those errors in the tests.

Logs

> [email protected] test
> npm run test:unit -- --run


> [email protected] test:unit
> vitest --run


 RUN  v3.0.7 /home/alter_kaker/code/test-error

stderr | src/routes/tests/page.svelte.test.ts > immer
Error: Uncaught [Svelte error: state_descriptors_fixed
Property descriptors defined on `$state` objects must contain `value` and always be `enumerable`, `configurable` and `writable`.
https://svelte.dev/e/state_descriptors_fixed]
    at reportException (/home/alter_kaker/code/test-error/node_modules/jsdom/lib/jsdom/living/helpers/runtime-script-errors.js:66:24)
    at innerInvokeEventListeners (/home/alter_kaker/code/test-error/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:353:9)
    at invokeEventListeners (/home/alter_kaker/code/test-error/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:286:3)
    at HTMLButtonElementImpl._dispatch (/home/alter_kaker/code/test-error/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:233:9)
    at HTMLButtonElementImpl.dispatchEvent (/home/alter_kaker/code/test-error/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:104:17)
    at HTMLButtonElement.dispatchEvent (/home/alter_kaker/code/test-error/node_modules/jsdom/lib/jsdom/living/generated/EventTarget.js:241:34)
    at file:///home/alter_kaker/code/test-error/node_modules/@testing-library/user-event/dist/esm/event/dispatchEvent.js:43:33
    at Object.eventWrapper (/home/alter_kaker/code/test-error/node_modules/@testing-library/dom/dist/config.js:25:23)
    at wrapEvent (file:///home/alter_kaker/code/test-error/node_modules/@testing-library/user-event/dist/esm/event/wrapEvent.js:4:24)
    at Object.dispatchEvent (file:///home/alter_kaker/code/test-error/node_modules/@testing-library/user-event/dist/esm/event/dispatchEvent.js:43:12) Svelte error: state_descriptors_fixed
Property descriptors defined on `$state` objects must contain `value` and always be `enumerable`, `configurable` and `writable`.
https://svelte.dev/e/state_descriptors_fixed
    at Module.state_descriptors_fixed (/home/alter_kaker/code/test-error/node_modules/svelte/src/internal/client/errors.js:303:17)
    at Object.defineProperty (/home/alter_kaker/code/test-error/node_modules/svelte/src/internal/client/proxy.js:92:27)
    at Function.freeze (<anonymous>)
    at freeze (file:///home/alter_kaker/code/test-error/node_modules/immer/src/utils/common.ts:203:9)
    at maybeFreeze (file:///home/alter_kaker/code/test-error/node_modules/immer/src/core/finalize.ts:163:3)
    at finalizeProperty (file:///home/alter_kaker/code/test-error/node_modules/immer/src/core/finalize.ts:156:4)
    at file:///home/alter_kaker/code/test-error/node_modules/immer/src/core/finalize.ts:62:4
    at file:///home/alter_kaker/code/test-error/node_modules/immer/src/utils/common.ts:76:4
    at Array.forEach (<anonymous>)
    at each (file:///home/alter_kaker/code/test-error/node_modules/immer/src/utils/common.ts:75:24) {
  stackStr: 'Svelte error: state_descriptors_fixed\n' +
    'Property descriptors defined on `$state` objects must contain `value` and always be `enumerable`, `configurable` and `writable`.\n' +
    'https://svelte.dev/e/state_descriptors_fixed\n' +
    '    at Module.state_descriptors_fixed (/home/alter_kaker/code/test-error/node_modules/svelte/src/internal/client/errors.js:303:17)\n' +
    '    at Object.defineProperty (/home/alter_kaker/code/test-error/node_modules/svelte/src/internal/client/proxy.js:92:27)\n' +
    '    at Function.freeze (<anonymous>)\n' +
    '    at freeze (file:///home/alter_kaker/code/test-error/node_modules/immer/src/utils/common.ts:203:9)\n' +
    '    at maybeFreeze (file:///home/alter_kaker/code/test-error/node_modules/immer/src/core/finalize.ts:163:3)\n' +
    '    at finalizeProperty (file:///home/alter_kaker/code/test-error/node_modules/immer/src/core/finalize.ts:156:4)\n' +
    '    at file:///home/alter_kaker/code/test-error/node_modules/immer/src/core/finalize.ts:62:4\n' +
    '    at file:///home/alter_kaker/code/test-error/node_modules/immer/src/utils/common.ts:76:4\n' +
    '    at Array.forEach (<anonymous>)\n' +
    '    at each (file:///home/alter_kaker/code/test-error/node_modules/immer/src/utils/common.ts:75:24)',
  nameStr: 'Svelte error',
  expected: 'undefined',
  actual: 'undefined'
}

 ❯  client  src/routes/tests/page.svelte.test.ts (2 tests | 1 failed) 122ms
   × immer 108ms
     → Unable to find an element with the text: immer. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.

Ignored nodes: comments, script, style
...
   ✓ writable

⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Failed Tests 1 ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯

 FAIL   client  src/routes/tests/page.svelte.test.ts > immer
TestingLibraryElementError: Unable to find an element with the text: immer. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.

Ignored nodes: comments, script, style
...
 ❯ Object.getElementError node_modules/@testing-library/dom/dist/config.js:37:19
 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:76:38
 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:52:17
 ❯ node_modules/@testing-library/dom/dist/query-helpers.js:95:19
 ❯ src/routes/tests/page.svelte.test.ts:19:16
     17|  });
     18|  await userEvent.click(screen.getByTestId('button-immer'));
     19|  expect(screen.getByText('immer')).toBeInTheDocument()
       |                ^
     20| });
     21| test('writable', async () => {

⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[1/1]⎯

⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Unhandled Errors ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯

Vitest caught 1 unhandled error during the test run.
This might cause false positive tests. Resolve unhandled errors to make sure your tests are not affected.

⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Uncaught Exception ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
Svelte error: state_descriptors_fixed
Property descriptors defined on `$state` objects must contain `value` and always be `enumerable`, `configurable` and `writable`.
https://svelte.dev/e/state_descriptors_fixed
 ❯ Module.state_descriptors_fixed node_modules/svelte/src/internal/client/errors.js:303:17
 ❯ Object.defineProperty node_modules/svelte/src/internal/client/proxy.js:92:27
 ❯ freeze node_modules/immer/src/utils/common.ts:203:9
 ❯ maybeFreeze node_modules/immer/src/core/finalize.ts:163:3
 ❯ finalizeProperty node_modules/immer/src/core/finalize.ts:156:4
 ❯ node_modules/immer/src/core/finalize.ts:62:4
 ❯ node_modules/immer/src/utils/common.ts:76:4
 ❯ each node_modules/immer/src/utils/common.ts:75:24

This error originated in "src/routes/tests/page.svelte.test.ts" test file. It doesn't mean the error was thrown inside the file itself, but while it was running.
The latest test that might've caused the error is "immer". It might mean one of the following:
- The error was thrown, while Vitest was running this test.
- If the error occurred after the test had been completed, this was the last documented test before it was thrown.
⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯


 Test Files  1 failed (1)
      Tests  1 failed | 1 passed (2)
     Errors  1 error
   Start at  14:17:48
   Duration  1.45s (transform 305ms, setup 488ms, collect 94ms, tests 122ms, environment 381ms, prepare 110ms)

Severity

serious, but I can work around it

Additional Information

With regards to severity, this issue is preventing me from e2e testing my application, but I can keep working in the meantime. I don't know how to actually work around it.