List Formatting - Files can no longer be previewed using filepreview

[tecchan1107]

Target SharePoint environment

SharePoint Online

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

Declarative list formatting

Developer environment

Windows

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

• [ ] 💥 Internet Explorer
• [X] 💥 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

• browser version 101.0.1210.53

Describe the bug / error

Using List Formatting's filepreview, I created a card that previews the following files.

This file preview card was previewing files correctly until yesterday, but when I looked at it today, it no longer previews files. The code is unchanged between yesterday and today.

Is this a bug?

Steps to reproduce

1. Open site pages or document library
2. Create a column of any name and type

3. Click on the column header of the created column
4. Hover Column Settings
5. Click Format this column
6. Click Advanced mode
7. Paste the JSON from the following into the text box
8. Click Save

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
  "elmType": "div",
  "children": [
    {
      "elmType": "div",
      "style": {
        "border-radius": "50%",
        "cursor": "pointer",
        "font-size": "15px",
        "width": "27px",
        "height": "27px",
        "display": "flex",
        "justify-content": "center",
        "align-items": "center",
        "font-weight": "bold"
      },
      "attributes": {
        "class": "ms-bgColor-themeLighter ms-bgColor-themePrimary--hover ms-fontColor-neutralPrimary ms-fontColor-white--hover",
        "iconName": "View"
      },
      "customCardProps": {
        "openOnEvent": "click",
        "directionalHint": "rightCenter",
        "isBeakVisible": true,
        "formatter": {
          "elmType": "filepreview",
          "attributes": {
            "src": "=if([$File_x0020_Type] == '' || [$File_x0020_Type] == 'aspx' || [$File_x0020_Type] == 'pdf', [$FileRef] , if([$File_x0020_Type] == 'docx' || [$File_x0020_Type] == 'dotx' || [$File_x0020_Type] == 'dotm' || [$File_x0020_Type] == 'docm' || [$File_x0020_Type] == 'docb' || [$File_x0020_Type] == 'pptx' || [$File_x0020_Type] == 'pptm' || [$File_x0020_Type] == 'potx' || [$File_x0020_Type] == 'potm' || [$File_x0020_Type] == 'ppam' || [$File_x0020_Type] == 'ppsx' || [$File_x0020_Type] == 'ppsm' || [$File_x0020_Type] == 'sldx' || [$File_x0020_Type] == 'sldm' || [$File_x0020_Type] == 'vsdx' || [$File_x0020_Type] == 'xlsx' || [$File_x0020_Type] == 'xlsm' || [$File_x0020_Type] == 'xltx' || [$File_x0020_Type] == 'xltm', @currentWeb +'/_layouts/15/WopiFrame.aspx?sourcedoc=' + [$FileRef] + '&action=view' , @currentWeb +'/_layouts/15/embed.aspx?UniqueId=' + [$UniqueId] + '&client_id=FileViewerWebPart&showNewWindow=true&embed={\"af\":false,\"p\":1,\"z\":\"width\"}&auth=readwrite'))"
          },
          "style": {
            "width": "= @window.innerWidth * 0.5 + 'px'",
            "height": "= @window.innerHeight * 0.8 + 'px'"
          },
          "filePreviewProps": {
            "brandTypeIconStyle": {
              "display": "none"
            }
          }
        }
      }
    }
  ]
}

Expected behavior

Files are previewed on the card.

[ghost]

Thank you for reporting this issue. We will be triaging your incoming issue as soon as possible.

[PzKfWg]

I can confirm on my end the bug.

[anandragav]

I can confirm that this bug exists on my end as well

[joshua-probst]

Can confirm that this bug exists on my end as well. Tried it on following browsers:

• [x] 💥 Microsoft Edge
• [x] 💥 Google Chrome
• [x] 💥 FireFox

[shagra-ms]

@tecchan1107 Thank you for reporting this.

filepreview supports showing thumbnails of files in document library. The element itself gives some out of the box functionalities as a fallback in case the thumbnail fails to load.

The usage above is unsupported. While we understand the power of the scenario above, and various others shared by the community, we want to enable it post due diligence and security review.

We are working to enable such scenarios and would share an update as soon as we make progress there.

[aaclage]

Thank you @shagra-ms for the feedback, understand the concerns and was also surprise with content access, hope in the future some type of whitelist url's can be provided after msft security validation or other type of approach that can improve the user experience.

[tecchan1107]

Thank you for your response @shagra-ms 🙏✨

I think it would be very useful and helpful if this were to become available in the future!!! I look forward to the day when I can use this.

Once again, thanks for all your thoughtful answers! I will close this issue.

[Fedes365]

Thanks @shagra-ms for your feedback. I would like to highlight that I shared iframes on LinkedIn as an experimental usage of @thumbnail (here and here), because this is not documented. While performing my testing about this hypothetical feature, some thoughts and doubts popped into my mind:

1) Service workload: are Microsoft IT Guys happy about a ridiculous amount of WopiFrame and TokenFrameFactory requests/replies generated per second all around the world?

2) Security: given that iframes work about X-FRAME options setup (as far as I know), what if I embed a compromised external website?

And your feedback seems to confirm my doubts. Thanks again.

[ghost]

Issues that have been closed & had no follow-up activity for at least 7 days are automatically locked. Please refer to our wiki for more details, including how to remediate this action if you feel this was done prematurely or in error: Issue List: Our approach to locked issues