@mantine/form use-form-status.ts: When determining the dirty state, getting a snapshot value by path throws a TypeError

[SebastianSimon]

Dependencies check up

• I have verified that I use latest version of all @mantine/* packages

What version of @mantine/* packages do you have in package.json?

7.12.1

What package has an issue?

@mantine/form

What framework do you use?

Next.js

In which browsers you can reproduce the issue?

All

Describe the bug

The commit 73827b3 introduced a bug in packages/@mantine/form/src/hooks/use-form-status/use-form-status.ts. The following line passes the values snapshot to packages/@mantine/form/src/paths/get-path.ts:

const dirty = !isEqual(getPath(path, $values.getValuesSnapshot()), value);

In get-path.ts, this line can fail with a TypeError (value is null):

value = value[splittedPath[i]];

This happens when the form values contain a nullable object and then e.g. form.setFieldValue is used to set a value for a path that refers to a field nested within the object that was previously null. Setting the value itself works (form.values is set correctly), but the comparison to the “values snapshot” fails because the path cannot be resolved to a value.

If possible, include a link to a codesandbox with a minimal reproduction

https://codesandbox.io/p/sandbox/mantine-react-template-forked-26rn7w

Possible fix

In get-path.ts, this if statement only checks if value is undefined but should probably also check for null.

if (value === undefined) {
  break;
}

Self-service

• I would be willing to implement a fix for this issue

[rtivital]

Fixed in 7.12.2