Restore focus on focusout

src/vaadin-overlay.html

@@ -405,6 +405,18 @@
         // and <vaadin-context-menu>).
         this.addEventListener('click', () => {});
         this.$.backdrop.addEventListener('click', () => {});
+
+        // Make sure the focus stays within the overlay (even on caret browsing)
+        this.addEventListener('focusout', e => {
+          const related = e.relatedTarget;
+          if (this.focusTrap && (!related || !this._deepContains(related))) {
+            setTimeout(() => {
+              this.tabIndex = -1;
+              this.focus();
+              this.tabIndex = undefined;
+            });
+          }
+        });
       }
 
       _detectIosNavbar() {

test/focus-trap.html

@@ -167,6 +167,25 @@
           overlay.opened = true;
         });
 
+        it('should restore focus on focusout', done => {
+          const spy = sinon.spy(overlay, 'focus');
+          overlay.dispatchEvent(new CustomEvent('focusout'));
+          setTimeout(() => {
+            expect(spy.called).to.be.true;
+            done();
+          });
+        });
+
+        it('should not restore focus on focusout if not a focustrap', done => {
+          overlay.focusTrap = false;
+          const spy = sinon.spy(overlay, 'focus');
+          overlay.dispatchEvent(new CustomEvent('focusout'));
+          setTimeout(() => {
+            expect(spy.called).to.be.false;
+            done();
+          });
+        });
+
         it('should properly detect focusable elements inside the content', () => {
           expect(focusableElements.length).to.eql(11);
           expect(focusableElements[0]).to.eql(overlay.content.querySelector('textarea'));