microsoft / viva-connections-extensibility-beta

Viva Connections Extensibility

Thank you!

With the release of SPFx 1.13.0, the public beta is now closed. A huge thank you to everyone who participated over the past few months.

Welcome to the public Beta for Viva Connections extensibility!

• Announcement blog post
• SharePoint Framework 1.13 release notes
• Documentation
• Tutorial
• Issue reporting

Issue Tracking

Please use the Issues list for opening any issues or to see if others are experiencing the same issues. We will also use this to track feature requests and technical discussion.

Happy coding! Sharing is Caring!

viva-connections-extensibility-beta's Issues

E404 Not Found - GET http://registry.npmjs.org/@microsoft%2fsp-adaptive-card-extension-base

Executed the command "yo @microsoft/sharepoint --plusbeta"

Project also get created with the below error:

npm ERR! code E404
npm ERR! 404 Not Found - GET http://registry.npmjs.org/@microsoft%2fsp-adaptive-card-extension-base - Not found
npm ERR! 404
npm ERR! 404 '@microsoft/[email protected]' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)
npm ERR! 404
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.

[ACE Card]: [Cards won't load if a mobile user agent is passed]

Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.

Versions

[ Big Sur ] Operating System
[ 12.13.0 ] Node version
[ CLI version: 2.3.0 ]
[ Local version: 4.0.2 ] Gulp version
[ @microsoft/[email protected] ] SPFx Generator version

Expected or Desired Behavior

When loading the dashboard using a mobile device it should load the same as desktop version.

Observed Behavior

Cards refuse to load if a mobile user agent is passed.

mobileuseragent.mov

Hard to tell which errors relate.

Steps to Reproduce

Utilize aadHttpClient to make an api call in init to get data, load the cards on both desktop/mobile user agent.

When data loading in `onInit` takes too much time the card is not shown anymore

Versions

[ Win10 ] Operating System
[ v14.17.0 ] Node version
[ 4.0.2 ] Gulp version
[ 1.13.0-beta 5 ] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

Data loading in onInit is a common use case and when data loading is slower than expected the card should still load.

Observed Behavior

When I'm calling an Azure Function from onInit the initial call to the function might take a few seconds longer as it's warming up...when that happens the net result is that the card is not shown at all in the dashboard.

Steps to Reproduce

Do something in onInit that prevents the promise from resolving within about 5 seconds (didn't time this) and your card will not be shown.

Fluent icon font names do not work for `iconProperty

Versions

[ 1.13.0-beta.5 ] SPFx Generator version

Expected or Desired Behavior

Specify Fluent icon font names for iconProperty.

Observed Behavior

Due to some cross-platform bugs, we have decided to delay this functionality. For now, the icon must reference a URL.

Is there workaround to call API data on Demand instead of calling it in OnInit()

Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.

Versions

[Windows 10] Operating System
[v12.22.1] Node version
[4.0.2] Gulp version
[1.13.0-beta.5] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

****Extension.ts
Init() : method is only way where calling API data is happening. If there is necessity that where on the QuickView load we can get certain API data's there we don't have any control. Due to this I am calling several API's on card load where all API data's are necessary on the card load itself.

if there will be control for us to load certain data on the QuickView or on the card button click it would be great feature to be add on in SPFx Viva Extension.

Scenario: If we think about the scenario's where there will be multiple Azure API call is happening on the card load it may be lead to performance issue.

@microsoft is there any workaround for us to avoid calling certain API's onInit, instead calling API's on QuickView load or on Card Button click

Small updates to lab 3 instructions

Following code snippets should be added to the lab 3 instructions to be complete:

HelloWorldAdaptiveCardExtension.ts
import { DetailedView } from './quickView/DetailedQuickView';
private _cardIndex: number;

QuickView.ts
The instructions show:

import { DETAILED_QUICK_VIEW_REGISTRY_ID } from '../HelloWorldAdaptiveCardExtension`;

Note the backtick versus the single quote.

Overall just some small changes, but might help folks who are completely new to SPFx and TypeScript

[Teams iOS app] Quick view closes after state change of another ACE

Versions

[ 1.13.0-beta.5 ] SPFx Generator version

Expected or Desired Behavior

Quick view should not be closed when state of another ACE is updated.

Observed Behavior

We have developed an ACE that calls setState in the onInit function every second. This leads to the problem that if another ACEs Quick view is opened it's closed after one second.

Steps to Reproduce

Create an ACE that sets the state without user interaction, e.g. like below and all other ACEs Quick views will close after one second.

public onInit(): Promise<void> {
    this.state = {
        now: new Date()
    };

    setInterval(() => {
        this.setState({
            now: new Date()
        });
    }, 1000);
}

QuickViews should be able to fetch data on demand

Versions

[Windows 10] Operating System
[v12.22.1] Node version
[4.0.2] Gulp version
[1.13.0-beta.5] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

Continuing on from this discussion in Teams

QuickViews should be able to fetch data on demand with Promises instead on data having to be passed down to them from the ACE.

Observed Behavior

Currently only the BaseAdaptiveCardExtension class contains and OnInit method which returns a Promise and can be used to fetch data asynchronously.

This effectively translates to getting all the data on first load instead of fetching it on demand when the user invokes the QuickView. If there are a large number of ACEs on the dashboard then all of them are going to eagerly load all the data also for the QuickViews even if the user never invokes the quick view.

Teams notifications: opening Viva URL works / works not alternating

Versions

[ Windows ] Operating System
[ 10.22 ] Node version
[ 3.9.1 ] Gulp version
[ - ] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

Clicking on a notification in Teams, opens the Viva (SharePoint) URL. Clicking on another notification, opens also the Viva URL.
The url to open is a Viva site, set in the TeamworkActivityTopic.WebUrl

Observed Behavior

Clicking on a notification works. Clicking on another notifications fails. This alternates exactly. Both URLs are working.
When it fails, we see a request to: https://tenant.sharepoint.com/_layouts/15/preload.aspx?portalsCache=true&env=TeamsWebView and the initiator is registerBeforeUnloadHandler:

Steps to Reproduce

Create 2 or 3 Teams notifications with a WebUrl like this:

string `tabUrl` = $"https://graph.microsoft.com/v1.0/users/{subscribedUser.UserId}/teamwork/installedApps/{subscribedUser.AppId}";
string encodedContext = Uri.EscapeDataString("{\"subEntityId\": \"" + _model.Url + "\"}");

var notification = new TeamworkActivityTopic
{
     Source = TeamworkActivityTopicSource.EntityUrl,
    Value = tabUrl,
     WebUrl = $"https://teams.microsoft.com/l/entity/{appid}/{tabId}?context={encodedContext}"
};

The WebUrl is a reference to a static tab in Teams.
In the Teams manifest of our app, Viva is opened.
Url of Viva: https://tenant.sharepoint.com/_layouts/15/teamslogon.aspx?spfx=true&dest=https://tenant.sharepoint.com/sites/home?app=portals",

When clicking on the notification in Teams, and it doesn't work, we see a javascript call to registerBeforeUnloadHandler which does a _navigateToPreload. When this happens, the browser navigates to https://tenant.sharepoint.com/_layouts/15/preload.aspx?portalsCache=true&env=TeamsWebView and then it stops and nothing is displayed. When clicking on another notification, It works and navigates to the correct URL. This keeps alternating.

If we leave app=portals off the URL, it also keeps working!

How to use **ITextRun** interface for the Adaptive Card

[Windows 10] Operating System
[v12.22.1] Node version
[4.0.2] Gulp version
[1.13.0-beta.5] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

I am trying to underline a text in Adaptive card, I found one API available for this
https://github.com/microsoft/Viva-Connections-Extensibility-Beta/wiki/sp-adaptive-card-extension-base.itextrun
ITextRun.

Is there any sample or examples for the underline which help me to achieve the underline or other things.
Any suggestions really helpful for me... Thanking you

ACE default icon not loading when using the mobile experience

Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.

Versions

[ Win10 / Android R11] Operating System
[ v14.17.0 ] Node version
[ 4.0.2 ] Gulp version
[ 1.13.0-beta 5 ] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)
[ 0.2.0-20210622.1 ] Viva Connections Teams mobile app version

Expected or Desired Behavior

The SharePoint icon for a custom developed ACE is also showing up in the mobile experience

Observed Behavior

In the mobile experience (testing on Android R11 in an emulator) the default icon of custom ACEs is not loading.

Cards in browser view:

Cards in mobile view:

Steps to Reproduce

Scaffold and deploy a custom ACE. Once done render the dashboard via the Viva Connections mobile experience.

AdaptiveCardExtension manifest supportedHosts should contain SharePointWebPart

The scaffolded ACE manifest will contain this line:

"supportedHosts": ["Dashboard", "SharePointWebPart"],

Please do not modify this array.

(Removing "SharePointWebPart" will prevent the ACE from being added to the Workbench or the Dashboard page.)

[ACE]: [It is possible to render a template in the CardView]

Versions

[ Big Sur ] Operating System
[ 12.13.0 ] Node version
[ CLI version: 2.3.0 ]
[ Local version: 4.0.2 ] Gulp version
[ @microsoft/[email protected] ] SPFx Generator version

Expected or Desired Behavior

I shouldn't be able to render my own CardView utilizing Adaptive Card Templates

Observed Behavior

If you provide the correct methods, you can actually render a CardView with an adaptive card template.

Steps to Reproduce

import { ISPFxAdaptiveCard, BaseAdaptiveCardView } from '@microsoft/sp-adaptive-card-extension-base';
import * as strings from 'HelloWorldAdaptiveCardExtensionStrings';
import { IHelloWorldAdaptiveCardExtensionProps, IHelloWorldAdaptiveCardExtensionState } from '../HelloWorldAdaptiveCardExtension';

export interface IQuickViewData {
  subTitle: string;
  title: string;
  description: string;
}

export class QuickView extends BaseAdaptiveCardView<
  IHelloWorldAdaptiveCardExtensionProps,
  IHelloWorldAdaptiveCardExtensionState,
  IQuickViewData
> {
  public get data(): IQuickViewData {
    return {
      subTitle: strings.SubTitle,
      title: strings.Title,
      description: this.state.description
    };
  }

  public cardButtons;

  public onCardSelection;

  public get template(): ISPFxAdaptiveCard {
    return require('./template/QuickViewTemplate.json');
  }
}

Now you can register it as a cardview

 public onInit(): Promise<void> {
    this.state = {
      description: this.properties.description
    };

    this.cardNavigator.register(CARD_VIEW_REGISTRY_ID, () => new QuickView());

    return Promise.resolve();
  }

Update API reference documentation

Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.

Would it be possible to update the API reference documentation to reflect the latest changes (1.13.0-beta.11). For instance, AdaptiveCardExtensionContext doesn't have information on the deviceContext property.

`gulp trust-dev-cert` should be included in the instructions for lab1

gulp trust-dev-cert is required to make local debugging work, devs that used SPFx before have this setup but someone new to SPFx starting with these labs will run into issues (workbench does not connect with locally served content). As gulp trust-dev-cert is broken in beta 5 it's best to only add these instructions when this issue is fixed or alternatively document the workaround.

Picker for icon/Image properties on OOB Card Designer Web Part

Expected or Desired Behavior

When selecting an icon a picker or similar functionality to quick links thumbnail selection, for the Icon field in the OOB Card Designer web part.

Observed Behavior

These are text fields only.

Steps to Reproduce

Add Card Designer web part to Dashboard.

[ACE Generator]: [Can't create multiple ACES of different Templates in same solution]

Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.

Versions

[ MACOS ] Operating System
[ 14.16 ] Node version
[ 4.0.2 ] Gulp version
[ @microsoft/[email protected] ] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

After creating a second ACE in a solution I should be able to choose Base, PrimaryText, or Image.

Observed Behavior

When creating a second ACE in an existing solution it defaults to the type of the first ACE that was created. (e.g. First ACE is PrimaryImage, second should be PrimaryText but the generator stops after asking if you want to create a Webpart or Ace.

Steps to Reproduce

Create a new solution using the generator.
Select the defaults choosing Adaptive Card Extension and Image Card Template.

Run the generator again to create a second ACE in the same solution.
You do not get the ability to choose the Template.

Teams Deep Link in QuickView adaptive card action always opens new browser tab

Versions

[Windows 10] Operating System
[v12.22.1] Node version
[4.0.2] Gulp version
[1.13.0-beta.5] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

In the QuickView Adaptive card, if there is a button with Action.OpenUrl which points to a deep link to a Teams tab, then this link should open in the same browser tab instead of always opening a new tab.

There should be a way to set the isTeamsDeepLink: true parameter to buttons added as part of the adaptive card.

Observed Behavior

Adaptive card buttons with action type OpenUrl always open a new browser tab even if the link contains a deep link to a Teams tab. The buttons highlighted below:

Steps to Reproduce

In the adaptive card which is shown on the Quick View, add an action with type Action.OpenUrl and point it to a deeplink to a Teams tab:

{
    "type": "AdaptiveCard",
    "version": "1.2",
    "body": [
		///
    ],
    "actions": [{
            "type": "Action.OpenUrl",
            "url": "https://teams.microsoft.com/l/entity/<app-id>/<entity-id>?context=%7B%22subEntityId%22%3A8%2C%22channelId%22%3A%2219%3AEwSwACREAgS2ZD1xwPFAA_PONNHZ7Aqslh1CkCRuYNU1%40thread.tacv2%22%7D",
            "title": "Go to Idea"
        }
    ]
}

Observe that clicking on the deep link always opens up a new browser tab.

Adpative card selection Action OpenUrl is not showing the mouse pointer as good user experience

Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.

Versions

[ Windows ] Operating System
[ 4.0.2 ] Gulp version
[ 1.13.0-beta 5 ] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)
[ 0.2. ] Viva Connections Teams mobile app version

Desired Behavior

changing the cursor on Action.OpenUrl as its url in QuickView, from the experience point user should know that its a clickable link on the AdaptiveCard view.

Observed Behavior

The behavior is on hover of link mouse pointer should change so that user can understand that its click able link from the experience point of View.

microsoft/BotFramework-WebChat#1767 referred link.

Referred some of the similar issues , understanding that by design standard mouse cursor not changing.

Steps to Reproduce

Used Adaptive card control :

"selectAction": {
"type": "Action.OpenUrl",
"url": "${anyUrl}"
},

Scenario : QuickView contains list of items where its a clickable link using Action.OpenUrl, on mouse hover mouse pointer will not show the experience to user that it is a clickable link.

Dashboard: Doesn't support loading from localhost:4321

Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.

Versions

[Windows 10] Operating System
[12.21.0] Node version
[4.0.2] Gulp version
[1.13.0-beta.5] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

If not a production build all code should load from localhost:4321 the way that <=1.12.1 SPFx works.

Observed Behavior

When doing a gulp bundle and gulp package-solution leaving the --ship off does not update the manifest to load from localhost.

Steps to Reproduce

• Create hello world app
• gulp clean & gulp bundle & gulp package-solution
• deploy to app catalog (site or tenant)*
• add card to dashboard
• Card loads even if you haven't run gulp serve
  *Deployment doesn't indicate that the code is going to load from localhost

SPFx 1.13.0-beta 5 issue: gulp trust-dev-cert does not work anymore

Versions

[ Win10 ] Operating System
[ v14.17.0 ] Node version
[ 4.0.2 ] Gulp version
[ 1.13.0-beta 5 ] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

gulp trust-dev-cert uses certutil.exe to add a cert to the local cert store

Observed Behavior

Note the comma in the path to certutil.exe, guess that's the reason why the exe cannot be found. The exe is present on the system. Using SPFx 1.12.1 on the same machine works.

Steps to Reproduce

call gulp trust-dev-cert from a scaffolded SPFx 1.13.0-beta 5 solution

Hiding a card: Hiding the card is not working

Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.

Versions

[Windows ] Operating System
[ 12.13 ] Node version
[ *** ] Gulp version
[*** ] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

I am trying to hide the Card when loading a page, even though cardView I have not registered I am seeing the card get loaded on the page. My understanding is since "protected renderCard(): string | undefined; " is by default it is rendering the BaseCardView.

Observed Behavior

By default BaseCardView is loaded in the page.

trying

is there a way to load the card on the demand, for example if Card get some data then only Card will be available on the page or if there is no data then Card should not be available. Any suggestions or workaround really helpful ......

Quick view : TextBlock color not appearing

Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.

Versions

[Ubuntu 18.04 LTS] Operating System
[v 14.15.5] Node version
[4.0.2] Gulp version
[1.13.0-beta.17] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

When color attribute of the TextBlock element is set in QuickView template json, the text should appear as per the set color detailed here

Observed Behavior

The color of the text doesn't change

Steps to Reproduce

• Add a TextBlock in the Quickview template json
• Set the color attribute to any of dark, light, attention or good
• The color of the text in the quick view doesn't change

Lab 3 - Missing Import

In Lab3, I found a few missing imports. It's simple enough to figure out but for a new user, these might prove to be barriers in completing the lab successfully.

The QuickView requires you to import IListItem but it's not included in the lab.

I resolved the issue by adding the following import to import IListItem.

import { IHelloWorldAdaptiveCardExtensionProps, IHelloWorldAdaptiveCardExtensionState, IListItem } from '../HelloWorldAdaptiveCardExtension';

Missing DetailedView import in HelloWorldAdaptiveCardExtensiont.ts. I would also consider renaming this view to DetailedQuickView so the filename and class name match.

Missing import IActionArguments in DetailedQuickView.ts.

Missing import DETAILED_QUICK_VIEW_REGISTRY_ID in QuickView.ts.

Missing import RenderType in HelloWorldAdaptiveCardExtensiont.ts.

Indication for removing old ACE WebPart from workbench in Lab 2

Versions

[ Windows 10 ] Operating System
[ 12.13.0 ] Node version
[ 4.0.2 ] Gulp version
[ 1.13.0-beta.5 ] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

After applying updates from Lab 1 to Lab 2, when running gulp serve -l --no-browser as mentioned here, we should be able to display the ACE WebPart with updates. The Lab should indicate to remove the WebPart and add it again, if a new property is added to an existing ACE WebPart property pane.

Observed Behavior

After applying updates from Lab 1 to Lab 2, when running gulp serve -l --no-browser as mentioned here, if we still have the Lab 1 webpart displayed and running the local server, after refreshing the workbench we have an error pointing CardView.ts file:

public get data(): IPrimaryTextCardParameters {
    const { title, description } = this.state.items[this.state.currentIndex]; // Error here
    return {
      description,
      primaryText: title
    };
}

As long as we don't remove the ACE webpart to add it again, this error occurs because the new WebPart property pane listId doesn't exist.

Steps to Reproduce

Follow the instructions from Lab 1 to Lab 2.

ACE Teams mobile app rendering issues

Versions

[ 1.13.0-beta.5 ] SPFx Generator version

Observed Behavior

ACE behave differently on Teams mobile (iOS):

• Images are not rendered centered when using "horizontalAlignment": "Center"
• SVGs are not displayed

Mobile:

Desktop (as expected):

Steps to Reproduce

Example AC with centered image:

{
  "type": "AdaptiveCard",
  "body": [
    {
      "type": "Image",
      "url": "data:image/jpeg;base64,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",
      "size": "Large",
      "horizontalAlignment": "Center",
      "style": "Person"
    }
  ],
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "version": "1.3"
}

Installing Trust Dev Certificate

Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.

Versions

[Windows 10 ] Operating System
[v12] Node version
[4] Gulp version
[@microsoft/[email protected]] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

On clean machine, cannot install certificate. As per - https://docs.microsoft.com/en-us/sharepoint/dev/spfx/set-up-your-development-environment#trusting-the-self-signed-developer-certificate

Observed Behavior

CertUtil does exist:

Steps to Reproduce

gulp trust-dev-cert

Small tweak to lab 2

In section: https://github.com/microsoft/Viva-Connections-Extensibility-Private-Beta/wiki/Lab-2:-Advanced-Card-View-Functionality#42---previous--next-buttons

When adding the last block of code, the IActionArguments needs to be added to the import statement.

import {
  BasePrimaryTextCardView,
  IPrimaryTextCardParameters,
  IExternalLinkCardAction,
  IQuickViewCardAction,
  ICardButton,
  IActionArguments
} from '@microsoft/sp-adaptive-card-extension-base';

Found couple of points

• It wasn't immediately clear the list ID needs to be populated in the HelloWorldAdaptiveCardExtension.manifest.json file, I did get an error if the items are not returned.
• When adding IListItem - perhaps a note to say this will be defined later in the instructions.

Other than that all working 😍

ACE QuickView Mobile Teams link issue

Versions

[ iOS ] Operating System
[ ] Node version
[ ] Gulp version
[ latest 1.13 beta ] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

on mobile / desktop

1. Card view button opens a Quick view
2. Quick view is a list of links which are Teams deep links
3. Clicking Deep link does the redirect cycle and results in display in the mobile app of the linked Teams content

This series works on desktop, but not mobile

Observed Behavior

On mobile when clicking the deep link the redirect cycle completes brining the Teams app up but the quick view is still displayed from which the link was initially launched.

Steps to Reproduce

This was tested and reported by a partner using the pre-release connections mobile app.

ACEs are not showing up in Dashboard page toolbox

Expected or Desired Behavior

I can add my ACE to a Dashboard page.

Observed Behavior

The ACE shows up in the hosted Workbench, but does not show up in the Dashboard page toolbox.

Thanks to @juliemturner and @pkbullock for reporting. We are actively looking into it.

QuickView Videos is not playing, Automatically Quick View closes

Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.

Versions

[ Windows ] Operating System
[12.13 ] Node version
[ 2.3.0] Gulp version
[ microsoft/[email protected] ] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

Adaptive card version supports Video playing. I am trying to load the video in the quick view. Expected behavior is playing of videos supports in Adaptive card json file.

This is the reference which I am trying to load it in Quick View
https://adaptivecards.io/samples/ProductVideo.html

Observed Behavior

On playing the video play was interrupted and QuickView gets closed immediately. So loading of Video is fine but on playing it
QuickView get closed.

Steps to Reproduce

This is the reference which I am trying to load it in Quick View
https://adaptivecards.io/samples/ProductVideo.html
Reading the Adaptive card json in SPFx ACE, we can see this behavior.

Lab3 - Section 4 RenderType: Not working

Versions

[ 10 ] Operating System
[ v12] Node version
[ 4] Gulp version
[ 1.13.0-beta5] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

Working through Lab 3, Section 4, persisting renderType, either my understanding is flawed or the state isnt being maintained on clicking in and out of the quick view.

Observed Behavior

I've recorded the outcome from my end, and hopefully enough of the code to see if i have missed anything...

2021-04-28_10-52-01.mp4

Steps to Reproduce

Implement Lab 3 - Section 4

Quick view closes after state change in another ACE changes

Versions

[ 1.13.0-beta.5 ] SPFx Generator version

Expected or Desired Behavior

Quick view should not be closed when state of another ACE is updated.

Observed Behavior

We have developed an ACE that calls setState in the onInit function every second. This leads to the problem that if another ACEs Quick view is opened it's closed after one second.

Steps to Reproduce

Create an ACE that sets the state without user interaction, e.g. like below and open another ACEs Quick view.

public onInit(): Promise<void> {
    this.state = {
        now: new Date()
    };

    setInterval(() => {
        var now = new Date();

        this.setState({
        now: now
        });
    }, 1000);
}

Mobile Dashboard: Graph Api Calls return undefined Data: {} on mobile

Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.

Versions

[ Windows 10 Enterprise, iOS 14.8 ] Operating System
[ v14.18.1 ] Node version
[ 4.0.2 ] Gulp version
[ 1.12.1 ] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

Microsoft Graph Api calls return the same data on mobile as desktop experience.

Observed Behavior

Graph Api returns undefined Data: {} on mobile app and mobile browser.

Desktop:

Steps to Reproduce

Add to package-solution.json:

"webApiPermissionRequests": [ { "resource": "Microsoft Graph", "scope": "Directory.Read.All" } ],

setup graph:

graph.setup({ spfxContext: this._context });

call graph:
...
let p = await graph.me();
...

Does this have something to do with the AdaptiveCardExtensionContext?

[Web Part Name]: "this.properties.count" is not working under *****PropertyPane.ts file

Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.

Versions

[ Windows ] Operating System
[ 12.13 ] Node version
[ 2.3.0 ] Gulp version
[ ] SPFx Generator version (npm list -g @microsoft/generator-sharepoint)

Expected or Desired Behavior

I am trying to get the webpart properties in the *******PropertyPane.ts file to do the Webpart property validation.
Ex: disabled:this.properties.count?false:true

but I am not getting the webpart property in the propertypane.ts file. In normal SPFx webpart I will be able to get these webpart properties easily to do the validation.

[QuickView]: [Videos Not playing]

Versions

[ Big Sur ] Operating System
[ 12.13.0 ] Node version
[ CLI version: 2.3.0 ]
[ Local version: 4.0.2 ] Gulp version
[ @microsoft/[email protected] ] SPFx Generator version

Expected or Desired Behavior

Videos to play in Quick View

Observed Behavior

Video closes with an unhandled promise rejection after load.

videonotworking.mov

Steps to Reproduce

Add an mp4 to a quick view.