New modern UI document library: headerFormatter broken for person columns

[XueSheng-GIT]

Target SharePoint environment

SharePoint Online

What SharePoint development model, framework, SDK or API is this about?

not applicable

Developer environment

None

What browser(s) / client(s) have you tested

• 💥 Internet Explorer
• 💥 Microsoft Edge
• 💥 Google Chrome
• 💥 FireFox
• 💥 Safari
• mobile (iOS/iPadOS)
• mobile (Android)
• not applicable
• other (enter in the "Additional environment details" area below)

Additional environment details

• Chrome 135

Describe the bug / error

Group headers are broken for new modern ui in document libraries if a json view with headerFormatter (groupProps) is used for person columns (easiest way to reproduce is to set the grouping for a person field to expanded in the view settings).

Screenshot of broken group header:

Steps to reproduce

1. Create a document library
2. Add a files to it
3. Add custom json view (see view formatting below)
4. Goto view setting and enable grouping for creator (or any other person field) with expanded group (see screenshot below)
5. Reload page and see broken group header [object Object] instead of person name

View formatting:

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/row-formatting.schema.json",
  "groupProps": {
    "headerFormatter": {
      "elmType": "div",
      "txtContent": "@group.fieldData.displayValue"
    }
  },
  "rowFormatter": {
    "elmType": "div",
    "style": {
      "height": "100%"
    },
    "txtContent": "[$FileLeafRef]"
  }
}

View Settings (Grouping):

Expected behavior

Name of person (value of @group.fieldData.displayValue) should be shown as Group header instead of [object Object].

[Ashlesha-MSFT]

Hello @XueSheng-GIT,
Thank you for bringing this issue to our attention. We will look into it and get back to you shortly.

[Amey-MSFT]

Hello @XueSheng-GIT,
We were able to reproduce the issue, and we are investigating it. We have logged this as a bug, and our engineering team will look into it.
Thank you!

[Ashlesha-MSFT]

@XueSheng-GIT ,
Please check, The current behavior appears to be working as expected with expanded grouping on person fields.

Thanks!

[XueSheng-GIT]

@Ashlesha-MSFT thanks for having another look at this issue. It still persists as initially described.
Your screenshot seems to show a regular view with grouping (but without json customization).
Can you add the following view formatting?

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/row-formatting.schema.json",
  "groupProps": {
    "headerFormatter": {
      "elmType": "div",
      "txtContent": "@group.fieldData.displayValue"
    }
  },
  "rowFormatter": {
    "elmType": "div",
    "style": {
      "height": "100%"
    },
    "txtContent": "[$FileLeafRef]"
  }
}

Even if the groups are display correctly on page load, the group names will break after opening/closing of multiple groups.

[Ashlesha-MSFT]

@XueSheng-GIT,

Thanks for correcting.

You can resolve this by using @group.fieldData.title instead of @group.fieldData.displayValue for person columns:

 {
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/row-formatting.schema.json",
  "groupProps": {
    "headerFormatter": {
      "elmType": "div",
      "txtContent": "@group.fieldData.title"
    }
  },
  "rowFormatter": {
    "elmType": "div",
    "style": {
      "height": "100%"
    },
    "txtContent": "[$FileLeafRef]"
  }
}

As given in doc

Please let me know if this resolves the issue for you.

Hope this helps!

[XueSheng-GIT]

@Ashlesha-MSFT that's a good hint! This seems to solve the specific issue for person columns.

The general issue I still see is if I want to add a (generic) custom group header and users are allowed to define their own grouping, it will be hard to cover those different column requirements. It doesn't seem to be possible to check if the displayed grouping is based on a person column or some other kind of column (at least a check for availability of title does not seem to be possible).
A hint would be great how to cover this general scenario.

Anyways, I'm closing this specific issue as resolved.