I'm trying to use the microsoftTeams Javascript library in my Personal Tab in my Teams App. The app is written in cshtml and plain javascript.

I'm able to access the microsoftTeams object itself in my javascript file.

Ex: The following snippet works fine:

microsoftTeams.getContext(async (context) => userid = context.userObjectId );

However I need to integrate the camera/gallery into my workflow in the personal tab. I was following the instructions as per this documentation : https://docs.microsoft.com/en-us/microsoftteams/platform/concepts/device-capabilities/mobile-camera-image-permissions.

I'm facing an issue where-in the media object is undefined inside the microsoftTeams context.

The following snippet is how I'm trying to use the selectmedia api of the sdk.

function takePhotos() {
    var listOfSelectedImages = new Array();
    var imageProp = {
        sources: [microsoftTeams.media.Source.Camera, microsoftTeams.media.Source.Gallery],
        startMode: microsoftTeams.media.CameraStartMode.Photo,
        ink: false,
        cameraSwitcher: false,
        textSticker: false,
        enableFilter: true,
    };
    var mediaInput = {
        mediaType: microsoftTeams.media.MediaType.Image,
        maxMediaCount: 10,
        imageProps: imageProp
    };
    microsoftTeams.media.selectMedia(mediaInput, function (error, attachments) {
        if (error) {
            if (error.message) {
                alert(" ErrorCode: " + error.errorCode + error.message);
            }
            else {
                alert(" ErrorCode: " + error.errorCode);
            }
        }
        if (attachments)
        {
           // code for using atttachments here
        }
    });
}

I'm getting an error in both the browser and mobile client at this line microsoftTeams.media.Source.Camera, saying media is undefined.

I have included the teams.min.js file in the .layout.cshtml as follows.

<script src="https://statics.teams.cdn.office.net/sdk/v1.11.0/js/MicrosoftTeams.min.js" integrity="sha384-SCVF3m7OvDKnfAilUzYn2yozEvBeP8n/Oq0yTH8VUI70J4AzrqR70jzjdQ6DI8s2" crossorigin="anonymous"></script>

Is there something else I need to include for me to be able to access the media object?