React Plugin Fails To Load on iPhone Obsidian

Developers: Plugin & API
1

Hello Obsidian community! I’m just starting to learn Obsidian plugin development and decided to use React and Tailwind CSS for my first project. I’ve encountered an issue that I hope someone can help me understand and resolve.

The Issue

I have a basic plugin that creates a modal with “Hello World”. It works perfectly on desktop but fails to load on iOS.

class PopupDialog extends Modal {
  private root: ReactDOM.Root | null = null;

  onOpen() {
    const { contentEl } = this;
    this.modalEl.classList.add("bg-blue-500");

    // This line works on Desktop, but fails on iPhone:
    this.root = ReactDOM.createRoot(contentEl);
    this.root.render(<div>Hello World</div>);
  }
}

Behavior

  • Desktop: Works perfectly. Modal opens and displays “Hello World”
  • iOS: Plugin fails to load entirely. No error messages visible in the UI

I’ve created a minimal reproduction repository here: GitHub - kuku1234us/obsidianpluginbug: This simple plugin code works on desktop Obsidian but fails to load on iPhone Obsidian

Any guidance would be greatly appreciated!