microsoft / microsoft/AdaptiveCards
Cannot use custom function created in Javascript Adaptive Cards in UI Template Schema.
Nobody has claimed this yet.
- Dominant language
- C#
- Stars
- 2k
- Forks
- 595
- Avg merge
- 1d 19h
- Merged PRs (30d)
- 1
Description
Target Application
For my own application
Application Operating System
Linux
Schema Version
version: "1.0"
Problem Description
I have written a custom function in Javascript for Adaptive cards. Below is an example code, how I have created it :
import { Expression } from "adaptive-expressions";
const formatOutlookDate = (args: any) => {
const date = new Date(args[0]);
return `Formatted Outlook Date is: ${date.toDateString()}`;
};
Expression.functions.add("formatOutlookDate", formatOutlookDate);
I'm using it my template schema as below :
{
type: "UI Card",
version: "1.0",
body: [
{
type: "Container",
$data: "${value}",
items: [
{
type: "Container",
items: [
{
type: "TextBlock",
name: "secondary",
color: "typeSecondary",
text: "Outlook Calendar",
},
{
type: "TextBlock",
name: "heading5",
weight: "bold",
color: "typeTitleLight",
text: "${formatOutlookDate(start.dateTime)}",
},
],
},
],
},
],
};
const populateTemplateWithData = (schema: any, data: any) => {
const context: ACData.IEvaluationContext = { $root: data };
const template = new ACData.Template(schema);
return template.expand(context);
};
Now, when I run it, it gives me error as below screenshot :
Expected Outcome
Function should work instead of giving error as 'Unknown function'
Actual Outcome
As below screenshot :
Card JSON
{
type: "UI Card",
version: "1.0",
body: [
{
type: "Container",
$data: "${value}",
items: [
{
type: "Container",
items: [
{
type: "TextBlock",
name: "secondary",
color: "typeSecondary",
text: "Outlook Calendar",
},
{
type: "TextBlock",
name: "heading5",
weight: "bold",
color: "typeTitleLight",
text: "${formatOutlookDate(start.dateTime)}",
},
],
},
],
},
],
};
Repro Steps
No response
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the custom registration at Expression.functions.add and the template expansion through ACData.Template.expand. Reproduce the reported Unknown function error using the schema and function shown; done means the registered function is recognized during template expansion and the expected formatted value is produced.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100