Unable to add a base64encoded image in the slide of Powerpoint on Web

Question

I created the powerpoint office add-in to add the base64 encoded string as an image into the slide. it's working properly on Desktop but through the error on Web

Step to reproduce:

A. load icon list from CDN server

window.onload = function () {

var iconContainer = document.getElementById('icon-container');

// Iteration over all icons

icons.forEach(function (icon) {

    var img = new Image();

    img.src = icon.url;

    img.className = 'icon-thumbnail';

    img.onclick = function () {

        // Fetch the image data from the URL, then pass it to the insertIcon function

        insertIcon(icon.url);

    };

    iconContainer.appendChild(img);

});
```}

**B. Insert an image in the slide**

function insertIcon(iconUrl) {

fetch(iconUrl)

.then(response => response.blob())

.then(blob => {

    let reader = new FileReader();

    reader.onload = function () {

        let dataUrl = reader.result;

        let base64 = dataUrl.split(',')[1];


        

        Office.context.document.setSelectedDataAsync(base64, {

            coercionType: Office.CoercionType.Image,

            imageLeft: 50,

            imageTop: 50,

            imageWidth: 100, // adjust this value based on the desired size of your icon

            imageHeight: 100

        },

            function (asyncResult) {

            if (asyncResult.status === Office.AsyncResultStatus.Failed) {

                console.log("Action failed with error: " + asyncResult.error.message);

            }

        });

    }

    reader.readAsDataURL(blob);

});

**C.** **it gives an error saying**

"Uncaught TypeError: Cannot read properties of undefined (reading 'setSelectedDataAsync')

at reader.onload (icon.js:87:41)

at sa.h (<anonymous>:15:146)

at FileReader.h (<anonymous>:205:72)"

Can anyone advise on how to fix this error?

Thank you in advance