Merge branch 'master' into users/srmukher/RTLPackage

Author: srmukher

change/@fluentui-react-utilities-adc87890-3e9b-4efb-9165-98576d3078d2.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "chore: tests for slot.resolveShorthand behavior",
+  "packageName": "@fluentui/react-utilities",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}

packages/react-components/react-utilities/src/compose/slot.test.tsx

@@ -84,4 +84,44 @@ describe('slot', () => {
       [SLOT_RENDER_FUNCTION_SYMBOL]: expect.any(Function),
     });
   });
+  describe('.resolveShorthand', () => {
+    it('resolves a string', () => {
+      expect(slot.resolveShorthand('hello')).toEqual({ children: 'hello' });
+    });
+
+    it('resolves a JSX element', () => {
+      const jsx = <div>hello</div>;
+      expect(slot.resolveShorthand(jsx)).toEqual({ children: jsx });
+    });
+
+    it('resolves a number', () => {
+      expect(slot.resolveShorthand(42)).toEqual({ children: 42 });
+    });
+    it('resolves an array', () => {
+      expect(slot.resolveShorthand([])).toEqual({ children: [] });
+    });
+
+    it('resolves an object as the same object', () => {
+      const slotA = {};
+      const resolvedProps = slot.resolveShorthand(slotA);
+      expect(resolvedProps).toEqual({});
+      expect(resolvedProps).toBe(slotA);
+    });
+
+    it('resolves "null" without creating a child element', () => {
+      expect(slot.resolveShorthand(null)).toEqual(null);
+    });
+
+    it('resolves undefined without creating a child element', () => {
+      expect(slot.resolveShorthand(undefined)).toEqual(undefined);
+    });
+
+    it('should console an error when a function is passed as value', () => {
+      console.error = jest.fn();
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      const fn: any = () => null;
+      expect(slot.resolveShorthand(fn)).toBe(fn);
+      expect(console.error).toHaveBeenCalled();
+    });
+  });
 });

packages/react-components/react-utilities/src/compose/slot.ts

@@ -91,6 +91,17 @@ export function resolveShorthand<Props extends UnknownSlotProps | null | undefin
   ) {
     return { children: value } as Props;
   }
+  if (value && typeof value !== 'object' && process.env.NODE_ENV !== 'production') {
+    // TODO: would be nice to have a link to slot documentation in this error message
+    // eslint-disable-next-line no-console
+    console.error(
+      [
+        `[slot.resolveShorthand]: A slot got invalid value "${value}" (${typeof value}).`,
+        'A valid value is a slot shorthand or slot properties object.',
+        'Slot shorthands can be strings, numbers, arrays or JSX elements',
+      ].join('\n'),
+    );
+  }
 
   return value;
 }