nurullah commented 2 years ago

🐛 bug report

Preflight Checklist

[x] I have read the Contributing Guidelines for this project.
[x] I agree to follow the Code of Conduct that this project adheres to.
[x] I have searched the issue tracker for an issue that matches the one I want to file, without success.

Description of the problem

How has this issue affected you? What are you trying to accomplish?

I was working on the chakra-ui drawer example but i realized that i can no longer edit text outside of the the preview area. I created the drawer area and i just set the default props to always be open. And then i noticed this problem.

I tried the fix this problem myself and i was delete the portal element in the preview area on the dev tools and problems is solved at that time. I think this problems may be related to React Portal.

To Reproduce

Link to sandbox: ChakraUI Drawer Example

Your Environment

Software	Name/Version
Сodesandbox	Latest
Browser	Version 103.0.5060.53 (Official Build) (64-bit)
Operating System	Ubuntu 16.04 LTS

JamesACS commented 2 years ago

Hey @nurullah

Thank you for this report, however I'm not sure of the issue here? Opening the example you gave us I can edit any and all text in the Sandbox?

nurullah commented 2 years ago

@JamesACS Unfortunately, i still cannot edit the editor when Drawer was open. You can watch my problem in the below;

https://user-images.githubusercontent.com/10761479/176725451-e9f69894-b2d5-40b9-a5ac-02ce68c1e6dd.mp4

JamesACS commented 1 year ago

Thanks @nurullah and sorry for the delay here, this issue got a little lost.

This is expected behaviour though, as the drawer is taking focus. If you'd like to test the functionality while not losing editor control we'd recommend using the pop out preview.

nurullah commented 1 year ago

Thanks @nurullah and sorry for the delay here, this issue got a little lost.

This is expected behaviour though, as the drawer is taking focus. If you'd like to test the functionality while not losing editor control we'd recommend using the pop out preview.

But the problem is that i cannot edit the code anymore.

https://user-images.githubusercontent.com/10761479/198587933-0f0f9f2d-6eba-4af7-9cc6-61d87ac66386.mp4

alexnm commented 1 year ago

This still looks like a problem with the Chakra specific behavior, which forces the focus to be moved inside the Drawer. The moment you click in the editor, you can see the cursor disappears.

nurullah commented 1 year ago

You are free to close this issue, if it's not problem for you that i can't edit the code anymore.