From de1fb8f7fd39f91cdf8a06df0b14c62bd9826a09 Mon Sep 17 00:00:00 2001
From: Ramanpreet Nara <ramanpreet@meta.com>
Date: Wed, 11 Oct 2023 19:03:01 -0700
Subject: [PATCH] Sort object properties in interop test

Summary:
It looks like objects properties aren't guaranteed to have a stable order. Sort them, before we serializae and print them to the screen in the interop test. This should reduce interop test flakyness.

Changelog: [Internal]

Reviewed By: makovkastar

Differential Revision: D50148860

fbshipit-source-id: a6ed1433d4dd35cafa5c9f7d09c4cca194c31d81
---
 .../TurboModule/SampleLegacyModuleExample.js   | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

diff --git a/packages/rn-tester/js/examples/TurboModule/SampleLegacyModuleExample.js b/packages/rn-tester/js/examples/TurboModule/SampleLegacyModuleExample.js
index cbc298a2067..77cbd1aa8f1 100644
--- a/packages/rn-tester/js/examples/TurboModule/SampleLegacyModuleExample.js
+++ b/packages/rn-tester/js/examples/TurboModule/SampleLegacyModuleExample.js
@@ -50,6 +50,22 @@ function getSampleLegacyModule() {
   return module;
 }
 
+function stringify(obj: mixed): string {
+  function replacer(_: string, value: mixed) {
+    if (value instanceof Object && !(value instanceof Array)) {
+      return Object.keys(value ?? {})
+        .sort()
+        .reduce((sorted: {[key: string]: mixed}, key: string) => {
+          sorted[key] = (value ?? {})[key];
+          return sorted;
+        }, {});
+    }
+    return value;
+  }
+
+  return (JSON.stringify(obj, replacer) || '').replaceAll('"', "'");
+}
+
 class SampleLegacyModuleExample extends React.Component<{||}, State> {
   static contextType: React$Context<RootTag> = RootTagContext;
 
@@ -171,7 +187,7 @@ class SampleLegacyModuleExample extends React.Component<{||}, State> {
     return (
       <View style={styles.result}>
         <Text testID={name + '-result'} style={[styles.value]}>
-          {(JSON.stringify(result.value) || '').replaceAll('"', "'")}
+          {stringify(result.value)}
         </Text>
         <Text style={[styles.type]}>{result.type}</Text>
       </View>