v1.0.1 - TypeError: can't access property "toFixed", value is undefined

[jaysin586]

Describe the bug

The issue is that when first loading sometimes the variables are undefined or null, and this is expecting it to always be a number.

Reproduction

This has to do with ShadCn. Here you go!

https://stackblitz.com/~/github.com/jaysin586/paneforge-1.0.1-issue

Logs

System Info

System:
    OS: macOS 15.5
    CPU: (20) x64 Intel(R) Core(TM) i9-10910 CPU @ 3.60GHz
    Memory: 6.13 GB / 128.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.17.1 - ~/.volta/tools/image/node/22.17.1/bin/node
    Yarn: 1.22.22 - ~/.volta/bin/yarn
    npm: 10.9.2 - ~/.volta/tools/image/node/22.17.1/bin/npm
    pnpm: 10.6.1 - ~/Library/pnpm/pnpm
  Browsers:
    Chrome: 138.0.7204.169
    Safari: 18.5
  npmPackages:
    @sveltejs/kit: 2.26.1 => 2.26.1 
    paneforge: 1.0.1 => 1.0.1 
    svelte: 5.37.1 => 5.37.1

Severity

blocking an upgrade

[DarthGigi]

+1

[jaysin586]

@huntabyte I am willing to fix this and to set up test cases for it. I believe you are attempting to work with vitest ui correct? I am willing to learn it if necessary :) Just give me the green light and I will take it on.

[mhkeller]

The issue is with this line:

paneforge/packages/paneforge/src/lib/internal/utils/compare.ts

Line 48 in 3c6dd6c

return Number.parseFloat(value.toFixed(decimals));

The addition of areNumbersAlmostEqual in https://github.com/svecosystem/paneforge/pull/84/files is causing the issue because the values being passed in are not always numbers, as OP pointed out.

I'm guessing the culprit is paneSize? A possible fix could be checking if that variable is null/undefined inside of isPaneCollapsed and if so, maybe it's safe to assume the pane is collapsed so the isPaneCollapsed function returns true? Pinging @reinhard-sanz

[phlorian]

As a workaround I removed the collapsible attribute from ResizablePane until this is fixed. No more exception, but the collapsible feature is gone. OK for me for now.

[reinhard-sanz]

Sorry, didn't intend to cause this bug with my PR. I assumed the paneSize and collapsedSize are alway numbers because the typing states they are. 😅

As @mhkeller pointed out it's a rather easy fix and putting something like this before the areNumberAlmostEqual should fix the issue:

// On init the value may be undefined, so we need to check for that
if (typeof paneSize !== 'number' || typeof collapsedSize !== 'number') return false;

Edit: Added a very quick PR that addresses this issue.

[jaysin586]

@reinhard-sanz I think the issue is less about the fact an issue happened... oversights happen all the time, and more along the lines of this is used inside ShadCN which has a ton of eyes on it, and it was not caught in a test 🥰

[mhkeller]

Ya in addition to tests, I think the types aren't correct. paneSize can clearly be undefined or null (probably because this.layout has a problem) even though its type is a number. But even if that type were corrected to number | undefined, which would have thrown an obvious TS error and prevented the issue, the type of paneSize in isPaneCollapsed is any.

But, the only test on this package is the following, so definitely room for improvement there, too.

import { expect, it } from "vitest";

it("should work", () => {
	expect(1 + 1).toBe(2);
});