I happened to notice that React will throw `Hooks can only be called inside the body of a function component` if a sibling element calls `ReactDOMServer.renderToStaticMarkup`. I have a [fiddle](https://jsfiddle.net/er4kL3of/) that shows this behavior (I think you need to manually open your console to see the error).

If you wrap the sibling element in a component or even just assign it a variable, this issue does not occur.

It's easy to get around and is a pretty specific bug, but why might this be happening?


ReactCurrentOwner.currentDispatcher = Dispatcher;
    } else {
      ReactCurrentOwner.currentDispatcher = DispatcherWithoutHooks;
    }
    try {
      let out = '';
      while (out.length < bytes) {
        if (this.stack.length === 0) {
          this.exhausted = true;
          break;
        }
        const frame: Frame = this.stack[this.stack.length - 1];
        if (frame.childIndex >= frame.children.length) {
          const footer = frame.footer;
          out += footer;
          if (footer !== '') {
            this.previousWasTextNode = false;
          }
          this.stack.pop();
          if (frame.type === 'select') {
            this.currentSelectValue = null;
          } else if (
            frame.type != null &&
            frame.type.type != null &&
            frame.type.type.$$typeof === REACT_PROVIDER_TYPE
          ) {
            const provider: ReactProvider<any> = (frame.type: any);
            this.popProvider(provider);
          }
          continue;