JiraAction: Getting ominous async()=>e.data could not be cloned

dsaiz · September 21, 2021, 11:03am

Hey guys,

I recently encountered a problem which suddenly appeared, although this should have worked already.

In my Forge app I use Jira action to synchronize issue data with another service. This synchronization process is triggered by this Jira action.

Funnily enough, all synchronizations can be performed with success, but I am getting this error at the end (see picture). This occurred after upgrading to Forge 2.0.1.

The API calls were implemented in the useEffect hook of @forge/ui…

const App = () => {
	const [isOpen, setOpen] = useState(true);
	if (!isOpen) return null;

	const [propState, setPropState] = useState({} as Properties);
	const [detailedIssue, setDetailedIssue] = useState(null);

	const [response, setResponse] = useState(null);

	useEffect(async () => {
		setPropState(await getConfig());
		setDetailedIssue(await getIssueData(context.platformContext.issueKey));
	}, [])
	  
	useEffect(async () => {
	  const syncIssue: SyncIssue = {
		action: 'update',
		issueId: +detailedIssue.id,
		issueKey: detailedIssue.key,
		description: detailedIssue.fields.description,
		name: detailedIssue.fields.summary,
		issueTypeId: +detailedIssue.fields.issuetype.id,
		projectKey: (context.platformContext as any).projectKey
	  }

	  let response = await notifyTestManager(propState.serverUrl, API_ENDPOINT, syncIssue);
	  setResponse(response);

	  if (response.status === 204) {
		console.log(`${response.status} | Requirement updated.`);
	  } else if (response.status === 401) { // unauthorized
		console.log(`${response.status} | Unauthorized for pushing this requirement.`);
	  }

	}, [propState, detailedIssue])
	
	return (
		<ModalDialog header="Sync-panel" width="medium" onClose={() => setOpen(false)} closeButtonText="Ok">
		  <Text>finished synchronization...</Text>
		</ModalDialog>
	);
};

export const run = render(
  <IssueAction>
    <App/>
  </IssueAction>
);

Does anyone have a hint to fix this bug or has anyone already encountered this bug?

Thank you very much and best regards
Dan

ramkiuipath · September 27, 2021, 11:46am

@bentley @vpetrychuk Can some of you please help here? pretty please? Its been a week, and we donot have solution yet!

vpetrychuk · September 27, 2021, 12:10pm

Hey @dsaiz,

What’s implementation of the notifyTestManager method?
Also do getConfig() and getIssueData() return plain JSON?

I’d suggest you commenting out line by line and trying to figure out which operation breaks the app. It is hard to tell what is going on since I don’t see implementation details of mentioned functions.

Thanks,
Vitalii

ramkiuipath · September 27, 2021, 12:46pm

Thank you @vpetrychuk , while @dsaiz come back with full details, i can answer few.
getIssueData() → This returns json
getConfig() → This returns properties object
notifyTestManager() → Makes webservice call to our backend and gives response.

Few things to note:

Sync operation is successful, i.e. data was sent to our backend successfully.
below are the logs from forge tunnel, looks like some code is being called repeatedly.

invocation: 7f9dc3e14ae1a10a issueActionPush.run
INFO    12:22:23.677  7f9dc3e14ae1a10a  not synced  |  not synced

invocation: d1a1c246ef3d794e issueActionPush.run
INFO    12:22:27.485  d1a1c246ef3d794e  not synced  |  not synced
INFO    12:22:28.872  7f9dc3e14ae1a10a  not synced  |  not synced
INFO    12:22:28.874  7f9dc3e14ae1a10a  not synced  |  not synced
INFO    12:22:29.240  7f9dc3e14ae1a10a  [object Object] --> remove later 2
INFO    12:22:29.241  7f9dc3e14ae1a10a  not synced  |  not synced
INFO    12:22:29.246  7f9dc3e14ae1a10a  204 | Requirement updated:  {
  action: 'update',
  issueId: 10002,
  issueKey: 'PROJ-3',
  description: 'edit:5',
  name: 'test task 2, created on jira',
  issueTypeId: 10002,
  projectKey: 'PROJ'
}
INFO    12:22:29.248  7f9dc3e14ae1a10a  -----------------> Remove later 1
INFO    12:22:29.251  7f9dc3e14ae1a10a  not synced  |  Not synced. This issue is not xray related.
INFO    12:22:29.256  7f9dc3e14ae1a10a  204 | Requirement updated:  {
  action: 'update',
  issueId: 10002,
  issueKey: 'PROJ-3',
  description: 'edit:5',
  name: 'test task 2, created on jira',
  issueTypeId: 10002,
  projectKey: 'PROJ'
}
INFO    12:22:29.257  7f9dc3e14ae1a10a  -----------------> Remove later 1
INFO    12:22:29.258  7f9dc3e14ae1a10a  Requirement synced successfully.  |  Not synced. This issue is not xray related.
INFO    12:22:29.266  7f9dc3e14ae1a10a  204 | Requirement updated:  {
  action: 'update',
  issueId: 10002,
  issueKey: 'PROJ-3',
  description: 'edit:5',
  name: 'test task 2, created on jira',
  issueTypeId: 10002,
  projectKey: 'PROJ'
}
INFO    12:22:29.267  7f9dc3e14ae1a10a  -----------------> Remove later 1
ERROR   12:22:29.304  7f9dc3e14ae1a10a  async()=>e.data could not be cloned.
TypeError: async()=>e.data could not be cloned.
    at n.wrapValue (bootstrap.js:1:2984)
    at n.wrap (bootstrap.js:1:2344)
    at bootstrap.js:1:3109
    at Array.map (<anonymous>)
    at n.wrapArray (bootstrap.js:1:3097)
    at n.wrap (bootstrap.js:1:2414)
    at bootstrap.js:1:1642
    at Array.map (<anonymous>)
    at n.applyIgnored (bootstrap.js:1:1630)
    at bootstrap.js:1:9074
INFO    12:22:32.828  d1a1c246ef3d794e  not synced  |  not synced
INFO    12:22:32.829  d1a1c246ef3d794e  not synced  |  not synced
INFO    12:22:33.106  d1a1c246ef3d794e  [object Object] --> remove later 2
INFO    12:22:33.107  d1a1c246ef3d794e  not synced  |  not synced
INFO    12:22:33.111  d1a1c246ef3d794e  204 | Requirement updated:  {
  action: 'update',
  issueId: 10002,
  issueKey: 'PROJ-3',
  description: 'edit:5',
  name: 'test task 2, created on jira',
  issueTypeId: 10002,
  projectKey: 'PROJ'
}
INFO    12:22:33.113  d1a1c246ef3d794e  -----------------> Remove later 1
INFO    12:22:33.117  d1a1c246ef3d794e  not synced  |  Not synced. This issue is not xray related.
INFO    12:22:33.125  d1a1c246ef3d794e  204 | Requirement updated:  {
  action: 'update',
  issueId: 10002,
  issueKey: 'PROJ-3',
  description: 'edit:5',
  name: 'test task 2, created on jira',
  issueTypeId: 10002,
  projectKey: 'PROJ'
}
INFO    12:22:33.126  d1a1c246ef3d794e  -----------------> Remove later 1
INFO    12:22:33.128  d1a1c246ef3d794e  Requirement synced successfully.  |  Not synced. This issue is not xray related.
INFO    12:22:33.132  d1a1c246ef3d794e  204 | Requirement updated:  {
  action: 'update',
  issueId: 10002,
  issueKey: 'PROJ-3',
  description: 'edit:5',
  name: 'test task 2, created on jira',
  issueTypeId: 10002,
  projectKey: 'PROJ'
}
INFO    12:22:33.134  d1a1c246ef3d794e  -----------------> Remove later 1
ERROR   12:22:33.163  d1a1c246ef3d794e  async()=>e.data could not be cloned.
TypeError: async()=>e.data could not be cloned.
    at n.wrapValue (bootstrap.js:1:2984)
    at n.wrap (bootstrap.js:1:2344)
    at bootstrap.js:1:3109
    at Array.map (<anonymous>)
    at n.wrapArray (bootstrap.js:1:3097)
    at n.wrap (bootstrap.js:1:2414)
    at bootstrap.js:1:1642
    at Array.map (<anonymous>)
    at n.applyIgnored (bootstrap.js:1:1630)
    at bootstrap.js:1:9074

dsaiz · September 27, 2021, 1:28pm

Hey @vpetrychuk, thanks for response!

I have already gone through the code step by step.
Regarding your question: Yes config and detailedIssue return the correct format (json).

notifyTestManager returns a promise. In the function, the issue is synchronized with Testmanager, which works and is providing a corresponding response, afterwards.

Strangely, I only get this error after resolving this promise (after the logs have been output in the same loop). It’s as if the new state simply can’t be loaded any more. If I’m running the application without the async-call of notifyTestManager - it is working without issues, but in my opinion even with this function-call, this shouldn’t be a big deal, since I’m waiting for the response and passing on afterwards?

Unfortunately, I don’t know where this async()=>e.data comes from.

Cheers,
Dan

vpetrychuk · September 27, 2021, 2:09pm

Is it possible you forgot to .then(response => response.json()) on the promise notifyTestManager returns? In such case you will be setting a non-plain JS Object to the state which Forge can’t clone.

ramkiuipath · September 27, 2021, 3:13pm

@vpetrychuk Its 204, no content response from our server for this API call.
Can that be the reason? i.e. forge might be seeing empty response as invalid object?

vpetrychuk · September 28, 2021, 7:19am

@ramkiuipath, Whether that or a missing .json() call. While I’m sure you can’t pass a non-serializible JavaScript Object (fetch response) into setState I never spot 204 status code causing that error.

Thanks,
Vitalii