DEV Community

Andrew Elans
Andrew Elans

Posted on

Power Automate: format JavaScript error object for email

In my Power Pages portal project I would need to be notified on user client-side errors. I will later make an extensive thread on how I implement this, but this post is how to format a typical error object that comes from the JavaScript catch handler.

Typical flow

1) Error is caught in JavaScript code
2) Error object is prepared with all client-side details
3) Power Automate flow is triggered where email with the error details is sent to the admin

Error object

Let's now make a dummy Error object:

console.dir(
    new Error(
        'Smth went wrong'
        , {
            cause: {
                desc: "some descrtion here",
                comments: "some comments here",
                someObj: {
                    newProp: "new value"
                },
                someArr: [
                    {name: "name1", value: "value1"},
                    {name: "name2", value: "value2"}
                ]
            }
        }
    )
)
Enter fullscreen mode Exit fullscreen mode

We would get the following error that we would need to send by email:

Image description

We will send this object to Power Automate in the request body as follows:

fetch(              
    url
    , {
        method: "POST",
        body: JSON.stringify(
            {
                wb_data: JSON.stringify(
                    {
                        desc: "some description here",
                        comments: "some comments here",
                        someObj: {
                            newProp: "new value"
                        },
                        someArr: [
                            {name: "name1", value: "value1"},
                            {name: "name2", value: "value2"}
                        ]
                    }
                )
            }
        )
    }
)
Enter fullscreen mode Exit fullscreen mode

Result in the email body will be rendered in one line and look like this:

{"desc":"some description here","comments":"some comments here","someObj":{"newProp":"new value"},"someArr":[{"name":"name1","value":"value1"},{"name":"name2","value":"value2"}]}
Enter fullscreen mode Exit fullscreen mode

That is not what I want.

How to fix

We need to use the space parameter when doing JSON.stringify

Let's redo the logic:

fetch(              
    url
    , {
        method: "POST",
        body: JSON.stringify(
            {
                wb_data: JSON.stringify(
                    {
                        desc: "some description here",
                        comments: "some comments here",
                        someObj: {
                            newProp: "new value"
                        },
                        someArr: [
                            {name: "name1", value: "value1"},
                            {name: "name2", value: "value2"}
                        ]
                    }
                    , null
                    , ' ' // this is a space separator that is rendered in Outlook HTML tags as a visual space
                ).replaceAll('\n', '<br>') // when applying the space param, '\n' is added automatically which we need to convert to new line for HTML
            }
        )
    }
)
Enter fullscreen mode Exit fullscreen mode

Ref &emsp;.

Result

Actual string that will be sent to the email body will look like this:

'{"wb_data":"{<br>&emsp;\\"desc\\": \\"some description here\\",<br>&emsp;\\"comments\\": \\"some comments here\\",<br>&emsp;\\"someObj\\": {<br>&emsp;&emsp;\\"newProp\\": \\"new value\\"<br>&emsp;},<br>&emsp;\\"someArr\\": [<br>&emsp;&emsp;{<br>&emsp;&emsp;&emsp;\\"name\\": \\"name1\\",<br>&emsp;&emsp;&emsp;\\"value\\": \\"value1\\"<br>&emsp;&emsp;},<br>&emsp;&emsp;{<br>&emsp;&emsp;&emsp;\\"name\\": \\"name2\\",<br>&emsp;&emsp;&emsp;\\"value\\": \\"value2\\"<br>&emsp;&emsp;}<br>&emsp;]<br>}"}'
Enter fullscreen mode Exit fullscreen mode

Actual email body in Outlook will look like this:

{
"desc": "some description here",
"comments": "some comments here",
"someObj": {
  "newProp": "new value"
},
"someArr": [
  {
   "name": "name1",
   "value": "value1"
  },
  {
   "name": "name2",
   "value": "value2"
  }
]
}

Enter fullscreen mode Exit fullscreen mode

Top comments (0)