Error on Fraction.js dependency

[cleversonmv]

error on start:

Uncaught TypeError: Cannot set properties of undefined (setting 'type')
at push../node_modules/mathjs/lib/esm/type/fraction/Fraction.js.Object.isClass (Fraction.js:9:1)
at assertAndCreate (factory.js:35:1)
at ./node_modules/mathjs/lib/esm/entry/pureFunctionsAny.generated.js (pureFunctionsAny.generated.js:62:1)

[danny237]

Same here.

[josdejong]

There is probably something breaking introduced in the latest version of Fraction.js, [email protected], which was released less than 1 day ago.

https://www.npmjs.com/package/fraction.js?activeTab=versions

To work around it you can probably explicitly install [email protected] (not tested).

[cleversonmv]

There is probably something breaking introduced in the latest version of Fraction.js, [email protected], which was released less than 1 day ago.

https://www.npmjs.com/package/fraction.js?activeTab=versions

To work around it you can probably explicitly install [email protected] (not tested).

not work too ,
I tested several versions and it didn't work

[josdejong]

Can you try v4.2.0? That is where mathjs is last tested with.

@infusion can it be that version 4.3.0 or 4.3.1 contain breaking changes? (in that case I would have expected a v5.0.0 release)

[ai-rohit]

There is probably something breaking introduced in the latest version of Fraction.js, [email protected], which was released less than 1 day ago.
https://www.npmjs.com/package/fraction.js?activeTab=versions
To work around it you can probably explicitly install [email protected] (not tested).

not work too , I tested several versions and it didn't work

I downgraded the mathjs version which worked for me.

[infusion]

Hi, v4.3.0 was not supposed to have breaking changes. I'm looking into what the problem is, I changed the import/require behavior only slightly and tested it. But I somehow missed something

[josdejong]

I'm not yet able to reproduce an issue with [email protected], not sure yet what is going on.

[infusion]

Me neither, just installed math.js freshly here on my machine and everything seems to work

[cleversonmv]

There is probably something breaking introduced in the latest version of Fraction.js, [email protected], which was released less than 1 day ago.
https://www.npmjs.com/package/fraction.js?activeTab=versions
To work around it you can probably explicitly install [email protected] (not tested).

not work too , I tested several versions and it didn't work

I downgraded the mathjs version which worked for me.

Which version?

[cleversonmv]

i tried with all verisons:
[4.3.1][4.3.0][4.2.1][4.2.0][4.1.3][4.1.2][4.1.1][4.1.0]

[infusion]

The change occurred in 4.3.0, I then had to fix a minor thing that resulted in 4.3.1. Anyway, what is your environment? What is your node version? I downgraded even to node 16 and it works just fine for me.

[josdejong]

It may help to throw away your package-lock.json and node_modules folder and do a fresh install.

[infusion]

I reverted the change. Hope that helps with 4.3.2

[infusion]

I have to dig a little deeper into what's going on here. But the package-lock could definitely be a problem!

[ai-rohit]

There is probably something breaking introduced in the latest version of Fraction.js, [email protected], which was released less than 1 day ago.
https://www.npmjs.com/package/fraction.js?activeTab=versions
To work around it you can probably explicitly install [email protected] (not tested).

not work too , I tested several versions and it didn't work

I downgraded the mathjs version which worked for me.

Which version?

We were using 6.2.5 previously. So went back to it from v9... I tried downgrading to 7.0.0 and 8.0.0 but didnt work in both.

[infusion]

is it now working again?

[ai-rohit]

"mathjs": "^9.4.4",
"fraction.js": "4.2.0"

Node version: 18.16.0

Deleted node_modules and yarn.lock and did install again. Still getting the error.

Uncaught TypeError: Cannot set properties of undefined (setting 'type')
at push../node_modules/mathjs/lib/esm/type/fraction/Fraction.js.Object.isClass (Fraction.js:9:1)
at assertAndCreate (factory.js:35:1)
at ./node_modules/mathjs/lib/esm/entry/pureFunctionsAny.generated.js (pureFunctionsAny.generated.js:63:1)
at webpack_require (bootstrap:853:1)
at fn (bootstrap:150:1)
at ./node_modules/mathjs/lib/esm/entry/mainAny.js (mainAny.js:1:1)

[infusion]

Even with fraction 4.2.0? This version is quite dated and had no problems. I introduced this problem probably yesterday with my ESM module change.

[ai-rohit]

However when I bump mathjs version to the latest one. I get the following error.

Fraction.js:9 Uncaught TypeError: Object.defineProperty called on non-object
at Function.defineProperty ()
at push../node_modules/mathjs/lib/esm/type/fraction/Fraction.js.Object.isClass (Fraction.js:9:1)
at assertAndCreate (factory.js:35:1)
at ./node_modules/mathjs/lib/esm/entry/pureFunctionsAny.generated.js (pureFunctionsAny.generated.js:22:1)
at webpack_require (bootstrap:853:1)
at fn (bootstrap:150:1)
at ./node_modules/mathjs/lib/esm/entry/mainAny.js (mainAny.js:1:1)

[infusion]

even with a fresh install?

[ai-rohit]

even with a fresh install?

Yes. deleted node_modules, yarn.lock then installed.

[YuXueBJ]

I have the same problem
"mathjs": "11.5.0",
"fraction.js": "^4.2.0"

"resolutions": {
"fraction.js": "^4.2.0"
}�

[YangBo29]

please lock fraction.js version 4.2.0

[Nagrom33]

Struggle with the same problem i'm using node v 16.3

I have saved an old node_modules folder when i use this folder it runs good looked the versions i used there:

  "name": "mathjs",
  "version": "9.5.2",
  
      "fraction.js": "^4.1.1",

But when I change those in my package.json and remove package-lock.json, node_modules, and removed npm cache --force

Then run npm install, and getting the same error:

TypeError: fraction_js__WEBPACK_IMPORTED_MODULE_0__.prototype is undefined
    createFractionClass Fraction.js:9
    assertAndCreate factory.js:35
    js pureFunctionsAny.generated.js:62
    factory react refresh:6
    Webpack 31
lockdown-install.js:1:103865
    functors moz-extension://005fd067-6eb1-4869-9edd-f11ce4c7ac9a/lockdown-install.js:1
    (Async: EventListener.handleEvent)
    functors moz-extension://005fd067-6eb1-4869-9edd-f11ce4c7ac9a/lockdown-install.js:1
    repairIntrinsics moz-extension://005fd067-6eb1-4869-9edd-f11ce4c7ac9a/lockdown-install.js:1
    functors moz-extension://005fd067-6eb1-4869-9edd-f11ce4c7ac9a/lockdown-install.js:1
    <anonymous> moz-extension://005fd067-6eb1-4869-9edd-f11ce4c7ac9a/lockdown-run.js:4
    ```

[infusion]

I also reverted the changes in package.json. 4.3.3 is now the same as 4.2.0. Could anyone please check who has the same problem?

[josdejong]

Thanks Robert.

I'm just publishing a new version of mathjs that locks [email protected], I hope that will temporarily solve this issue.

I still have to figure out how to reproduce this issue in the first place. Seems related to [email protected] in combination with Webpack.

[infusion]

Could we run the test without fixing the version please? Otherwise we will gain no info on how to solve this issue in the long run.

[josdejong]

Ok we can wait for a bit more, but I prefer not to wait for too long (possibly exposing more and more people to the problem).

Even when the workaround is published we can still ask someone to test with [email protected] and [email protected], right?

[infusion]

Definitely, but as I said, 4.3.3 should be the same as 4.2.0. So hopefully it is fixed anyway for those people. Do you think it's a webpack problem?

BTW Sorry for introducing this issue.

[Nagrom33]

Sorry my bad.. try it again...

[josdejong]

@Nagrom33 thanks for testing, please let us know if [email protected] with [email protected] solves the issue. I've not yet published [email protected] (locking [email protected]).

[josdejong]

Definitely, but as I said, 4.3.3 should be the same as 4.2.0. So hopefully it is fixed anyway for those people. Do you think it's a webpack problem?

I haven't managed to reproduce the problem myself, but the error reports all mention Webpack so that is probably related or at least a way to reproduce the issue. To figure out what is wrong and fix it for real we will need to get some Webpack setup that reproduces the issue with [email protected] I think.

[Nagrom33]

Tried package.json:

• "mathjs": "^11.10.0",
• "fraction.js": "^4.3.3"

Checked my node_modules folder "/node_modules/fraction.js/package.json" it said

{
  "name": "fraction.js",
  "title": "fraction.js",
  "version": "4.3.3",

But getting the same error:

TypeError: "/react/static/media/fraction.5d669f929ffae73460c8.cjs" is not a non-null object
    createFractionClass Fraction.js:9
    assertAndCreate factory.js:35
    js pureFunctionsAny.generated.js:22
    factory react refresh:6
    Webpack 31
lockdown-install.js:1:103865

[infusion]

So webpack has a problem with the .cjs filename then?

[josdejong]

@Nagrom33 thanks that is useful info. What version of Webpack are you using? Would it be possible for you to put together an empty webpack project with mathjs and fraction.js that reproduces the issue so we can do debugging on it?

[infusion]

I renamed the cjs file to an ordinary js file again in 4.3.4

[josdejong]

So webpack has a problem with the .cjs filename then?

Yeah maybe that's it. Maybe related to this open issue: facebook/create-react-app#12700

[Nagrom33]

@Nagrom33 thanks that is useful info. What version of Webpack are you using? Would it be possible for you to put together an empty webpack project with mathjs and fraction.js that reproduces the issue so we can do debugging on it?

I used react create app: "react-scripts": "^5.0.1"

[josdejong]

@infusion I managed to reproduce the issue in a plain create-react-app project, see: https://github.com/josdejong/test-mathjs-issue-3022

The issue is indeed fixed with [email protected].

[Nagrom33]

@infusion I managed to reproduce the issue in a plain create-react-app project, see: https://github.com/josdejong/test-mathjs-issue-3022

The issue is indeed fixed with [email protected].

Thanks @josdejong !

This works for me!

• Step 1: rm -rf package-lock.json && rm -rf yarn.lock && rm -rf node_modules/
• Step 2: npm cache clean --force
• Step 3: npm install [email protected]
• Step 4: npm install
• Step 5: npm run start

Maybe to many steps and not all needed but, the problem is solved!!

[josdejong]

I've now published [email protected] with fraction.js@^4.3.4.

[infusion]

The problem with the renaming I see is this: As soon as you give the package a type: "module" in the package.json, it is a ESM package, requiring .js files to act like a module. To give backwards compatibility, you can give files the .cjs extension. Since the fraction.js file already exports both, ESM and CommonJS, I tried around to not duplicate the file. The way it worked was giving both ESM and CommonJS the .cjs file, which works great. However, webpack seems to have a problem with that. Maybe we have to ship a 100% copy of fraction.js as fraction.cjs.

[josdejong]

Ah ok. That sort of makes sense. But I guess the ESM and CommonJS versions cannot be the same, since ESM needs to use export and CommonJS needs to use module.exports?

BTW Sorry for introducing this issue.

I don't blame you at all. The JavaScript ecosystem is just extremely complex for library developers. Having to deal with various ways that you can configure package.json, dealing with CommonJS, ESM, TypeScript, different browsers, different versions of node.js, a lot of different bundlers like Vite, Rollup, Webpack, various CDN's, and things like the deprecated and outdated but widely used create-react-app many people being stuck on old versions of Webpack, etc 🤯

[infusion]

You don't need to use export explicitly. I learned from babel back then that you only need to define some attributes, which I do at the end of the file. This way fraction.js was already working as an ESM module for ages, but it is not really an ESM module since the new type: "module" attribute was missing.

[josdejong]

O I didn't know that. Good to know.

[infusion]

Basically, what you have to do to supoort both, is exporting like this:

    Object.defineProperty(exports, "__esModule", { 'value': true });
    exports['default'] = Fraction; // Default ESM
    module['exports'] = Fraction; // CommonJS

[josdejong]

I have indeed seen that construct before. It feels a bit hacky but if it works it works :). Thanks for sharing.

@infusion shall I close this issue? I think the cause is clear and the issue is fixed in the latest version of fraction.js.

[infusion]

I was tinkering with your test repo. The problem is indeed this hacky solution. It seems webpack scans for an export and does not like a module definition without it. I have the problematic 4.3.1 now running locally within your test setup.

Yes I think we can close this issue.