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

Clipboard copy button has wrong position when using Content projection (select attribute) #536

Open
klofi opened this issue Sep 13, 2024 · 0 comments

Comments

@klofi
Copy link
Contributor

klofi commented Sep 13, 2024

When using <markdown> with clipboard in Content projection (select attribute), the copy button is only placed in right position the first time. Once the content is removed/readded, the button will be placed just below markdown element.

Partial workaround:

The button can be forced to be re-rendered again to correct position via re-render this.markdownService.reload();, but that does not remove the previous instance of the button. Perhaps that could be fixed by calling destroy() on the existing componentRef when re-rendering. The componentRef is created in:

const componentRef = viewContainerRef.createComponent(ClipboardButtonComponent);

Here is a repro using modified official stackblitz:

  1. Open https://stackblitz.com/edit/ngx-markdown-issue-536
  2. Observe "Copy" button is in correct position in typescript code example ✔️
  3. Click on "Without markdown" button, Content projection will remove conent with markdown
  4. Click on "With markdown", Content projection will readd conent with markdown
  5. Observe "Copy" button is in wrong position all the way at the bottom ❌
  6. Ugly and hacky workaround: Click on "Re-render" button and new "Copy" button will be placed in corrent position. You can hide the old via css.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant