Default SharePoint list view does not update when adding items using Rest API

[SPJS]

Target SharePoint environment

SharePoint Online

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

💥 SharePoint Framework

Developer environment

None

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

Describe the bug / error

When creating a new item in a list using the default newform in a list using the latest modern UI the list automatically shows this new item. Even if I add the item in Chrome and have the same list view open in Edge, the item is immediately shown in the list view in both browsers.

If I however add a new item using REST, the list view sometimes shows the item after approximately 30 seconds for the first item - adding additional items using REST does not show the items in the view at all until I manually refresh the page or navigate to another list using the left menu and then back again.

I'm wondering how to ensure that changes made to the list is shown in the list view without having to manually reload the page.

Steps to reproduce

These steps use an example code snippet to create a new list item in a list.

1. Create a new custom list (or use one you already have)
2. Hit F12 to bring up the developer tools and select "Console".
3. Type in "allow pasting" to allow pasting code
4. Copy-paste the code snippet below in the console and hit Enter.

function createTestItem() {
  let data = {
    "formValues": [
      {
        "FieldName": "Title",
        "FieldValue": "Created with REST " + new Date().toLocaleString()
      }
    ]
  }

  try {
    fetch(
      _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getByTitle('" + _spPageContextInfo.listTitle + "')/addValidateUpdateItemUsingPath",
      {
        method: "POST",
        headers: {
          Accept: "application/json; odata=verbose",
          "Content-Type": "application/json;odata=verbose",
          "X-RequestDigest": _spPageContextInfo.formDigestValue,
        },
        body: JSON.stringify(data),
      }
    ).then(data => {
      return data.json();
    }).then(json => {
      console.log(json);
    });
  } catch (error) {
    console.log("error", error);
  }
}

createTestItem();

The output will show the list item you crated like this:

{
    "d": {
        "AddValidateUpdateItemUsingPath": {
            "__metadata": {
                "type": "Collection(SP.ListItemFormUpdateValue)"
            },
            "results": [
                {
                    "ErrorCode": 0,
                    "ErrorMessage": null,
                    "FieldName": "Title",
                    "FieldValue": "Created with REST 1/21/2025, 6:14:21 PM",
                    "HasException": false,
                    "ItemId": 0
                },
                {
                    "ErrorCode": 0,
                    "ErrorMessage": null,
                    "FieldName": "Id",
                    "FieldValue": "17",
                    "HasException": false,
                    "ItemId": 0
                }
            ]
        }
    }
}

In my command set extension I'm creating items using a custom form using something like this:
sp.web.lists.getById([GUID]).addValidateUpdateItemUsingPath(formValues);

I would appreciate some guidance on how to make the list view update to show the new items.

Expected behavior

The list view should update to show the new items within a few seconds.

Alexander

[Tanddant]

Possible dupe of #9342