SPFx loading old version files and sometimes from different environment

[bhanuchintha]

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 - Edge latest
• SPFx version - 1.11
• Node.js version
• etc

Describe the bug / error

1. We have developed a custom SPFx component and deployed to different environments - Dev/Stg/UAT/Prod. We have enabled side loading in all the Dev/Stg/UAT environments. We have both the Extension & webpart in this SPFx solution. We observed that the XYZ-extension-application-customizer_16345316eb49d720a1d078eb095432g9.js is loading from local catalog instead of appcatalog folder in the higher/prod environments where side loading is not enabled

Actual:
https://publiccdn.sharepointonline.com/<>.sharepoint.com/teams/<>/ClientSideAssets/<>/XYZ-extension-application-customizer_<>.js

Expected:
https://publiccdn.sharepointonline.com/<>.sharepoint.com/sites/catalog/ClientSideAssets/<>/XYZ-extension-application-customizer_<>.js

2. We have also observed that for some users the older version of file is getting loaded related to chunk.js and the functionality is breaking

3. Also the webpart is observed in loading in the context of the lower environment site where we have almost 10 webpart properties. But, it has only 5 webpart properties in higher/prod environment

4. If we are deleting the "Cookies and other site data" and "Cached images and files" and doing a fresh request in higher/prod site - everything is working fine.

All this was working properly till Apr 28th. We feel this issue has come up suddenly and guessing any environment issue. Can you please let us know the possible cause for this issue and the resolution.

Steps to reproduce

1. Develop SPFx webpart
2. Deploy in more than one site collection
3. Open the lower env where the side loading is enabled in one tab
4. Open the higher/prod env site where the side loading is disabled in other tab
5. In the environment/site opened in second tab, we see the files are loaded from lower environments and not from respective environment.
6. IF we reverse the opening order of the sites, it is behaving in opposite way
7. Only the first opened environment is working fine
8. If we are deleting the "Cookies and other site data" and "Cached images and files" and doing a fresh request in higher/prod site - everything is working fine.

Expected behavior

Irrespective of how many sites are opened that has the same SPFx webpart - webpart should load the respective files from its own package and not from other site associated package and also not from the older versions of the spfx webpart assoiated files.

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

[bhanuchintha]

Hi Everyone, I have few observations on this issue - We have actually uninstalled the App in the site collection that we are using the associated webpart. Following are the observations

1. We see that very frequently users are getting the SPFx associated JS file loaded from the catalog only this time. But, from old version of the SPFx webpart
2. When we do Shift F5 webpart loads perfectly and functionality is fine
3. When we open a new tab and browse the same page again, Still we are seeing same issue again. Again we have to do the Shift F5 do resolve the issue

We cannot ask users to do this every time they come our page - This is really so painful and creating lot of new concerns on the stability. Can you please help us here in addressing this issue ASAP.

Thanks & Regards,
Bhanu

[bhanuchintha]

Hi Everyone, Attaching the two screenshots of the manifest with the correct and wrong references. Wrong reference is getting replaced with correct reference when we do a Shift F5.

Wrong Reference seen -

Correct reference seen

Thanks & Regards,
Bhanu

[bhanuchintha]

Hi Everyone,

Also, we observe the below console logs when SPFx loader is trying to load the wrong JS file - A preload for 'https://publiccdn.sharepointonline.com/xxxx.sharepoint.com/sites/catalog/ClientSideAssets/431dde0c-370f-4783-9d11-6a35d9fb4519/yyyyy-web-part_39d739c68144f7310a682a62b1d04eb1.js' is found, but is not used because the request credentials mode does not match. Consider taking a look at crossorigin attribute.

And after few fraction of seconds, we are seeing one more message -

The resource https://publiccdn.sharepointonline.com/xxxx.sharepoint.com/sites/catalog/ClientSideAssets/431dde0c-370f-4783-9d11-6a35d9fb4519/yyyyy-part_39d739c68144f7310a682a62b1d04eb1.js was preloaded using link preload but not used within a few seconds from the window's load event. Please make sure it has an appropriate as value and it is preloaded intentionally.

Hope this might give some more insights to the issue that we are facing.

Thankyou.

[VesaJuvonen]

Just to elaborate a bit why this was closed. As this issue only happens in the MSIT tenant and is being worked using internal channels, there's no value on this for external audience.

[bhanuchintha]

We completely understand this. Thanks a lot @VesaJuvonen @patmill for the support in this regard.

Thanks & Regards,
Bhanu

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