Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BUG] Link Popover position is incorrect after window resized #579

Open
2 tasks done
lkaihua opened this issue Sep 6, 2024 · 1 comment
Open
2 tasks done

[BUG] Link Popover position is incorrect after window resized #579

lkaihua opened this issue Sep 6, 2024 · 1 comment
Labels
bug Something isn't working

Comments

@lkaihua
Copy link

lkaihua commented Sep 6, 2024

  • I have searched for similar issues in both open and closed tickets and cannot find a duplicate.
  • I have read the documentation and cannot find an answer.

Describe the bug
Link Popover position is incorrect after window resized

To Reproduce
Steps to reproduce the behavior:

  1. Open https://mdxeditor.dev/editor/demo
  2. Click on the link [— Daring Fireball](https://daringfireball.net/projects/markdown/), the link popover is displayed right near the link as expected
  3. Click anywhere on the webpage to let editor lose focus. Make sure the editor loses focus, otherwise the bug can not be reproduced.
  4. Resize the window.
  5. See error: the link popover is on the top-left corner. It's expected to stay close to the link.

Expected behavior
At the last step, the link popover is expected to stay close to the link.

Screenshots
Snipaste_2024-09-07_00-49-23

Desktop (please complete the following information):

  • OS: MacOS
  • Browser [e.g. Chrome, Safari]: Chrome 128.0.6587.0, Firefox 129.0.2 (64-bit).

Mobile:

  • OS: iOS 17.5.1
  • Browser: Safari

Additional context
LinkDialog.tsx fires publishWindowChange(true) when resizing happens, but link anchor is set to left:0; top:0 when editor loses focus.

@lkaihua lkaihua added the bug Something isn't working label Sep 6, 2024
@lkaihua
Copy link
Author

lkaihua commented Sep 7, 2024

To mitigate this issue, my solution is to use readOnly flag when necessary because here it uses readOnly to decide if a preview payload should be sent.

This issue is not ignorable as on Mobile and Tablet device the keyboard view will push up the viewport frequently.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant