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

Implement Portal Logic for UpWindowAngularComponent #13

Merged
merged 2 commits into from
Oct 17, 2024

Conversation

lucasferreiralimax
Copy link
Member

This PR introduces the implementation of portal logic to the UpWindowAngularComponent. The portal logic allows the modal window to be rendered dynamically within the document.body, ensuring that it remains visually separate from the component's parent DOM structure and manages focus trapping for accessibility.

Changes Made:

  • Introduced addModalToBody and removeModalFromBody methods for managing the lifecycle of the modal window.
  • Added focus trap functionality to maintain keyboard navigation within the modal.
  • Updated the ngAfterViewInit lifecycle hook to append the modal to document.body.
  • Implemented cleanup logic to remove the modal from the DOM upon component destruction (ngOnDestroy).
  • Added unit tests to verify that the modal is properly added and removed from the body, and that focus trapping behaves as expected.
  • Modified existing unit tests to accommodate the portal functionality.

Testing:

  • Unit tests added to ensure the correct behavior of the portal logic and focus management.
  • Manual testing to confirm that the modal behaves correctly in terms of opening, closing, and accessibility (focus management).

Screenshots:
Screenshot 2024-10-17 034125

@lucasferreiralimax lucasferreiralimax self-assigned this Oct 17, 2024
@lucasferreiralimax lucasferreiralimax linked an issue Oct 17, 2024 that may be closed by this pull request
@lucasferreiralimax lucasferreiralimax merged commit 0e66a3c into master Oct 17, 2024
1 check passed
Copy link

Visit the preview URL for this PR (updated for commit a50c273):

https://up-window-angular--pr13-portal-window-20vn1nh0.web.app

(expires Thu, 24 Oct 2024 06:43:03 GMT)

🔥 via Firebase Hosting GitHub Action 🌎

Sign: 7822e0d6e40bbbcb5ceaa0eda2c38488d7b613f8

@lucasferreiralimax lucasferreiralimax deleted the portal-window branch October 17, 2024 07:00
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request hacktoberfest
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Implement Portal Logic for UpWindowAngularComponent
1 participant