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

Proof of concept: Shadow DOM support #1877

Closed
wants to merge 7 commits into from

Conversation

petehunt
Copy link
Contributor

We can already render into shadow roots, this diff lets us listen to events inside shadow DOM.

@euforic
Copy link

euforic commented Jul 24, 2014

👍

@zpao
Copy link
Member

zpao commented Jul 31, 2014

Can you close #1167 if that's now out of date & not necessary?

@stuarts
Copy link

stuarts commented Sep 29, 2014

I'd be interested in this pull request being merged, if it's in the cards.

@sebmarkbage
Copy link
Collaborator

We'll have a different way of enabling custom elements that doesn't expose the internal class.

This needs to take into account detached containers. Surprised we don't have a test for that.

@stuarts
Copy link

stuarts commented Sep 30, 2014

Is there a branch for that or is it just in the planning stages?

@mathieuancelin
Copy link

Hey guys, any news on that one ?

The changes on ReactDOMComponent.js really makes the event system works within shadow DOM and it would be very cool to be able to mix React components and webcomponents using the shadow DOM.

@futurechan
Copy link

👍

@ziahamza
Copy link

Any plans of implementing this? There are many use cases where this can be really helpful, expecially for building browser extentions where shadow dom is used to ecapsulate the CSS and the DOM from the rest of the page

@kristianmandrup
Copy link

Awesome!!! 👍

@molst
Copy link

molst commented Mar 18, 2015

Hi there,
We use React as the primary component library, but also loads remote (HTML-imported) React components (and components written in other frameworks) that needs to be rendered in shadow DOM's. Hope this get merged soon!

@sebmarkbage
Copy link
Collaborator

The right solution is to use event.path to dispatch the event to the inner React component's ID. So I'm going to close this out. We'll still implement event handling the shadow DOM but a different technique.

@Wildhoney
Copy link
Contributor

var doc = container.nodeType === ELEMENT_NODE_TYPE ? container.ownerDocument : container;

I've cursed these 3 lines a thousand times when writing the Maple library for React. In the end I took the approach of sending events to each element in the event.path object which seems to be acceptable, but would love to remove the functionality entirely in favour of a pure React approach that is Shadow DOM aware.

@gurkerl83
Copy link

+1 on the Shadow DOM aware suggestion!

munen added a commit to 200ok-ch/pdf-viewer that referenced this pull request Jun 21, 2015
 * Remove `shadowRoot`
 * Reason: React does not bind events to the correct container inside a
   webcomponent, so events would not bubble
   * See: facebook/react#1877
 * Note: Lucuma 0.5.0 will remove support for shadowRoot!
@DimitryDushkin
Copy link

Why not merge?

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

Successfully merging this pull request may close these issues.