I followed the Subscribe to list notifications article. I was able to get notified when list items were added or updated. The code:

export default class BookingRequestsWebPart extends BaseClientSideWebPart<IBookingRequestsWebPartProps> {
  private _listSubscriptionFactory: ListSubscriptionFactory;
  private _listSubscription: IListSubscription;

  private createListSubscription(): void {
    console.log("Creating subscription... wait.");
    this._listSubscriptionFactory = new ListSubscriptionFactory(this);
      domain: '<site domain>.sharepoint.com',
      siteId: Guid.parse('b6a831ad-fce7-4fad-a04b-745be38a43f3'),
      webId: Guid.parse('6ac9cb5e-2aa3-4b24-aa57-da33c61f29d1'),
      listId: Guid.parse('dae5e072-1992-45eb-9b14-f6df46a2a80a'),
      callbacks: {
        notification: this._loadDocuments.bind(this),
        connect: this._subscriptionConnected.bind(this),
        disconnect: this._subscriptionDisconnected.bind(this)

  private _loadDocuments(): void {

    // load documents here
    console.log("something changed!");


  private _subscriptionConnected(): void {
    // code to execute when the subscription to the list has been established
    console.log("the list has been established", this._listSubscription);

  private _subscriptionDisconnected(reason: string): void {
    // code to execute when the connection to the list has been disconnected
    console.log("the connection to the list has been disconnected", this._listSubscription);

// unrelated webpart code coninues here.

It works great:

enter image description here

There is this an error present despite the fact that I am subscribed: enter image description here

But after about ~60 seconds, I lose my list subscription and get a ton of errors:

enter image description here

Question: Does anyone know what can be done? Anything I am doing wrong? Why am I disconnected after a connection was established?


"dependencies": {
    "@microsoft/sp-core-library": "1.11.0",
    "@microsoft/sp-list-subscription": "1.11.0",
    "@microsoft/sp-lodash-subset": "1.11.0",
    "@microsoft/sp-office-ui-fabric-core": "1.11.0",
    "@microsoft/sp-property-pane": "1.11.0",
    "@microsoft/sp-webpart-base": "1.11.0",
    "@pnp/pnpjs": "^2.0.13",
    "@pnp/spfx-controls-react": "^2.6.0-beta.81ae005",
    "@pnp/spfx-property-controls": "2.2.0",
    "moment": "^2.29.1",
    "office-ui-fabric-react": "^7.155.3",
    "react": "16.8.5",
    "react-dom": "16.8.5",
    "styled-components": "^5.2.3"

1 Answer 1


This appears to be a know issue logged in GitHub. For me the problem seems to come and go and the errors appear to indicate attempts to re-establish the connection. There is a "disconnect" message when the errors start and a "connect" message when they stop. So I treat the "connect" message like a change notification and re-fetch the data.

private createListSubscription(): void {
  const siteInfo = this.props.siteInfo;

    siteId: siteInfo.itemsWebId != undefined ? Guid.parse(siteInfo.itemsSiteId) : undefined,
    webId: siteInfo.itemsWebId != undefined ? Guid.parse(siteInfo.itemsWebId) : undefined,
    listId: siteInfo.itemsWebId != undefined ? Guid.parse(siteInfo.itemsListId) : undefined,
    callbacks: {
      notification: this.onListUpdate.bind(this),
      connect: this.onListSubscriptionConnected.bind(this),
      disconnect: this.onListSubscriptionDisconnected.bind(this)
  }).then(newSub => this._listSubscription = newSub);

private onListSubscriptionConnected(): void {
  console.log('subscription connected message');

private onListSubscriptionDisconnected(reason: string): void {
  console.log(`subscription disconnected message: ${reason}`);

private onListUpdate() {
  • As of today, this is still a bug that only Microsoft can fix. Commented Nov 12, 2021 at 18:13

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.