Periodically missing pageContext when consuming serviceScope

[MortenGuldbaek]

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
• [X] 💥 Microsoft Edge
• [X] 💥 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 Chrome 119
• SPFx version 1.18
• Node.js version 18.18.0
• etc

Describe the bug / error

Since the last month or so, our Application Customizer (top panel) has been running into issues consuming the pageContext serviceScope.

This is happening periodically, and my suspicion is that it is tied to a lingering page context from a prior load, as you can see described/depicted further below.

We are registering these events to trigger async loading contextual data from lists/propertybags to create our rich experience:

• this.context.placeholderProvider.changedEvent
• this.context.application.navigatedEvent

I'm using a custom service which is consuming multiple services as seen here:

constructor(private serviceScope: ServiceScope) {

    Log.verbose(SERVICE_KEY_TOKEN, `Constructing REDACTEDService`, serviceScope);

    serviceScope.whenFinished(() => {
      this._pageContext = serviceScope.consume(PageContext.serviceKey);
      this._aadHttpClientFactory = serviceScope.consume(AadHttpClientFactory.serviceKey);
      this._cache = serviceScope.consume(CacheService.serviceKey);
      this.license = new LicenseService(serviceScope, this._aadHttpClientFactory, this.throttlingDispatcher);
      this.settings = new SettingsService(serviceScope, this.throttlingDispatcher, this._pageContext.cultureInfo.currentUICultureName);  <<<--- Exception thrown here
      this.membership = new MembershipService(serviceScope, this._aadHttpClientFactory, this.user, this.throttlingDispatcher);
    });
}

In above, the following exception is thrown: Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'currentUICultureName')

It can happen both on navigation and on reloading the page.

Almost all of the times, I get the Developer Tools warning twice in the console, like so (sorry for the Danish):

I'm logging the serviceScope registrations when initializing my service and it logs twice in quick succession, and here we can see that two pageContexts are in play:

The first (both PageContext_8 and PageContext_31 is present, though 31 is not ready)

The second (here the PageContext_31 is the only instance**

We have been initializing our Aplication Customizer pretty much the same way for the last 5 years, taking into account all the ongoing issues and workarounds also mentioned by Julie here: https://julieturner.net/post/spfx-appcustomizer-pageloading/

Since we haven't introduced any Application Lifecycle changes on our end, we are having a hard time trying to find out why this is suddenly happening and would appreciate any input from you guys.

Kind regards from Morten

Steps to reproduce

1. Open a SharePoint page with our Tenant Deployed Application Customizer
2. Reload page or navigate to other page
3. Occasionally, error described above happens and Application Customizer rendering fails due to insufficient context data to perform async calls to our resources.

Expected behavior

Application Customizer loads indentically each time it's loaded/reloard/navigated to

[ghost]

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

[MortenGuldbaek]

Just adding a bit more context. This is almost exclusively happing when SPFx is loaded with the listview-host-assembly (link below), so only in Document Libraries / Lists.

https://res-1.cdn.office.net/files/sp-client/listview-host-assembly_da-dk_b8ebd7d067e21a05dc5b8f78431fb6cf.js

[MortenGuldbaek]

This is still occurring on a regular basis for several of our clients.

Is there any guidance or clarification on how to avoid this?

[MortenGuldbaek]

@nick-pape commenting since this was marked by you for Need:Attension. Are you able to tell if this is planned for a response, or in your backlog? Several of our clients still encounter this and it inhibits their daily work.

Thanks in advance

[MortenGuldbaek]

We're keen to find a resolution as it's affecting our clients daily usage. Any updates or advice on how we might proceed would be greatly appreciated.