Salesforce Decode
Salesforcedecode
Back to questions
LWCIntermediatemodaluxa11y

Implement LWC modal and focus trap patterns

Real World Scenario

Custom modal allows background scroll and loses focus causing accessibility audit failure.

Expected Answer

• lightning-modal platform component preferred • Custom modal: role dialog aria-modal true focus first element • Backdrop click and Escape key close handlers • Restore focus to trigger element on close • Prevent body scroll when modal open • Stacked modal z-index management carefully

Follow-Up Questions & Answers

Click to expand — each follow-up includes a direct, interview-ready answer

Main difference: use case and scale. lightning-modal platform component preferred. Custom modal: role dialog aria-modal true focus first element. Pick based on your integration pattern and team capability. Modals are accessibility minefields—use platform modal unless requirement impossible. Balance speed of delivery with maintainability.

Architect Perspective

Modals are accessibility minefields—use platform modal unless requirement impossible.