Truenas 24.10 UI Error: "TypeError: Cannot read properties of undefined (reading 'usage')"

Agrarvolution · January 6, 2025, 6:33pm

I updated my main NAS from 24.04.2.5 to 24.10.1 today.
Opening the UI, the homescreen displays a lot of blank reporting elements. Reports for CPU and pools are empty.

After looking in the browser dev tools, I saw that some Javascript function that processes the websocket data throws following error:

TypeError: Cannot read properties of undefined (reading 'usage')
    at e.parseCpuData (cpu-core-bar.component.ts:121:32)
    at Object.computation (cpu-core-bar.component.ts:38:23)
    at Object.producerRecomputeValue (signals.mjs:375:25)
    at PW (signals.mjs:131:8)
[... callstack goes on for a lot longer ...]

When stopping the script at line 121 in this component, I see following object:

cpuData Object

cpuData: {
    "0": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 100,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "1": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 99,
        "iowait": 1,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "2": {
        "user": 0,
        "nice": 0,
        "system": 1,
        "idle": 99,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 1
    },
    "3": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 100,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "4": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 100,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "5": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 100,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "6": {
        "user": 0,
        "nice": 0,
        "system": 0.990099,
        "idle": 99.009901,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0.9900990000000007
    },
    "7": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 100,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "8": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 100,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "9": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 100,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "10": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 100,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "11": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 100,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "12": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 100,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "13": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 100,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "14": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 100,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "15": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 100,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "16": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 100,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "17": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 100,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "18": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 100,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "19": {
        "user": 0,
        "nice": 0,
        "system": 0,
        "idle": 100,
        "iowait": 0,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0
    },
    "average": {
        "user": 0,
        "nice": 0.05,
        "system": 0.2,
        "idle": 99.65,
        "iowait": 0.1,
        "irq": 0,
        "softirq": 0,
        "steal": 0,
        "guest": 0,
        "guest_nice": 0,
        "usage": 0.24999999999999434
    },
    "temperature_celsius": {
        "0": 29,
        "1": 30,
        "2": 29,
        "3": 30,
        "4": 30,
        "5": 27,
        "6": 27,
        "7": 28,
        "8": 28,
        "9": 28,
        "10": 30,
        "11": 31,
        "12": 30,
        "13": 30
    }
}

I couldn’t find out how this object could be empty, when used like this int he code (marked in bold is the part that causes the issue):

const usageCore = this.hyperthread()
        ? **(cpuData[usageIndex].usage** + cpuData[usageIndex + 1].usage).toFixed(1)
        : cpuData[usageIndex].usage.toFixed(1);

What could cause this? I just get a blank screen for these parts in the main UI.

This error also happens in combination with this one:

error-handler.service.ts:72 
 POST https://sentry.ixsystems.com/api/4/store/?sentry_key=7ac3e76…&sentry_version=7 net::ERR_CONNECTION_RESET

I have a second TrueNAS machine with a fresh install of 24.10. There these reports just work as intended.

Captain_Morgan · January 7, 2025, 1:42am

Reboot TrueNAS and refresh your browser… what persists?

Agrarvolution · January 7, 2025, 10:48am

I forgot to add, when I wrote this topic: When I saw that I immediately restarted the server and it didn’t change.

I have now restarted the client pc (over night) and when accessing the page with the browser, this still occurs.

I didn’t notice this error message occur yesterday:
dashboard:1 Access to fetch at 'https://sentry.ixsystems.com/api/4/store/?sentry_key=7ac3e76fe2a94f77a58e1c38ea6b42d9&sentry_version=7' from origin 'https://nas.agrarvolution.at' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

I tried making a conditional breakpoint in the JS, but it doesn’t really seem to work for this.

This server had something similar happen in the report view a year ago when the BIOS time didn’t match the system time and then the temperature views for all HDD drives in the system were empty even though I could read them with smartctl. This part works luckily enough.

Agrarvolution · January 7, 2025, 12:52pm

Additionally I a browser with uBlock - but this also occurs on another browser without any plugins.

Captain_Morgan · January 7, 2025, 11:06pm

No-one else is reporting a similar issue, so we should assume its something unique about the system.

I don’t know what it could be, but do check BIOS time.

Agrarvolution · January 8, 2025, 12:31am

I think I know why now and why other aren’t reporting it.

I’m using one of these new fangled Intel CPUs with efficiency cores. So the CPU doesn’t neatly multiply by 2 for thread count.

    for (let i = 0; i < this.coreCount(); i++) {
      const usageIndex = this.hyperthread() ? i * 2 : i;

      const usageCore = this.hyperthread()
        ? (cpuData[usageIndex].usage + cpuData[usageIndex + 1].usage).toFixed(1)
        : cpuData[usageIndex].usage.toFixed(1);

      usageColumn.push(parseInt(usageCore));

      if (cpuData.temperature_celsius) {
        temperatureColumn.push(parseInt(cpuData.temperature_celsius[i].toFixed(0)));
      }
    }

The code assumes, that if there is hyperthreading available for a PCU, every core must have it.
I logged all values usageIndex works for:

Past 20 are missing, cause it is out of bounds for my CPU data at this point and it goes into the error routine.

This explains why it was working on my other server, since that one uses a standard hyperthreaded CPU.

Why is there even such a complex system using coreCount() and hyperthread(), when the length of the CPU diagnostics data is already available?

Or maybe this check should be by core and not checking if hyperthreading exists in general on the CPU?

protected hyperthread = computed(() => this.sysInfo().cores !== this.sysInfo().physical_cores);

Certainly a niche issue, but I doubt I’m the only one running CPUs with efficiency cores.

Edit: Considering pool data not showing - this is my bad, I just had to click them again and comfirm and now they work.

Scripted · January 8, 2025, 12:49am

I have this issue on a fresh install of fangtooth except I have more widgets that are broken. CPU Memory and system information. Also see the same error messages.

Captain_Morgan · January 8, 2025, 12:54am

If you have found the issue, please report a bug and then leave the NAS ticket number here.

Bug seems to have been fixed today and will be in 24.10.2

github.com/truenas/webui

NAS-133128 / 24.10.2 / Simplify CPU widget logic

truenas:stable/electriceel ← truenas:NAS-133128

opened 12:17AM - 08 Jan 25 UTC

undsoft

+16 -36

**Changes:** Previous UI code assumes that if hyperthreading is enabled, than… there must be 2 threads per core. This is not the case for newer CPUs that have performance and efficiency cores. In Intel processors efficiency cores are single-threaded. This PR simplifies the logic to just showing what middleware sends us. **Testing:** Test CPU widgets for regressions. You can also use mock data from the ticket in `WidgetResourcesService`.

Agrarvolution · January 8, 2025, 7:40am

The issue already exists here:
https://ixsystems.atlassian.net/browse/NAS-133128

I’m curious if that fix will go through. It seems to change a lot more than just the issue, but I’m not aware of the code practices for the UI.

No-one else is reporting a similar issue, so we should assume its something unique about the system.

This kind of reminds me of the classic car mechanic comment, that they’ll never seen item-X break.