microsoftTeams.media.selectMedia crashes when inside a bot TaskModule

[Kizzik]

When using microsoftTeams.media.selectMedia inside a bot's TaskModule popup, I am able to take photos, however when I click on Attach to finalise the selection, the TaskModule popup closes, the selectMedia callback is not called, and the console shows the following error message:

TypeError: Cannot read properties of null (reading 'postMessage') at e.postMessage (https://statics.teams.cdn.office.net/hashed/3.2-app.min-82d71d5.js:1:9644720) at t.baseSendMessage (https://statics.teams.cdn.office.net/hashed/3.2-app.min-82d71d5.js:1:4676569) at e.sendResponseMessage (https://statics.teams.cdn.office.net/hashed/3.2-app.min-82d71d5.js:1:4673543) at e.processHandlerResultHelper (https://statics.teams.cdn.office.net/hashed/3.2-app.min-82d71d5.js:1:4675055) at https://statics.teams.cdn.office.net/hashed/3.2-app.min-82d71d5.js:1:4674508 at f (https://statics.teams.cdn.office.net/hashed/0.2-angular-jquery.min-92954a0.js:127:115) at https://statics.teams.cdn.office.net/hashed/0.2-angular-jquery.min-92954a0.js:127:345 at m.$eval (https://statics.teams.cdn.office.net/hashed/0.2-angular-jquery.min-92954a0.js:142:180) at m.$digest (https://statics.teams.cdn.office.net/hashed/0.2-angular-jquery.min-92954a0.js:139:290) at v.$digest (https://statics.teams.cdn.office.net/hashed/3.2-app.min-82d71d5.js:1:5647070) undefined

I've tested this in @microsoft/teams-js v1.11.0 and v2.0.0 and the behaviour is consistent between them.

[ghost]

Hi Kizzik! Thank you for bringing this issue to our attention. We will investigate and if we require further information we will reach out in one business day. Please use this link to escalate if you don't get replies.

Best regards, Teams Platform

[sayali-MSFT]

@Kizzik - Could you please provide Refer sample or document so we can try it from our end?

[Kizzik]

Here are snippets of the relevant code. We're using this to launch the TaskModule on the back-end (C#):

var url = $"<front-end page>";
return new TaskModuleResponse
{
    Task = new TaskModuleContinueResponse
    {
        Type = "continue",
        Value = new TaskModuleTaskInfo()
        {
            Url = url,
            Height = 700,
            Width = 700,
            Title = "Send message",
        },
    },
};

and this is the code for retrieving the photos in our front-end app (JS):

const getPhotos = async (): Promise<microsoftTeams.media.Media[]> => new Promise<microsoftTeams.media.Media[]>(async (resolve, reject) => {
  const maxImageCount = 3;
  const mediaInput = {
    mediaType: microsoftTeams.media.MediaType.Image,
    maxMediaCount: maxImageCount,
    imageProps: {
      sources: [microsoftTeams.media.Source.Camera]
    }
  };
  microsoftTeams.media.selectMedia(mediaInput, (error, attachments) => {
    if (error) {
      resolve([]);
    }
    else {
      resolve(attachments);
    }
  });
});

Please let me know if that is enough to investigate the issue, or if you require a complete standalone solution.

[sayali-MSFT]

@Kizzik -Could you please try with the below sample- https://github.com/OfficeDev/Microsoft-Teams-Samples/blob/main/samples/tab-device-permissions/nodejs/src/components/CaptureImage.tsx

[sayali-MSFT]

@Kizzik -Did you get chance to check ?

[Kizzik]

@Kizzik -Could you please try with the below sample- https://github.com/OfficeDev/Microsoft-Teams-Samples/blob/main/samples/tab-device-permissions/nodejs/src/components/CaptureImage.tsx

Apologies for the delay. This exhibits the same behaviour as my application's code:

• Task module opens, displaying the component
• Click Capture Image or Capture multiple images (both result in the bug occurring)
• Take picture(s), click Attach
• Photo capture UI closes, as well as task module, and the stack trace from the original post is shown in the console

Please let me know if you require any additional information from me to help investigate this.

[Kizzik]

@sayali-MSFT - Just wanted to check if there are any updates on this?

[sayali-MSFT]

@Kizzik -We are checking it our end and let you know .

[sayali-MSFT]

@Kizzik - We are able to repro that issue , We have raised bug for the same and concerned team is looking into it. We will inform you once we get any update.

[Kizzik]

Hi @sayali-MSFT, just wanted to see if there are any updates on the progress of this issue?

[sayali-MSFT]

@Kizzik - Engineering team working on this issue. Currently we don’t have ETA or Update on this thread. We will update this thread once the bug is fixed.

[sayali-MSFT]

We are checking the status of the fix release with the engineering team. We will let you know once we have any updates on it. Thanks.

[Kizzik]

@sayali-MSFT just checking in for a status update on this please?

[sayali-MSFT]

@Kizzik -Sorry for delay in response!! We are actively checking the status of bug with engineering team and let you know the updates, if we have any.

[sayali-MSFT]

@Kizzik -Got the reply from engineering team, From there end, the implementation is working fine, and the correct decoded string is being sent in the response to the API call in the first instance. There's a problem in the customer's implementation of the app. The customer is not able to update the UI after getting the response. They suggest that, to try rendering the UI component again after updating the UI.

[ChetanSharma-msft]

Hello @Kizzik - Could you please check and confirm whether your issue has been resolved with above suggestions or still need any further assistance here?

[Kizzik]

Hi @ChetanSharma-msft, unfortunately this issue has not been resolved. Camera functionality within a bot task module still crashes with the same error.

Using the previously suggested sample code, I've attached a video demonstrating the behaviour (recorded today). I also experienced the same behaviour with my main application code.

https://github.com/OfficeDev/microsoft-teams-library-js/assets/5524729/6901b378-125d-45ab-83d5-9645f30c403a

[sayali-MSFT]

@Kizzik - We are informing the engineering team and let you know once we get update.