Novvum / graphql-birdseye

View any GraphQL schema as a dynamic and interactive graph. 🦅
http://birdseye.novvum.io/
MIT License
706 stars 21 forks source link

[BUG] Does not work in a web component #36

Open imolorhe opened 4 years ago

imolorhe commented 4 years ago

Describe the bug

Hey, any reason for not just passing this.paper.svg to svgPanZoom, instead of passing the SVG ID selector? I can see that svgPanZoom supports passing the svg element and not just the selector (https://github.com/ariutta/svg-pan-zoom/blob/master/src/svg-pan-zoom.js#L940).

Currently trying to integrate birdseye as a web component but this line causes svgPanZoom to fail when it tries to get the svg element using document.querySelector when the selector is passed instead of the element, with this error (Provided selector did not find any elements. Selector: #v-26). document.querySelector doesn't search through the shadow DOM of web components which is why it doesn't find the element. Passing the SVG element directly, svgPanZoom doesn't need to query the DOM for the element.

To Reproduce Steps to reproduce the behavior:

  1. Wrap birdseye as a web component

Expected behavior It should work when wrapped as a web component

Package The package this issue pertains to (i.e. core, react, etc.). core

rohit-ravikoti commented 4 years ago

Hey @imolorhe!

I can definitely get working on this-- schedule has been a bit crazy lately, but will try to get it done this week. If you feel so inclined, feel free to submit a PR and I'd be happy to review 🙂

imolorhe commented 4 years ago

Hey @rohit-ravikoti any update on this issue?