Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[preact/compat] causes page to stuck when rendering radix-ui Dialog

See original GitHub issue

Check if updating to the latest Preact version resolves the issue (tested, it doesn’t resolve the issue)

Describe the bug When using preact/compat with radix-ui, rendering Dialog.Content would cause the page to stuck indefinitely.

To Reproduce

Open this stackblitz project, and click on the “Trigger” button to open the Dialog. The page should now be unresponsive.

Steps to reproduce the behavior:

Go to https://stackblitz.com/edit/nextjs-preact-webpack5-odz79y?file=components/Dialog.js
Click on the “Trigger” button to open the Dialog component
The page should now be unresponsive.

Expected behavior The same code works with React. The expectation is that it also works with preact/compat.

Issue Analytics

State:
Created 2 years ago
Reactions:7
Comments:5 (2 by maintainers)

Top GitHub Comments

7reactions

JoviDeCroockcommented, Aug 5, 2022

Fixed in 10.10.1 https://stackblitz.com/edit/nextjs-preact-webpack5-dmpk3a?file=package.json

0reactions

maon-fpcommented, Mar 16, 2022

We ran into this problem when using react-bootstrap, too. @JoviDeCroock If synthetic events are not to be implemented: is there an alternative?

Top Results From Across the Web

Benjamin Bock on Twitter: "I wanted to give @radix_ui a try, but it ...

Bug report Current Behavior Dialog opens fine when using React, ... [preact/compat] causes page to stuck when rendering radix-ui Dialog · Issue #3297...

Dialog - Radix UI

A window overlaid on either the primary window or another dialog window, rendering the content ... Contains content to be rendered in the...

@radix-ui/dialog - Preact - CodeSandbox

import { render } from "preact";. import * as Dialog from "@radix-ui/react-dialog";. const App = () => (. <Dialog.Root>. <Dialog.Trigger asChild>.

wordlist ranked - Massachusetts Institute of Technology

... your all have new more an was we will home can us about if page my has no ... tc fusion indicator...

bing.txt - FTP Directory Listing

... c 3443499 channel 3443499 canada 3443499 used 3411929 password 3365116 insurance 3357376 page 3357376 about 3341950 microsoft 3341950 people 3341950 go ...