Focus management (focus trap)

[simobari]

Hello there,

wondering why you haven't implemented the focus trap inside the dialog as advised here:

https://www.w3.org/TR/wai-aria-practices-1.1/examples/dialog-modal/dialog.html

I think it's fundamental to define the Modal accessible.

Thanks

[dotherightthing]

Modaal/source/js/modaal.js

Lines 209 to 259 in 68a5abc

	// Body keydown
	self.dom.on('keydown.Modaal', function(e) {
	var key = e.keyCode;
	var target = e.target;
	// look for tab change and reset focus to modal window
	// done in keydown so the check fires repeatedly when you hold the tab key down
	if (key == 9 && self.scope.is_open) {
	if (!$.contains(document.getElementById(self.scope.id), target) ) {
	$('#' + self.scope.id).find('*[tabindex="0"]').focus();
	}
	}
	});
	// Body keyup
	self.dom.on('keyup.Modaal', function(e) {
	var key = e.keyCode;
	var target = e.target;
	if ( (e.shiftKey && e.keyCode == 9) && self.scope.is_open) {
	// Watch for shift + tab key press. if open shift focus to close button.
	if (!$.contains(document.getElementById(self.scope.id), target) ) {
	$('#' + self.scope.id).find('.modaal-close').focus();
	}
	}
	if ( !self.options.is_locked ){
	// On escape key press close modal
	if (key == 27 && self.scope.is_open ) {
	if ( $(document.activeElement).is('input:not(:checkbox):not(:radio)') ) {
	return false;
	}
	self.modaal_close();
	return;
	}
	}
	// is gallery open and images length is > 1
	if ( self.options.type == 'image' ) {
	// arrow left for back
	if (key == 37 && self.scope.is_open && (!$('#' + self.scope.id + ' .modaal-gallery-prev').hasClass('is_hidden')) ) {
	self.gallery_update('prev');
	}
	// arrow right for next
	if (key == 39 && self.scope.is_open && (!$('#' + self.scope.id + ' .modaal-gallery-next').hasClass('is_hidden')) ) {
	self.gallery_update('next');
	}
	return;
	}
	});

watch_events() appears to handle this already. However when I test this, the focus is still 'lost' for a couple of tab presses. One of these is a top-of-page skip link. I'm unsure if this is a problem with our codebase or not.