TypeError: Failed to fetch at c when trying to attach files in SPFx

[Anitha-1997]

Target SharePoint environment

SharePoint Online

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

💥 SharePoint Framework

Developer environment

Windows

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

• browser version - 124.0.6367.61(chrome version)
• SPFx version - SharePoint Online 1.18.2
• Node.js version - v18.20.0

Describe the bug / error

I have deployed the solution in prod. Attachments are failing to get uploaded to sharepoint from deployed spfx solution. It works properly in most of the scenario. But some users are getting an issue. Attachments doesn't seems to get attached. And it provides a log as below:

TypeError: Failed to fetch
at c (https://publiccdn.sharepointonline.com/dummysitename.sharepoint.com/sites/AppStore/ClientSideAssets/f25c455d-16ce-453c-8f3f-538e4eaf03c3/biz-ops-app-webpart-web-part_d477373f36853ac282e0.js:2:1171724)
at c (https://publiccdn.sharepointonline.com/dummysitename.sharepoint.com/sites/AppStore/ClientSideAssets/f25c455d-16ce-453c-8f3f-538e4eaf03c3/biz-ops-app-webpart-web-part_d477373f36853ac282e0.js:2:1171803)
at async https://publiccdn.sharepointonline.com/dummysitename.sharepoint.com/sites/AppStore/ClientSideAssets/f25c455d-16ce-453c-8f3f-538e4eaf03c3/biz-ops-app-webpart-web-part_d477373f36853ac282e0.js:2:1168482

Steps to reproduce

Here is the code I'm running,

const newProjectVariation: IItemAddResult = await sp.web.lists
.getByTitle("DC-SS-ProjectVariations")
.items.add(newVariationProject);
try {
const item: IItem = sp.web.lists
.getByTitle("DC-SS-ProjectVariations")
.items.getById(newProjectVariation?.data?.Id);
 for (let i = 0; i < values.attachedFiles.length; i++) {
    const file = values.attachedFiles[i];
    await item.attachmentFiles.add(file.name, file);
  }
} catch (err) {
  await sp.web.lists.getByTitle("DC-SS-Logs").items.add({
    Title: err.message,
    LogType: "Error",
    CodeFileName: "ProjectVariationServices",
    MethodName: "createSubmitProjectVariation/fetch-data",
    StackTrace: err.stack,
    AffectedUserId: userID,
    Response: err?.response?.url,
    Status: err.status,
    StatusText: err.statusText,
  });
  throw new Error(err);
}

Expected behavior

I'm trying to create a new item in list and if there are any attachments added to a formik form, I am updating that item with the attachments in sharepoint using pnp/sp.

[mkm17]

Hi @Anitha-1997, Unfortunately, it would be impossible to get the exact error from the presented log. Could you share the information that you store in the Logs list?

If you mentioned that only some of the users have this issue, maybe it is related to SharePoint List Item size limits. https://learn.microsoft.com/en-us/office365/servicedescriptions/sharepoint-online-service-description/sharepoint-online-limits#file-size-and-file-path-length .

[Anitha-1997]

Hi @mkm17 , exact error doesn't seem to be captured anywhere, the error message received is quite vague and doesn't provide a clear picture into what the real issue is. Here is a screenshot of log

File sizes uploaded are mostly in Kbs. And attachment is getting added when we edit and upload it again using the same user.

[mkm17]

Hi @Anitha-1997, Thank you for the print screen. In the list item, it looks like the error is caused by another section of the code.

	Code	Printscreen
MethodName	createSubmitProjectVariation/fetch-data	handleSubmit

Of course, in the case when the naming of the logs has not changed.

[Amey-MSFT]

Hello @Anitha-1997,
Thank you for bringing this issue to our attention. Could you please confirm if the issue still persists for you?

[Amey-MSFT]

We are closing this issue for now. If the problem persists, feel free to reopen it or open a new one.