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

Ripples: not implemented #175

Open
1 task
berenddeboer opened this issue Apr 15, 2019 · 2 comments
Open
1 task

Ripples: not implemented #175

berenddeboer opened this issue Apr 15, 2019 · 2 comments

Comments

@berenddeboer
Copy link
Collaborator

We have the following issues with ripples:

  • MDC does ripples on the next animation frame, checking if the current component is active, in order to prevent ancestor ripples. We don't do that, so we get double ripples for example in a list with a radio button. Perhaps the workaround of not rippling the li element in case we know we are rendering a radio group might be better.
@aforemny
Copy link
Owner

aforemny commented Jun 16, 2019

I was just looking into this, but then I noticed that the MDC demo suffers from the same problem, so maybe it is by design? MDC's List demo, see List with Trailing Checkbox.

As a work-around one could wrap the the radio button in a div that stops event propagation on mousedown, pointerdown and touchstart events.

I have also experimented with a potential solution to this here: 9fa1d19. Assuming that the node that ripples (think list item) has an id, we can traverse from the event target (think radio button's <input>) to the list item, and see if there are any nodes that have the mdc-ripple-upgraded class. In that case, the list item does not ripple.

But now I am wondering if we should include this?

@berenddeboer
Copy link
Collaborator Author

Does the MDC demo have the same thing? For checkboxes we do exactly the same, so that looks good, but for radio you'll notice they only ripple the radio button.

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

2 participants