fix(richtext-lexical): richtext editor features overriding other editor features props if multiple editors in one document (#7758)

Example: richText editor 1 and 2 both have UploadFeature. richText
editor 1 calls UploadFeature() with custom fields, richText editor 2
calls UploadFeature() with NO custom fields. Before this PR, richText
editor 1 would not have had any custom fields, as richText editor 2 will
override the feature object (specifically its props).

Author: AlessioGr

packages/richtext-lexical/src/utilities/createClientFeature.ts

@@ -58,8 +58,16 @@ export const createClientFeature: <
         return toReturn
       }
     } else {
-      ;(feature as ClientFeature<any>).sanitizedClientFeatureProps = props
-      featureProviderClient.feature = feature as ClientFeature<any>
+      // We have to spread feature here! Otherwise, if the arg of createClientFeature is not a function, and 2
+      // richText editors have the same feature (even if both call it, e.g. both call UploadFeature()),
+      // the second richText editor here will override sanitizedClientFeatureProps of the first feature, as both richText
+      // editor features share the same reference to the feature object.
+      // Example: richText editor 1 and 2 both have UploadFeature. richText editor 1 calls UploadFeature() with custom fields,
+      // richText editor 2 calls UploadFeature() with NO custom fields. If we don't spread feature here, richText editor 1
+      // will not have any custom fields, as richText editor 2 will override the feature object.
+      const newFeature: ClientFeature<any> = { ...feature }
+      newFeature.sanitizedClientFeatureProps = props
+      featureProviderClient.feature = newFeature
     }
     return featureProviderClient as FeatureProviderClient<any, any>
   }

packages/richtext-lexical/src/utilities/createServerFeature.ts

@@ -75,8 +75,11 @@ export const createServerFeature: <
         return toReturn
       }
     } else {
-      ;(feature as ServerFeature<any, any>).sanitizedServerFeatureProps = props
-      featureProviderServer.feature = feature as ServerFeature<any, any>
+      // For explanation why we have to spread feature, see createClientFeature.ts
+      const newFeature: ServerFeature<any, any> = { ...feature }
+
+      newFeature.sanitizedServerFeatureProps = props
+      featureProviderServer.feature = newFeature
     }
     return featureProviderServer as FeatureProviderServer<any, any, any>
   }