react-json-editor-ajrm is not letting code to work on IE

[vikasrohit]

We are facing issue with ES5/ES6 syntaxes for the react-json-editor-ajrm library specially on IE browser. For now we have remove the reference to the library for the 2.4.9 release, however, we need to fix it for IE as well.

[vikasrohit]

fyi @maxceem @RishiRajSahu

[vikasrohit]

@maxceem do you think we can get it fixed without patching the target repo?

[maxceem]

@vikasrohit I think we should be able to fix it our side.

We can add some special configuration to the babel same like we did for CoffeeScript files https://github.com/appirio-tech/connect-app/blob/feature/form-redesign/config/babel/webpack-coffee.js#L1 and target this configuration only to the react-json-editor-ajrm lib, simillar way like we do it for CoffeeScript files https://github.com/appirio-tech/connect-app/blob/feature/form-redesign/config/webpack/common.js#L49-L70

This lib has two versions: precompiled react-json-editor-ajrm/index.js and ES react-json-editor-ajrm/es/index.js.
So we can try either compile it from the ES version or compile it from the precompiled version whcih suppose to let write smaller config.

This is general idea, I'm not sure if there are any particular obsticles but from my point of view there shouldn't be any.

[vikasrohit]

This lib has two versions: precompiled react-json-editor-ajrm/index.js and ES react-json-editor-ajrm/es/index.js.

Yep, I noticed that as well when first time used this library and I was under impression that it works as it says, however, to me it seems like it is not working as said. react-json-editor-ajrm/index.js is using ES 6 version, otherwise we wouldn't have seen this issue. I created an issue in the repo, however, as there is no maintainer of the library it is stuck for now.

[vikasrohit]

Lets try to get it fixed via community fix challenge and if we don't find any solution, I would start looking at some other library.

[vikasrohit]

@maxceem I found another library which seems promising to me as this was something I was looking when I started but was not able to find it at that time. :)

[maxceem]

@vikasrohit I think it's a good idea to change it. As the current library has some issues, and from the preliminary research it could be quite hard to fix them, and most likely we will need to fix the source code of the lib.

The lib you point looks interesting as it's based on existent non-React lib, which seems popular.

I guess we even don't have to choose between React only libs. Most likely we will be abel to integrate a regular js lib to react as per our needs.

[maxceem]

Also, I think as such a lib could be quite heavy, probably we should build it to a separate file and load it only on the /metadata pages.

[maxceem]

Btw, React 16.6.0 has a new feature for code splitting React.lazy and Suspense https://reactjs.org/docs/code-splitting.html#reactlazy. But to use it we would have to update.
So we can do it the old way for now using babel and import.

[vikasrohit]

React.lazy sounds promising. We can try upgrading our react as separate parallel efforts and lets see how it goes.

[vikasrohit]

Also, I think as such a lib could be quite heavy, probably we should build it to a separate file and load it only on the /metadata pages.

Can we do it without React upgrade?

[maxceem]

Can we do it without React upgrade?

Yes, we can use import dynamically with some webpack/babel plugin/config.

[vikasrohit]

@maxceem Just for information, found an update from the react-json-editor-ajrm library for importing the library in ES5 mode.

Closing the issue as we are moving on with new library https://github.com/vankop/jsoneditor-react