useProxies: 'never' still throws error on IE11

[filipengberg]

To make MobX 6 work in IE11 I have added the following code at the beginning of my index.tsx:

import { configure } from 'mobx';
configure({ useProxies: 'never' });

Intended outcome:

The app should work in IE11 without any Proxy errors from Mobx.

Actual outcome:

I get the following error from mobx:

`Proxy` objects are not available in the current environment. Please configure MobX to enable a fallback implementation.`

How to reproduce the issue:

Tried creating a reproducible app in CodeSandbox but it won't run at all in IE11 :(

I did some debugging and it seems that mobx runs the following code before configure has been run:

mobx/packages/mobx/src/api/observable.ts

Line 157 in 50b4eb5

return (globalState.useProxies === false || o.proxy === false

This means that if you have an observable array in your app mobx will try to create it using createObservableArray instead of createLegacyArray since globalState.useProxies has not yet been set to false.

Versions

"mobx": "^6.0.3",
"mobx-react-lite": "^3.1.5"

[mweststrate]

This means you are not calling configure soon enough. Note that import statements of observable using modules will already execute the module body, so you might need to reorder your configure and import statements a bit more, or make sure that your top level statements don't initialize observables yet.The stack trace should reveal where you are trying to create an observable array .

[filipengberg]

You’re absolutely right, My store containing observables was initialized when imported which caused the code to run before configure. I refactored my store to be initialized later and now it works!

Thanks a lot for pointing me in the right direction and sorry for creating a false bug report! 🙂

[vertic4l]

We've called configure soon enough, but this stopped working in IE11 and we don't know why.

[vertic4l]

Moving import of mobx + configure at the very beginning of the file seems to help.