Skip to content

Support Shadow DOM #346

@cihad

Description

@cihad

If Popover.vue#L685 be:

const contains = popover.$refs.popover.contains(event.composedPath()[0])

It will runs inside Shadow DOM.

Now, inside shadow dom the popover window closes when click on it.

Activity

genu

genu commented on Oct 15, 2019

@genu

Possible to get a PR for this?

changed the title Fixing Shadow DOM Support Shadow DOM on Dec 30, 2020
digitalkaoz

digitalkaoz commented on May 27, 2021

@digitalkaoz

having the same problem here.

Using container : 'body' wont work correctly as the styles reside inside the shadow dom and having no effect for something outside of the shadow dom

Using container: false wont work correctly, the styles are applied, tooltips show, but wont hide.

any chance we get this working correctly in web components?

linked a pull request that will close this issue on Jun 23, 2021
linked a pull request that will close this issue on Dec 20, 2021
Rigidoont

Rigidoont commented on Dec 20, 2021

@Rigidoont

In v3.0 there is no problem with popover not closing itself. However, it’s still not possible to specify exact element inside the Shadow DOM that the popover should be appended to. I made a pull request to allow providing a callback to the container option so that the container could be resolved dynamically.

pythonking2907

pythonking2907 commented on Jan 14, 2022

@pythonking2907

@@ -1,3 +1,17 @@

3.0.0-beta.20 (2022-01-13)

Bug Fixes

  • exclude popper content from target nodes (dcd6159)

Features

  • add popper methods show/hide to createTooltip() (bf2bb49)

3.0.0-beta.19 (2022-01-13)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions

      Support Shadow DOM · Issue #346 · Akryum/floating-vue