Issues Encountered During the Migration of Plate Playground Template

[Amateur0x1]

I encountered some issues while migrating the Plate Playground Template, and some functions of the editor are not working properly.

Migration Steps of Plate Playground Template

1. Roll back the React version: Roll back the code in the Plate playground template to React version 18.3.1.
2. Copy the dependency files: Copy all the dependencies into my package.json file and ensure that the versions are consistent.
3. Migrate the files: Copy all the files to the new repository and adjust the reference paths in the files.

Project Configuration List
Build Tools and Tasks

• Build tool: Vite
• Package management tool: pnpm
• Build task tool: nx

Dependency Versions

• Remix
  • @remix-run/react: 2.14.0
  • @remix-run/dev: 2.14.0
  • @remix-run/cloudflare: 2.14.0
  • @remix-run/cloudflare-pages: 2.14.0
  • @remix-run/css-bundle: 2.9.2
  • @remix-run/serve: 2.14.0
• Vite Plugins
  • @vitejs/plugin-react: 4.2.1
  • vite: 5.1.0
• React
  • react: ^18.3.1
  • react-dom: ^18.3.1
• TypeScript
  • typescript: 5.7.3

Development Dependencies

• Biomes: @biomejs/biome: 1.8.3
• Node.js Type Definitions: @types/node: ^22.10.5

Other Tools and Libraries

• Code Formatting and Checking Tools
  • prettier: ^3.2.4
  • prettier-plugin-sql: ^0.18.0
  • prettier-plugin-tailwindcss: ^0.5.11
  • eslint and @typescript-eslint plugins
• Tailwind CSS
  • tailwindcss: ^3.4.17
  • tailwindcss-animate: ^1.0.7
  • tailwind-scrollbar: ^3.1.0
  • tailwind-scrollbar-hide: ^2.0.0

Bugs
Bug 1: Floating Toolbar

As can be seen from the above two images, the floating toolbar is not properly activated because there is a problem with the positioning.

Bug 2: Drag
When I perform the dragging operation, the expected prompt line does not appear to indicate where the block is to be moved.

[felixfeng33]

Is the version of the udecode package consistent with the version used in the template when React 18 was used?

[Amateur0x1]

yes

[Amateur0x1]

Based on my troubleshooting tests, I believe the issue lies with Remix, specifically when converting the playground-plate to the Remix framework, that's when these problems occur. However, I can't confirm this at the moment—it's just a hypothesis, and I hope it's not the case.

[Amateur0x1]

The root cause is that in my project, pnpm install downloads the sub-dependency slate-dom version 0.112.2 instead of 0.111.0, which causes the issue.

[zbeyens]

Now documented here http://platejs.org/docs/troubleshooting