### Website or app

https://codesandbox.io/s/react-playground-forked-j4niq

### Repro steps

Emoji seem supported but produce strange symbole

![image](https://user-images.githubusercontent.com/24865815/133793744-55a55582-90ad-425f-8a40-4c061a3c1d80.png)

To test emoji on Window Os, use `[win]+[.]` 🟩


### How often does this bug happen?

Every time

### DevTools package (automated)

_No response_

### DevTools version (automated)

_No response_

### Error message (automated)

_No response_

### Error call stack (automated)

_No response_

### Error component stack (automated)

_No response_

### GitHub query string (automated)

_No response_
act(() => store.toggleIsCollapsed(grandparentID, true));
      expect(store).toMatchSnapshot('7: collapse Grandparent');
    });
    it('should support expanding deep parts of the tree', () => {
      const Wrapper = ({forwardedRef}) => (
        <Nested depth={3} forwardedRef={forwardedRef} />
      );
      const Nested = ({depth, forwardedRef}) =>
        depth > 0 ? (
          <Nested depth={depth - 1} forwardedRef={forwardedRef} />
        ) : (
          <div ref={forwardedRef} />
        );
      const ref = React.createRef();
      act(() =>
        legacyRender(
          <Wrapper forwardedRef={ref} />,
          document.createElement('div'),
        ),
      );
      expect(store).toMatchSnapshot('1: mount');
      const deepestedNodeID = agent.getIDForNode(ref.current);
      act(() => store.toggleIsCollapsed(deepestedNodeID, false));
      expect(store).toMatchSnapshot('2: expand deepest node');
      const rootID = store.getElementIDAtIndex(0);
      act(() => store.toggleIsCollapsed(rootID, true));
      expect(store).toMatchSnapshot('3: collapse root');
      act(() => store.toggleIsCollapsed(rootID, false));
      expect(store).toMatchSnapshot('4: expand root');
      const id = store.getElementIDAtIndex(1);