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

Dismiss modal on backdrop click & prevent event bubbling on modal. #200

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

prajwalkulkarni
Copy link

Issue Number

fixes #199

Describe the changes you've made
Added onClick listener on the modal backdrop. But, since the div that holds the actual modal is the child of the whole modal container, clicking on the modal would also dismiss the modal, this is an undesired behavior, and to avoid such behaviors, I've prevented event bubbling from the child div to the outer div(backdrop) by using e.stopPropagation().

Describe if there is any unusual behavior (Any Warning) of your code(Write NA if there isn't)
NA

Additional context (OPTIONAL)

Test plan (OPTIONAL)

A good test plan should give instructions that someone else can easily follow.

Go to any story, and click on the share button. You'll then be presented with a modal containing social media icons to share the story. Click on the backdrop and the modal will be dismissed. Alternatively, the close button(x) can also be clicked to dismiss the modal.
Checklist

  • My code follows the code style of this project.
  • My change requires a change to the documentation.
  • I have updated the documentation accordingly.
  • All new and existing tests passed.
  • The title of my pull request is a short description of the requested changes.

Provide a Deployed link of route/page that needs to review

Preview: Deploy preview link here with the appropriate route

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.

Dismiss modal on backdrop click
2 participants