First time Forge UI Kit updates issue description it crashes

Forge
, , ,
1

Our app is making a processing in our side and after that when we update the issue description using the REST API, only the first time after that app was loaded in the issue, the app crash. We validate that it is happening after call to the rest api to update the issue description, but the response is successful. Also we cannot see the error on Atlassian console. Any suggestion how test, fix or make a workaround to avoid it?
Once that the app was used the first time in an issue, does not matters that we loaded the issue again in a fresh browser session it works properly without any error.

issue
issue1920Ă—1060 166 KB

This issue seems to be similar: https://community.developer.atlassian.com/t/issue-panel-crashes-on-issue-update/71494

Scenarios to reproduce the issue:

Crash scenario 1

  1. Create an issue using the “Create” button
  2. Open the created issue by clicking the “View issue” button in the toast message at the bottom left corner
  3. Open the Jira panel app (the panel renders below the issue description)
  4. Trigger a REST call by pressing a button
  5. Rest call edits the issue successfully
  6. Jira panel crashes and says “Unexpected Error”

Crash scenario 2

  1. Create an issue using the “Create” button
  2. Open the created issue by clicking the “View issue” button in the toast message at the bottom left corner
  3. Refresh the page
  4. Open the Jira panel app (the panel renders below the issue description)
  5. Trigger a REST call by pressing a button
  6. Rest call edits the issue successfully
  7. Jira panel crashes and says “Unexpected Error”

Crash scenario 3

  1. From the project backlog, create an issue using the “Create” button
  2. Find the created issue on the Backlog list and open it by clicking it
  3. The issue opens in the panel on the right
  4. Open the Jira panel app (the panel renders below the issue description)
  5. Trigger a REST call by pressing a button
  6. Rest call edits the issue successfully
  7. Jira panel crashes and says “Unexpected Error”

Crash scenario 4 In this scenario, we modify the code to update the issue data when the panel mounts, using the useEffect hook.

  1. Create an issue using the “Create” button
  2. Open the created issue by clicking the “View issue” button in the toast message at the bottom left corner
  3. Open the Jira panel app (the panel renders below the issue description)
  4. The REST call is triggered automatically
  5. Rest call edits the issue successfully
  6. Jira panel crashes and says “Unexpected Error”

Success scenario 1

  1. Create an issue using the “Create” button
  2. Open the created issue by clicking the “View issue” button in the toast message at the bottom left corner
  3. Open the Jira panel app (the panel renders below the issue description)
  4. Refresh the page
  5. Trigger a REST call by pressing a button
  6. Rest call edits the issue successfully
  7. Jira panel does not crash

Note: The last scenario is not a solution because it requires that the user refresh the page, and thats is a really poor user experience because we need to guide the user to make it to avoid a Jira crash.

We ran the tests using:

@forge/api: 2.18.3, @forge/ui: 1.9.1

and

@forge/api: ^2.11.0, @forge/ui: 1.6.0

2 Likes
2

Hi @MatiasMolinas1. Welcome to the developer community. I wasn’t able to reproduce the error your described. Here’s the code I used to test, which is very stripped down – includes just a button that runs a function that updates the current issue summary and description.

Can you review/try this code, and if it does work for you also, perhaps add additional details about what else should be added to cause the crash you’re describing?

import ForgeUI, { render, Fragment, Text, IssuePanel, useProductContext, Button } from '@forge/ui';
import api, { route } from '@forge/api';

const App = () => {
  const context = useProductContext();

  return (
    <Fragment>
      <Text>Testing to see if a REST API call made from an issuePanel will throw an error on a newly created issue</Text>
      <Button text="Update issue" onClick={async () => { await updateIssue(context); }} />
    </Fragment>
  );
};

const updateIssue = async(context) => {
  const issueKey = context.platformContext.issueKey;
  const now = Date.now();
  const bodyData = `
    { 
      "fields": {
        "summary": "Updated summary from forge app at ${now}",
        "description": {
          "content": [
            {
              "content": [
                {
                  "text": "Updated description from forge app at ${now}",
                  "type": "text"
                }
              ],
              "type": "paragraph"
            }
          ],
          "type": "doc",
          "version": 1
        }
      }
    }`;

  const updateApiCall = await api.asUser().requestJira(route`/rest/api/3/issue/${issueKey}`, {
    method: 'PUT',
    headers: {
      'Accept': 'application/json',
      'Content-Type': 'application/json'
    },
    body: bodyData
  });

  console.log(bodyData);
}

export const run = render(
  <IssuePanel>
    <App />
  </IssuePanel>
);
1 Like
3

Hi @nmansilla , your example is working, an it is calling the rest api using the current user:

const updateApiCall = await api.**asUser()**.requestJira(route`/rest/api/3/issue/${issueKey}`, {
            method: 'PUT',
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json'
            },
            body: bodyData
        });

The issue with this approach is that the screen is not updated after update the issue description with the Rest API, and we need to display a message asking to the user to reload the page manually from the browser, and the user experience is really poor. We will do it for now because with don’t have another solution. Out approach was update the issue as App:

const updateApiCall = await api.**asApp()**.requestJira(route`/rest/api/3/issue/${issueKey}`, {

And doing that, Jira is updating the screen after update the issue, but it is crashing as we report in this issue.

Thanks

4

@MatiasMolinas1 did you get a solution for the same, I am currently facing the same issue.

@nmansilla It is only happening if we use asApp() and page reloads, After clicking refresh app it is working as expected without any errors.

2 Likes
5

Hi @JitendraSantoshVarma , Our solution was migrate to Custom UI where it is possible to update the issue description without a crash. It is an issue of UI Kit.

2 Likes